I try to change the background of the Congratulations page in Anki desktop to an image, but I don’t manage to find the place where the change need to take place (looked at ‘Anki-main/ts/congrats’ and ‘_aqt/data/pages’ and more).
Can you give me a clue for the right place?
Thank you
1 Like
Here is an example of an add-on that sets an image as the background of the congrats page.
- Place the following three files in the root folder of your add-on:
__init__.py
background.css
background.png
__init__.py
from pathlib import Path
from string import Template
from aqt import mw
from aqt.gui_hooks import webview_did_inject_style_into_page
from aqt.webview import AnkiWebView
addon_root = Path(__file__).resolve().parent
css_path = f"/_addons/{addon_root.name}/background.css"
js = Template(
"""
{
const link = document.createElement("link");
link.href = "${css_path}";
link.rel = "stylesheet";
document.head.appendChild(link);
}
"""
).substitute(css_path=css_path)
def on_webview_did_inject_style_into_page(webview: AnkiWebView) -> None:
if webview.page().url().path().endswith("congrats.html"):
webview.eval(js)
mw.addonManager.setWebExports(__name__, r".+\.(css|png)")
webview_did_inject_style_into_page.append(on_webview_did_inject_style_into_page)
background.css
body {
background: url("background.png");
background-size: cover;
}
6 Likes
Thank you!!
I will give it a go
This topic was automatically closed 30 days after the last reply. New replies are no longer allowed.