Custom Styles (font color, background colour, classes)
0.18MB. Updated 2021-03-03.
The author has shared 13 other
item(s).
Description
Download
As add-ons are programs downloaded from the internet, they are potentially malicious. You should only download add-ons you trust.
Supported Anki versions:
- 2.1.0-2.1.23 (Updated 2020-01-23)
- 2.1.24-2.1.40 (Updated 2020-09-20)
- 2.1.41+ (Updated 2021-03-03)
To download this add-on, please copy and paste the following code into Anki 2.1:
1899278645
If you were linked to this page from the internet, please open Anki on your computer, go to the Tools menu and then Add-ons>Browse & Install to paste in the code.
All Anki 2.1.x Add-Ons Contact Author
Reviews

Addon is broken in Anki 2.1.56 ,

Error:
Anki 2.1.55 (01caec2a) Python 3.9.15 Qt 6.3.2 PyQt 6.3.1
Platform: macOS-13.1-x86_64-i386-64bit
Flags: frz=True ao=True sv=2
Add-ons, last update check: 2022-12-16 15:33:52
Add-ons possibly involved: Custom Styles font color background colour classes
Caught exception:
Traceback (most recent call last):
File "/Users/cso/Library/Application Support/Anki2/addons21/1899278645/main_window.py", line 35, in on_settings
dialog = MainConfDialog(getconfig())
File "/Users/cso/Library/Application Support/Anki2/addons21/1899278645/confdialog/__init__.py", line 52, in __init__
self.init_tables()
File "/Users/cso/Library/Application Support/Anki2/addons21/1899278645/confdialog/__init__.py", line 216, in init_tables
self.set_table(self.bo.tw_active, self.active)
File "/Users/cso/Library/Application Support/Anki2/addons21/1899278645/confdialog/__init__.py", line 222, in set_table
widget.setSelectionBehavior(QTableView.SelectRows)
AttributeError: type object 'QTableView' has no attribute 'SelectRows'
Anki 2.1.55 (01caec2a) Python 3.9.15 Qt 6.3.2 PyQt 6.3.1
Platform: macOS-13.1-x86_64-i386-64bit
Flags: frz=True ao=True sv=2
Add-ons, last update check: 2022-12-16 15:33:52
Add-ons possibly involved: Custom Styles font color background colour classes
Caught exception:
Traceback (most recent call last):
File "/Users/cso/Library/Application Support/Anki2/addons21/1899278645/main_window.py", line 35, in on_settings
dialog = MainConfDialog(getconfig())
File "/Users/cso/Library/Application Support/Anki2/addons21/1899278645/confdialog/__init__.py", line 52, in __init__
self.init_tables()
File "/Users/cso/Library/Application Support/Anki2/addons21/1899278645/confdialog/__init__.py", line 216, in init_tables
self.set_table(self.bo.tw_active, self.active)
File "/Users/cso/Library/Application Support/Anki2/addons21/1899278645/confdialog/__init__.py", line 222, in set_table
widget.setSelectionBehavior(QTableView.SelectRows)
AttributeError: type object 'QTableView' has no attribute 'SelectRows'

Working nicely in 2.1.49. I'm in love with the GUI, not only I don't have to mess with any python files, it also lets me "deactivate" things I don't want in the context menu without having to completely delete them (easy to recover if needed). Really appreciate that extra effort from the dev!
PS: I hit "no" to the auto-insert to all cards at the start because I was scared, haha. But adding the @import url("_editor_button_styles.css"); to my Card Styling works like a charm.
PS: I hit "no" to the auto-insert to all cards at the start because I was scared, haha. But adding the @import url("_editor_button_styles.css"); to my Card Styling works like a charm.

This is an essential function to Anki. This must be integrated into Anki.

It doesn't work at all, nearly all my cards are not compatible or sth.
It says: You have the add-on "Custom Styles font color background colour classes" installed. This add-on will NOT work with these note types:
It says: You have the add-on "Custom Styles font color background colour classes" installed. This add-on will NOT work with these note types:

font-family cannot be changed. Would you be kond enough to fix this bug?QAQ

Not version 2.1.54

essential tool!
thank you!
thank you!

Essential. Please update to newer versions of anki (2.1.54 Qt6).

It doesn't run with new update 2.1.54 Qt5 ... Hoping you guys will be able to do something

I have been using it for years but it doesn't function in the newer anki (2.1.51 and up). I hope you will update it soon

An absolute essential for me. It's extremely powerful as you can add your own styles with custom HTML/CSS. It has a few quirks with editing, removing formatting and stuff like that but nothing too bad. Especially since Anki now has a colored HTML editor, simply toggle it and there you'll be able to quickly remove the formatting or solve your small issues. All of this is detailed in the very in depth add-on page.
It's not the simplest "enhanced editor" addon, put it certainly is the most powerful and customizable. I've been using it for a while and it's a game changer in my card creation routine.
EDIT : I'm using it on 2.1.49 without issues.
It's not the simplest "enhanced editor" addon, put it certainly is the most powerful and customizable. I've been using it for a while and it's a game changer in my card creation routine.
EDIT : I'm using it on 2.1.49 without issues.

addons worked perfectly.
please update!
please update!

Very nice ADDON,
glad to have the "text wrapper" feature
i'm using it to insert selected in a formatted <table></table> environnement
time saver! thank you
glad to have the "text wrapper" feature
i'm using it to insert selected in a formatted <table></table> environnement
time saver! thank you

Works PERFECTLY, thanks!

sorry
Comment from author before post was edited
This shouldn't happen ...
The information you provide does not suffice to give definite advice.
A general idea: At the top of my description of this add-on there is this bold sentence: "You must adjust the styling section of your templates. Otherwise your markup won't be shown while reviewing. Check the section "# Setup" below.". This means: Each note type must have the string @import url("_editor_button_styles.css"); at the beginning/top(!) of the "Styling" section in the "Card Types for ..." window."
Styling section refers to https://apps.ankiweb.net/docs/manual.html#card-styling (watch the linked video).
Does this help? If your problem still persists after this: Could you export a deck that contains one affecte note/card and share it with me (e.g. send me a link)? Then it's much easier to figure out the problem and maybe help.
You can also reach me on github and on reddit (/u/ijgnord).
The information you provide does not suffice to give definite advice.
A general idea: At the top of my description of this add-on there is this bold sentence: "You must adjust the styling section of your templates. Otherwise your markup won't be shown while reviewing. Check the section "# Setup" below.". This means: Each note type must have the string @import url("_editor_button_styles.css"); at the beginning/top(!) of the "Styling" section in the "Card Types for ..." window."
Styling section refers to https://apps.ankiweb.net/docs/manual.html#card-styling (watch the linked video).
Does this help? If your problem still persists after this: Could you export a deck that contains one affecte note/card and share it with me (e.g. send me a link)? Then it's much easier to figure out the problem and maybe help.
You can also reach me on github and on reddit (/u/ijgnord).

so far so good but I'd really like to be able to use undo (ctrl+z) instead of manually removing added format.

Work very well for me. Using to format 'code' text:
+ can customize own style _ shortcut _ padding (many with CSS)
+ quick response (add and remove)
+ can customize own style _ shortcut _ padding (many with CSS)
+ quick response (add and remove)

Very useful

This is great thank you so much

I really like it but I couldn't remove the formating and I've tried with the setting but didn't work

For copying the style of a specific text from a field to another, one could simply highlight, then drag and drop the desired text with formatting to a different field within the same Add Card window... Also, is it possible to see the resulting style from this add-on in the HTML Editor (Ctrl+Shift+X)? If so, one could also go into the editor, copy the HTML of a text, and then paste in the HTML Editor of a field in another Add Card window to keep the same style...
Comment from author
Why not just use the provided shortcuts?

Alert Alert Alert Alert Alert Alert Alert Alert Alert Alert Alert Alert Alert Alert Alert
🚨🚨🚨🚨🚨🚨🚨🚨🚨🚨🚨🚨🚨🚨🚨🚨🚨🚨🚨🚨🚨🚨🚨🚨🚨🚨🚨🚨
if you use this add-on you must be noted.
the function is work on change HTML therefore in some of cause you can not use Anki search function to search the content which you marked
🚨🚨🚨🚨🚨🚨🚨🚨🚨🚨🚨🚨🚨🚨🚨🚨🚨🚨🚨🚨🚨🚨🚨🚨🚨🚨🚨🚨
if you use this add-on you must be noted.
the function is work on change HTML therefore in some of cause you can not use Anki search function to search the content which you marked
Comment from author
What are you talking about? You can still search text you marked. Could you name a concrete example? This add-on has many thousand users, including me, and this is the first time I heard this.

Error
An error occurred. Please start Anki while holding down the shift key, which will temporarily disable the add-ons you have installed.
If the issue only occurs when add-ons are enabled, please use the Tools > Add-ons menu item to disable some add-ons and restart Anki, repeating until you discover the add-on that is causing the problem.
When you've discovered the add-on that is causing the problem, please report the issue on the add-on support site.
Debug info:
Anki 2.1.26 (70784154) Python 3.8.0 Qt 5.13.1 PyQt 5.14.1
Platform: Mac 10.15.7
Flags: frz=True ao=True sv=2
Add-ons, last update check: 2021-01-02 16:49:38
Add-ons possibly involved: Custom Styles font color background colour classes
Caught exception:
Traceback (most recent call last):
File "aqt/editor.py", line 334, in checkFocus
File "/Users/oqhan/Library/Application Support/Anki2/addons21/1899278645/editor/shortcuts_buttons.py", line 36, in <lambda>
cuts.append((e["Hotkey"], lambda s=e["Setting"], f=func: f(editor, s)))
File "/Users/oqhan/Library/Application Support/Anki2/addons21/1899278645/editor/editor_apply_categories.py", line 27, in my_wrap_helper
before, after = beforeAfter.split(unique_string)
ValueError: not enough values to unpack (expected 2, got 1)
An error occurred. Please start Anki while holding down the shift key, which will temporarily disable the add-ons you have installed.
If the issue only occurs when add-ons are enabled, please use the Tools > Add-ons menu item to disable some add-ons and restart Anki, repeating until you discover the add-on that is causing the problem.
When you've discovered the add-on that is causing the problem, please report the issue on the add-on support site.
Debug info:
Anki 2.1.26 (70784154) Python 3.8.0 Qt 5.13.1 PyQt 5.14.1
Platform: Mac 10.15.7
Flags: frz=True ao=True sv=2
Add-ons, last update check: 2021-01-02 16:49:38
Add-ons possibly involved: Custom Styles font color background colour classes
Caught exception:
Traceback (most recent call last):
File "aqt/editor.py", line 334, in checkFocus
File "/Users/oqhan/Library/Application Support/Anki2/addons21/1899278645/editor/shortcuts_buttons.py", line 36, in <lambda>
cuts.append((e["Hotkey"], lambda s=e["Setting"], f=func: f(editor, s)))
File "/Users/oqhan/Library/Application Support/Anki2/addons21/1899278645/editor/editor_apply_categories.py", line 27, in my_wrap_helper
before, after = beforeAfter.split(unique_string)
ValueError: not enough values to unpack (expected 2, got 1)
Comment from author
I remember seeing this error before. However I think a restart fixed it, alternatively, try setting the shortcut again. Once I have a little free time, I will try to fix this issue, but it shouldn't prevent you from using the add-on. (Also, for the reader: this only affects text wrappers)

wonderful,it is great if it can work with the add-on Multi-column note editor

Very usefull!
Love you man
Love you man

Not gonna lie, one of these comments gave me a panic attack after I myself saw my Anki boot. Nevertheless, it did nothing but update all my cards so that the addon could work. Nothing got deleted! Pretty cool stuff and helpful addon dude. I appreciate the work you put into this! Thank you.
Comment from author
Yeah, like I said, this add-on does not touch cards in any shape or form! I'm glad you enjoy it.

Exactly what I was looking for!

Excelente! Muito Obrigado.

The add-on is very useful for me.
After reading the prior downvote I panicked and checked the source code. But this add-on is really only modifying the css of note types and never touches individual notes or cards. It can't delete notes or cards.
After reading the prior downvote I panicked and checked the source code. But this add-on is really only modifying the css of note types and never touches individual notes or cards. It can't delete notes or cards.

Be very careful using this. I just applied it and was given a dialog saying it wanted to change some key settings. I said no because I wanted to ensure it wasn't messing with my cards. BIG MISTAKE- It deleted all my cards. Fortunately I was somewhat backed up, but I lost a couple cards. Please go back and reassess this. It doesn't seem compatible anymore.
Comment from author
Hi, I'm pretty sure there's misunderstanding here. When booting, the addon checks whether this line: "@import url("_editor_button_styles.css");" is in the Styling section of your card types, if not, it asks to insert this.
The add-on does not actually touch your cards, so there's no way it could delete any. This add-on has more than a thousand active users, and I heard of a lot of bugs, but that's the first time I heard that somebody's cards got deleted.
If you want to, you can try to recreate the bug and send the collection to me (over the AnkiF Forum or the GitHub page) and I'd love to have a look at it.
The add-on does not actually touch your cards, so there's no way it could delete any. This add-on has more than a thousand active users, and I heard of a lot of bugs, but that's the first time I heard that somebody's cards got deleted.
If you want to, you can try to recreate the bug and send the collection to me (over the AnkiF Forum or the GitHub page) and I'd love to have a look at it.

Can this be used for images?
Comment from author
What do you mean? Most of the styles affect text. What kind of style would you like to apply to an image?

Fantastic!

666方便

更新了最新的插件后,我发现我的卡牌在编辑模式下的荧光可以正常显示,但是预览/生成卡片会发现我所设置的背景荧光颜色就失效了,我个人分析了一下原因是不是span class="bg_green"这种语法涉及“引入”,而没有像<span style="background-color: rgb(252, 230, 167)【此可正常显示】指定具体的颜色?期待作者解决
Comment from author
When you write a review on ankiweb there's a message shown: "... want to report a problem with an add-on? If so, please go back and click on "Contact Author" instead."
For my add-on this leads you to https://forums.ankiweb.net/t/editor-apply-font-color-background-color-custom-class-custom-style-official-thread/550
It's much easier to help if you post there because there can be multiple replies. The information you provide in your review is not enough to say anything definitive.
Some preliminary ideas:
- The latest version of my add-on has been downloaded over 1000 times and it's the first time I hear about this problem. This likely means that the problem you have is not common or maybe even specific about your setup. To figure out what it is I'd need more details.
- Each note type must have the text @import url("_editor_button_styles.css"); at the beginning/top(!) of the "Styling" section in the "Card Types for ..." window."
- Try again with the latest version of Anki (which is 2.1.26 at the moment). Does this help?
- Disable all other add-ons, restart and try again. Does this help?
- From the main window click on Help->About. In the window that opens click the "Copy Debug Info" Button and share the copied text.)
- Could you export a note where you have the problem and send me a link to this shared anki deck (apkg) so that I can have a look at it.
For my add-on this leads you to https://forums.ankiweb.net/t/editor-apply-font-color-background-color-custom-class-custom-style-official-thread/550
It's much easier to help if you post there because there can be multiple replies. The information you provide in your review is not enough to say anything definitive.
Some preliminary ideas:
- The latest version of my add-on has been downloaded over 1000 times and it's the first time I hear about this problem. This likely means that the problem you have is not common or maybe even specific about your setup. To figure out what it is I'd need more details.
- Each note type must have the text @import url("_editor_button_styles.css"); at the beginning/top(!) of the "Styling" section in the "Card Types for ..." window."
- Try again with the latest version of Anki (which is 2.1.26 at the moment). Does this help?
- Disable all other add-ons, restart and try again. Does this help?
- From the main window click on Help->About. In the window that opens click the "Copy Debug Info" Button and share the copied text.)
- Could you export a note where you have the problem and send me a link to this shared anki deck (apkg) so that I can have a look at it.

Nice addon. However, I'm still waiting for the new releases. I tried pre-releases from github and it won't run.
Feature request: Wish can have full CSS support for custom class. For example, I could use something like .myclass:before {content: "xxx"}
Feature request: Wish can have full CSS support for custom class. For example, I could use something like .myclass:before {content: "xxx"}
Comment from author
> I'm still waiting for the new releases
What is your anki version? To find out your version in the main window click on "Help" in the menu bar, then select "About". A dialog "About anki" opens where you can see the version you use.
The latest version of my add-on depends on a feature in Anki that was introduced with 2.1.24. So the version from ankiweb and github won't work in older versions.
If you have Anki 2.1.24 or later and it still doesn't work: Maybe uninstall the add-on and reinstall it and restart. If it still doesn't work I suggest to continue this in the official forum (check the link in the upper right behind "contact author" or on github).
> Feature request: Wish can have full CSS support for custom class. For example, I could use something like .myclass:before {content: "xxx"}
I don't use pseudo elements or pseudo classes so the gui was not designed for this. If you have a good suggestion how I could add it to the config gui without confusing 99% of potential users make an issue on github. But this would not be too high on my todo list so it would take some time (months).
A workaround might be this: Create a custom css file in your media folder. you put a reference to this css file into all styling sections of all notes and also load it into the editor with a version of the add-on "Customize Editor Stylesheet". This was originally made by glutanimate, https://ankiweb.net/shared/info/1215991469. I have a forked version which doesn't require you to open and close Anki and which has a minimal built-in editor at https://github.com/ijgnd/anki__customize_editor_stylesheet . "Customize Editor Stylesheet" uses a file named "_editor.css" in your media folder. So you would need to put '@import url("_editor.css")' into all styling sections of all your notes/card types.
Then you could e.g. put this into editor.css:
.bold_underlined:before {
content: "some text: ";
}
The add-on "Wrapper meta-addon" (https://ankiweb.net/shared/info/396502676) allows to wrap a selected paragraph in multiple nested classes - check the config.json. This might also be useful for advanced styling.
What is your anki version? To find out your version in the main window click on "Help" in the menu bar, then select "About". A dialog "About anki" opens where you can see the version you use.
The latest version of my add-on depends on a feature in Anki that was introduced with 2.1.24. So the version from ankiweb and github won't work in older versions.
If you have Anki 2.1.24 or later and it still doesn't work: Maybe uninstall the add-on and reinstall it and restart. If it still doesn't work I suggest to continue this in the official forum (check the link in the upper right behind "contact author" or on github).
> Feature request: Wish can have full CSS support for custom class. For example, I could use something like .myclass:before {content: "xxx"}
I don't use pseudo elements or pseudo classes so the gui was not designed for this. If you have a good suggestion how I could add it to the config gui without confusing 99% of potential users make an issue on github. But this would not be too high on my todo list so it would take some time (months).
A workaround might be this: Create a custom css file in your media folder. you put a reference to this css file into all styling sections of all notes and also load it into the editor with a version of the add-on "Customize Editor Stylesheet". This was originally made by glutanimate, https://ankiweb.net/shared/info/1215991469. I have a forked version which doesn't require you to open and close Anki and which has a minimal built-in editor at https://github.com/ijgnd/anki__customize_editor_stylesheet . "Customize Editor Stylesheet" uses a file named "_editor.css" in your media folder. So you would need to put '@import url("_editor.css")' into all styling sections of all your notes/card types.
Then you could e.g. put this into editor.css:
.bold_underlined:before {
content: "some text: ";
}
The add-on "Wrapper meta-addon" (https://ankiweb.net/shared/info/396502676) allows to wrap a selected paragraph in multiple nested classes - check the config.json. This might also be useful for advanced styling.

Perfect for assigning custom span classes to portions of text!

It helps me a lot customizing my desire fonts!!

Great add-on for Anki. Thank you so much. It saves me a lot of time

This is super convenient for formatting inline code that appears in my fields. Thanks.

Great addon, saves me a lot of time. Good job and thank you!

save me lots of time, but backcolor and class doesn't work for me(except forecolor) ,my version is 2.1.20 (47a1bf8b)

Nicely done--saving me a lot of time when color-coding items!

One of the most bestest config interfaces.
> Thanks @Glutanimate for making this option available.
Sorry, what option? The possiblity to combine both add-ons? Are they compatible now?
> Thanks @Glutanimate for making this option available.
Sorry, what option? The possiblity to combine both add-ons? Are they compatible now?
Comment from author
I removed this sentence from the description. It was misleading. The add-ons are incompatible. My add-on includes all the necessary code.

Excellent! better than highlight add on multiple time.

Congratulations, this is one of the addons I use the most. Can you use it in browse? I mean, sometimes I create spreadsheet cards and I would like to edit them there. I talk about using the addon with hotkeys in browse. Thank you for this masterpiece.
Comment from author
Thanks for your kind words.
I'm not sure I understand. This add-on in general works in the browser window.
This add-on modifies the so-called Editor component of Anki. The Editor is used in the Add window, the Editcurrent window and at the bottom of the browser window. It's always the same code. But in the browser there's also a table component in the upper half of the window and the sidebar and the menu. All of these have their own shortcuts. If you have a shortcut in the Editor that is also used by other parts of the browser usually the editor shortcut is just ignored.
e.g. the default config of this add-on has "Alt+e" as a shortcut for "bg_blue". "Alt+e" in the browser is used to open the "Edit" from the menu. So the default shortcut from this add-on is ignored. I didn't care about this when creating the add-on because at this time I only used it in the Add window and for me easy-to-type shortcuts were more important ...
You could adjust your config.
If this doesn't solve your problem: It's easier to talk on https://github.com/ijgnd/anki__editor__apply__font_color__background_color__custom_class__custom_style/issues or via reddit (I'm /u/ijgnord).
About the shorcut: What should happen if you have multiple images or audio files in your note - open the first, open all?
I'm not sure I understand. This add-on in general works in the browser window.
This add-on modifies the so-called Editor component of Anki. The Editor is used in the Add window, the Editcurrent window and at the bottom of the browser window. It's always the same code. But in the browser there's also a table component in the upper half of the window and the sidebar and the menu. All of these have their own shortcuts. If you have a shortcut in the Editor that is also used by other parts of the browser usually the editor shortcut is just ignored.
e.g. the default config of this add-on has "Alt+e" as a shortcut for "bg_blue". "Alt+e" in the browser is used to open the "Edit" from the menu. So the default shortcut from this add-on is ignored. I didn't care about this when creating the add-on because at this time I only used it in the Add window and for me easy-to-type shortcuts were more important ...
You could adjust your config.
If this doesn't solve your problem: It's easier to talk on https://github.com/ijgnd/anki__editor__apply__font_color__background_color__custom_class__custom_style/issues or via reddit (I'm /u/ijgnord).
About the shorcut: What should happen if you have multiple images or audio files in your note - open the first, open all?

----201911。30
it may be not your fault,it may cause by add-on"Pokemanki (for both Anki 2.0 and 2.1)"
----2019.11.28 afternoon
So sad,when I add a note,there is a bug:
Error
An error occurred. Please start Anki while holding down the shift key, which will temporarily disable the add-ons you have installed.
If the issue only occurs when add-ons are enabled, please use the Tools>Add-ons menu item to disable some add-ons and restart Anki, repeating until you discover the add-on that is causing the problem.
When you've discovered the add-on that is causing the problem, please report the issue on the add-ons section of our support site.
Debug info:
Anki 2.1.15 (442df9d6) Python 3.6.7 Qt 5.12.1 PyQt 5.11.3
Platform: Windows 7
Flags: frz=True ao=True sv=1
Caught exception:
File "aqt\webview.py", line 322, in handler
File "aqt\editor.py", line 351, in <lambda>
File "aqt\addcards.py", line 187, in _addCards
File "aqt\addcards.py", line 171, in addNote
File "anki\collection.py", line 307, in addNote
File "anki\collection.py", line 458, in _newCard
File "anki\cards.py", line 78, in flush
<class 'AssertionError'>:
----2019.11.28
I used the batch option to add it to all templates,it works perfectly!
---
It‘s a good idea
I modify the config.json file,then,bg-color is beautiful,thx !
Bug Report:
but,even if I don't click the option "Write Link to CSS into every Template" at the top right of the add-on config,forecolor works,but backcolor just works on edit window not in preview or review window (I have tested it use basic note type,so it may not a problem of overwriting by some template CSS style),what's more,in some only versions it works(may be I used anki 2.0? I remember there was no GUI configuration window at that time)
it may be not your fault,it may cause by add-on"Pokemanki (for both Anki 2.0 and 2.1)"
----2019.11.28 afternoon
So sad,when I add a note,there is a bug:
Error
An error occurred. Please start Anki while holding down the shift key, which will temporarily disable the add-ons you have installed.
If the issue only occurs when add-ons are enabled, please use the Tools>Add-ons menu item to disable some add-ons and restart Anki, repeating until you discover the add-on that is causing the problem.
When you've discovered the add-on that is causing the problem, please report the issue on the add-ons section of our support site.
Debug info:
Anki 2.1.15 (442df9d6) Python 3.6.7 Qt 5.12.1 PyQt 5.11.3
Platform: Windows 7
Flags: frz=True ao=True sv=1
Caught exception:
File "aqt\webview.py", line 322, in handler
File "aqt\editor.py", line 351, in <lambda>
File "aqt\addcards.py", line 187, in _addCards
File "aqt\addcards.py", line 171, in addNote
File "anki\collection.py", line 307, in addNote
File "anki\collection.py", line 458, in _newCard
File "anki\cards.py", line 78, in flush
<class 'AssertionError'>:
----2019.11.28
I used the batch option to add it to all templates,it works perfectly!
---
It‘s a good idea
I modify the config.json file,then,bg-color is beautiful,thx !
Bug Report:
but,even if I don't click the option "Write Link to CSS into every Template" at the top right of the add-on config,forecolor works,but backcolor just works on edit window not in preview or review window (I have tested it use basic note type,so it may not a problem of overwriting by some template CSS style),what's more,in some only versions it works(may be I used anki 2.0? I remember there was no GUI configuration window at that time)
Comment from author before post was edited
First of all: Make sure to have a proper backup of your collection. Don't just rely on Anki's internal backups, https://apps.ankiweb.net/docs/manual.html#backups. Every startup overwrites the oldest copy. at some point all good copies might be overwritten with bad versions.
Maybe we need to exchange multiple posts: As I say in the add-on description it's much more convenient on reddit (I'm /u/ijgnord) or github, https://github.com/ijgnd/anki__editor__apply__font_color__background_color__custom_class__custom_style/blob/master/src/config.py .
The error you posted " line 78, in flush ... <class 'AssertionError'>" is triggered by this line from Anki, https://github.com/dae/anki/blob/master/anki/cards.py#L78
This error is caused by the fact that a card has an illegal due value. Your due value is a number but it's larger than 4294967296.
In old Anki versions there's a bug that may cause cards to get too large due numbers, see https://anki.tenderapp.com/kb/problems/new-cards-with-a-due-number-1000000
What other add-ons do you have? When you go to the browser do you see cards that have due numbers that are too high?
Before you do this I would check https://anki.tenderapp.com/kb/problems/when-problems-occur and as this suggests check the database.
The due value large number bug can also be causes by add-ons. But only by add-ons that affect the scheduling.
I see that the coincidence of using my add-on and the first occurence of the bug doesn't look good for my add-on. But my add-on has no effect on the scheduling at all:
My add-on doesn't modify the Anki database directly. Instead my option "Write Link to CSS into every Template" only uses functions from Anki for modifying the styling section of your NOTE types. I can't imagine how this affects the scheduling of CARDS.
Check for yourself: https://github.com/ijgnd/anki__editor__apply__font_color__background_color__custom_class__custom_style/blob/master/src/color_style_class_buttons.py#L257 . The functions my code uses are from https://github.com/dae/anki/blob/master/anki/models.py. (Anki internally labels "note types" as models).
Does this solve your problem? If not let's continue on reddit or github - I still have some ideas. If this solves your problem could you update your reviews so that they are about the add-on.
Maybe we need to exchange multiple posts: As I say in the add-on description it's much more convenient on reddit (I'm /u/ijgnord) or github, https://github.com/ijgnd/anki__editor__apply__font_color__background_color__custom_class__custom_style/blob/master/src/config.py .
The error you posted " line 78, in flush ... <class 'AssertionError'>" is triggered by this line from Anki, https://github.com/dae/anki/blob/master/anki/cards.py#L78
This error is caused by the fact that a card has an illegal due value. Your due value is a number but it's larger than 4294967296.
In old Anki versions there's a bug that may cause cards to get too large due numbers, see https://anki.tenderapp.com/kb/problems/new-cards-with-a-due-number-1000000
What other add-ons do you have? When you go to the browser do you see cards that have due numbers that are too high?
Before you do this I would check https://anki.tenderapp.com/kb/problems/when-problems-occur and as this suggests check the database.
The due value large number bug can also be causes by add-ons. But only by add-ons that affect the scheduling.
I see that the coincidence of using my add-on and the first occurence of the bug doesn't look good for my add-on. But my add-on has no effect on the scheduling at all:
My add-on doesn't modify the Anki database directly. Instead my option "Write Link to CSS into every Template" only uses functions from Anki for modifying the styling section of your NOTE types. I can't imagine how this affects the scheduling of CARDS.
Check for yourself: https://github.com/ijgnd/anki__editor__apply__font_color__background_color__custom_class__custom_style/blob/master/src/color_style_class_buttons.py#L257 . The functions my code uses are from https://github.com/dae/anki/blob/master/anki/models.py. (Anki internally labels "note types" as models).
Does this solve your problem? If not let's continue on reddit or github - I still have some ideas. If this solves your problem could you update your reviews so that they are about the add-on.

It‘s a good idea
I modify the config.json file,then,bg-color is beautiful,thx !
Bug Report:
but,even if I don't click the option "Write Link to CSS into every Template" at the top right of the add-on config,forecolor works,but backcolor just works on edit window not in preview or review window (I have tested it use basic note type,so it may not a problem of overwriting by some template CSS style),what's more,in some only versions it works(may be I used anki 2.0? I remember there was no GUI configuration window at that time)
I modify the config.json file,then,bg-color is beautiful,thx !
Bug Report:
but,even if I don't click the option "Write Link to CSS into every Template" at the top right of the add-on config,forecolor works,but backcolor just works on edit window not in preview or review window (I have tested it use basic note type,so it may not a problem of overwriting by some template CSS style),what's more,in some only versions it works(may be I used anki 2.0? I remember there was no GUI configuration window at that time)
Comment from author
- forecolor uses inlinestyling so it works in the reviewer without adjusting the styling section of your card templates.
- if a class is shown in the editor but not the reviewer/previewer this indicates that the css is missing from the styling section. Either manually add it all templates or use the batch option to add it to all templates.
- you can also use an inline option to insert the background color
- also have a look at the limitations and alternative section.
- if a class is shown in the editor but not the reviewer/previewer this indicates that the css is missing from the styling section. Either manually add it all templates or use the batch option to add it to all templates.
- you can also use an inline option to insert the background color
- also have a look at the limitations and alternative section.

Fantastic add-on.
I would dare to ask you something, if you think it would be usefull.
I loved the "apply span class" function, but many times the blocks that I need to config are based in "div" styling rather than "span" styling. This way I can use a border, a different background color to call atention to that piece of text, any of these styling config having a given meaning to me (for example, I have a div config for quotations, another to expose contradictions between that author and others, another to my mnemonics, etc).
Woul it not be possible to add another category, allowing to apply a div class to the selected text, rather than to apply a span class?
Thank you so much!
I would dare to ask you something, if you think it would be usefull.
I loved the "apply span class" function, but many times the blocks that I need to config are based in "div" styling rather than "span" styling. This way I can use a border, a different background color to call atention to that piece of text, any of these styling config having a given meaning to me (for example, I have a div config for quotations, another to expose contradictions between that author and others, another to my mnemonics, etc).
Woul it not be possible to add another category, allowing to apply a div class to the selected text, rather than to apply a span class?
Thank you so much!
Comment from author
thanks for your kind words.
Your idea seems useful and I would like to have it in the next version. But at the moment I'm busy and since I don't use this feature it's low priority for me. So maybe I'll never do it or it'll take some time (pull requests are welcome ...)
If you can live without span classes you could edit the source code and replace "span" with "div". It should be just two words in one line: https://github.com/ijgnd/anki__editor__apply__font_color__background_color__custom_class__custom_style/blob/master/src/functions.py#L45. Then restart anki. be prepared to restore from a backup. Try it out before you rely on it. Maybe also eight lines up in Line 37 if you also want to use div styles. Once I finish add-ons I usually forget the code structure very quickly. So I might have missed something.
To see the source code in the latest version of Anki (2.1) go to the add-on manager (main window->Tools->Add-ons), then select this add-on and click the button "View Files" (which is below the "Config" button). Then your file manager should open and show you a file named "functions.py" in a folder named "1899278645". use a text editor to change it.
Your idea seems useful and I would like to have it in the next version. But at the moment I'm busy and since I don't use this feature it's low priority for me. So maybe I'll never do it or it'll take some time (pull requests are welcome ...)
If you can live without span classes you could edit the source code and replace "span" with "div". It should be just two words in one line: https://github.com/ijgnd/anki__editor__apply__font_color__background_color__custom_class__custom_style/blob/master/src/functions.py#L45. Then restart anki. be prepared to restore from a backup. Try it out before you rely on it. Maybe also eight lines up in Line 37 if you also want to use div styles. Once I finish add-ons I usually forget the code structure very quickly. So I might have missed something.
To see the source code in the latest version of Anki (2.1) go to the add-on manager (main window->Tools->Add-ons), then select this add-on and click the button "View Files" (which is below the "Config" button). Then your file manager should open and show you a file named "functions.py" in a folder named "1899278645". use a text editor to change it.

i have absolutely no idea if this is possible, but I downloaded this to remove highlighting (rather than make it a different color or rather than clicking the "remove all formatting" button, I just want it gone), especially since half the deck I downloaded has this very dumb issue:
- they probably had cards that had highlights in them
- since they couldn't figure out how to remove highlights, they just made a new highlight color the same as the background color for the card
the problem is that we have different background colors (mine is light purple, theirs is boring ass gray), so all the new cards come up with gray highlighted text where words should be. sometimes, even removing the formatting doesn't get rid of this.
I guess I'm asking is there any way to add a "remove highlight" feature that doesn't involve having to remove formatting? It's taking way too much time to work around this fix, and a simple remove highlighting/text background button would solve so many problems. I'm so sry that i'm needy, plz forgiv
edit 1
another way to ask this is: if there's no way to just remove highlighting, is there a way to input code to allow RGBA color coding rather than just hex to allow for opacity to be changed for the highlightingcolor?
edit 2: sry i only downvoted bc i didn't know if you were going to respond😶won't do it again
edit 3: unfortunately, it was neither of those (class, uniform); it was his random will to highlight factoids he found important and i've just resorted to changing the text color to deal with it. i'm crying on the inside. but thank you so much for your help!! if you ever do find a way to add something like this, I'll keep checking intermittently. (this gives me a new appreciation for Microsoft Word or UWorld, when you just click highlight again, and it just... takes the highlight away)
- they probably had cards that had highlights in them
- since they couldn't figure out how to remove highlights, they just made a new highlight color the same as the background color for the card
the problem is that we have different background colors (mine is light purple, theirs is boring ass gray), so all the new cards come up with gray highlighted text where words should be. sometimes, even removing the formatting doesn't get rid of this.
I guess I'm asking is there any way to add a "remove highlight" feature that doesn't involve having to remove formatting? It's taking way too much time to work around this fix, and a simple remove highlighting/text background button would solve so many problems. I'm so sry that i'm needy, plz forgiv
edit 1
another way to ask this is: if there's no way to just remove highlighting, is there a way to input code to allow RGBA color coding rather than just hex to allow for opacity to be changed for the highlightingcolor?
edit 2: sry i only downvoted bc i didn't know if you were going to respond😶won't do it again
edit 3: unfortunately, it was neither of those (class, uniform); it was his random will to highlight factoids he found important and i've just resorted to changing the text color to deal with it. i'm crying on the inside. but thank you so much for your help!! if you ever do find a way to add something like this, I'll keep checking intermittently. (this gives me a new appreciation for Microsoft Word or UWorld, when you just click highlight again, and it just... takes the highlight away)
Comment from author
Where does this add-on promise or advertise to remove some style or highlight?
From a technical point of view there are many different ways to apply a background color to text in Anki/html. In some cases removing the background color should be simple in others it would be complicated and might fail sometimes or have unintended side effects.
PSA for future feature requests: Downvoting is a great way to discourage an add-on dev from ever producing it.
Update:
In the latest version of my add-on I use a component from the underlying toolkit for color seletion. As far as I see there's no way to modify this, see https://doc.qt.io/qt-5/qcolordialog.html.
After downloading the deck I would have looked at the html source code of the fields to identify how they apply the style: If it's a class change the class in the css. if it's always the same inline styling like <span style="background-color: rgb(234, 93, 223);"> a global search and replace might have helped with the problem, https://apps.ankiweb.net/docs/manual.html#find-and-replace
Update 2: Don't forget you're talking to someone who only started with some programming a year ago to add some functions I miss to Anki. I hardly need html/css for this so my knowledge is quite limited in this area. To remove some html markup maybe this is somewhat useful: https://ankiweb.net/shared/info/1043915942
From a technical point of view there are many different ways to apply a background color to text in Anki/html. In some cases removing the background color should be simple in others it would be complicated and might fail sometimes or have unintended side effects.
PSA for future feature requests: Downvoting is a great way to discourage an add-on dev from ever producing it.
Update:
In the latest version of my add-on I use a component from the underlying toolkit for color seletion. As far as I see there's no way to modify this, see https://doc.qt.io/qt-5/qcolordialog.html.
After downloading the deck I would have looked at the html source code of the fields to identify how they apply the style: If it's a class change the class in the css. if it's always the same inline styling like <span style="background-color: rgb(234, 93, 223);"> a global search and replace might have helped with the problem, https://apps.ankiweb.net/docs/manual.html#find-and-replace
Update 2: Don't forget you're talking to someone who only started with some programming a year ago to add some functions I miss to Anki. I hardly need html/css for this so my knowledge is quite limited in this area. To remove some html markup maybe this is somewhat useful: https://ankiweb.net/shared/info/1043915942

The background color of the custom settings is not displayed on the mobile client
Comment from author
update 2020-01-22: Could you try the latest version?
If you use Ankimobile: Changes to your config are only applied in AnkiMobile on my iphone after I force close and reopen Ankimobile. With "force close" I mean: double click the home button, then swipe up on the app's preview.
If you use Ankimobile: Changes to your config are only applied in AnkiMobile on my iphone after I force close and reopen Ankimobile. With "force close" I mean: double click the home button, then swipe up on the app's preview.

Love this one, but since last update there has been some problems:
1) The colors aren't appearing on the flashcard during reviews. They are inside the editors and browsing functions, but don't show in review time
Edit1:
I'm sorry but I don't understand much about code. The last version was working just fine, the update that changed everything(I did not add any extra add on, just updated with the "Update buttom" at the add on page. As I said, the previous cards created are working, the new ones are the one that are not so I guess they all have the same card configuration.
There's any way I can get the older version?
edit2:
Tried to change things the way you said and got it.Thanks man! Love your add on, it makes my note so much more organized and eazy to follow :D
1) The colors aren't appearing on the flashcard during reviews. They are inside the editors and browsing functions, but don't show in review time
Edit1:
I'm sorry but I don't understand much about code. The last version was working just fine, the update that changed everything(I did not add any extra add on, just updated with the "Update buttom" at the add on page. As I said, the previous cards created are working, the new ones are the one that are not so I guess they all have the same card configuration.
There's any way I can get the older version?
edit2:
Tried to change things the way you said and got it.Thanks man! Love your add on, it makes my note so much more organized and eazy to follow :D
Comment from author before post was edited
There are multiple reasons why this could happen.
I hope you just forgot that each note type must have the string @import url("_editor_button_styles.css"); at the top(!) of the "Styling" section in the "Card Types for ..." window. Check the section '# Setup' in the add-on description. I probably should make a screencast about the setup of this add-on.
Does this solve your problem?
If not: There are many other reasons why this could happen. Maybe a bug in my code, maybe some bad interaction with a different add-on. I could ask for various parts of your configuration but this would be complicated and slow. I think I'll create a new add-on over the coming days that adds a button so that you can create a zip file that includes all your configuration. Then you could just share/email this file which makes it much easier to narrow down problems. But that's just an idea. Check the add-on description and my answer again in a week.
I hope you just forgot that each note type must have the string @import url("_editor_button_styles.css"); at the top(!) of the "Styling" section in the "Card Types for ..." window. Check the section '# Setup' in the add-on description. I probably should make a screencast about the setup of this add-on.
Does this solve your problem?
If not: There are many other reasons why this could happen. Maybe a bug in my code, maybe some bad interaction with a different add-on. I could ask for various parts of your configuration but this would be complicated and slow. I think I'll create a new add-on over the coming days that adds a button so that you can create a zip file that includes all your configuration. Then you could just share/email this file which makes it much easier to narrow down problems. But that's just an idea. Check the add-on description and my answer again in a week.

v3 update is great!
It compatible with night-mode now!
Thanks!
It compatible with night-mode now!
Thanks!
Comment from author before post was edited
Thanks for your suggestion. I just updated the add-on so that in 2.0 the file and folder have a better name. I only chose the current name when I uploaded the add-on. I forgot to replace the temporary name.
about clearing: use the general "remove formatting" button (Ctrl+R). That not perfect because it also removes other formatting. But this is rarely a problem for me.
about clearing: use the general "remove formatting" button (Ctrl+R). That not perfect because it also removes other formatting. But this is rarely a problem for me.

very good

错误
有一个错误发生了.请在按住shift键的同时启动Anki,这样可以临时的忽略掉你已经安装的插件。
如果仅仅是因为插件引起的问题,请选择工具>插件菜单项来将出错的的插件设置成失效,然后重启Anki,重复以上的步骤直到你发现了具体是哪个插件引起的问题。
当你已经发现是因为插件引起的问题,请在我们的支持网站上 add-ons section 上报告问题。
调试信息
Anki 2.1.13 (3ba55990) Python 3.6.7 Qt 5.12.1 PyQt 5.11.3
Platform: Mac 10.14.4
Flags: frz=True ao=True sv=1
相关扩展:editor apply font color background color custom class custom style
Caught exception:
File "aqt/webview.py", line 27, in cmd
File "aqt/webview.py", line 87, in _onCmd
File "aqt/webview.py", line 368, in _onBridgeCmd
File "aqt/editor.py", line 288, in onBridgeCmd
File "/Users/hahaha/Library/Application Support/Anki2/addons21/1899278645/menu.py", line 121, in additional_menu_styled
m.addAction(editor.create_menu_entry(e,m))
File "/Users/hahaha/Library/Application Support/Anki2/addons21/1899278645/menu.py", line 100, in create_menu_entry
stylesheet=editor.return_stylesheet(e)
File "/Users/hahaha/Library/Application Support/Anki2/addons21/1899278645/menu.py", line 50, in return_stylesheet
thiscolor = hex_to_rgb(e['Setting'])
File "/Users/hahaha/Library/Application Support/Anki2/addons21/1899278645/menu.py", line 40, in hex_to_rgb
red = int(c[0:2],16)
<class 'ValueError'>: invalid literal for int() with base 16: 'wh'
有一个错误发生了.请在按住shift键的同时启动Anki,这样可以临时的忽略掉你已经安装的插件。
如果仅仅是因为插件引起的问题,请选择工具>插件菜单项来将出错的的插件设置成失效,然后重启Anki,重复以上的步骤直到你发现了具体是哪个插件引起的问题。
当你已经发现是因为插件引起的问题,请在我们的支持网站上 add-ons section 上报告问题。
调试信息
Anki 2.1.13 (3ba55990) Python 3.6.7 Qt 5.12.1 PyQt 5.11.3
Platform: Mac 10.14.4
Flags: frz=True ao=True sv=1
相关扩展:editor apply font color background color custom class custom style
Caught exception:
File "aqt/webview.py", line 27, in cmd
File "aqt/webview.py", line 87, in _onCmd
File "aqt/webview.py", line 368, in _onBridgeCmd
File "aqt/editor.py", line 288, in onBridgeCmd
File "/Users/hahaha/Library/Application Support/Anki2/addons21/1899278645/menu.py", line 121, in additional_menu_styled
m.addAction(editor.create_menu_entry(e,m))
File "/Users/hahaha/Library/Application Support/Anki2/addons21/1899278645/menu.py", line 100, in create_menu_entry
stylesheet=editor.return_stylesheet(e)
File "/Users/hahaha/Library/Application Support/Anki2/addons21/1899278645/menu.py", line 50, in return_stylesheet
thiscolor = hex_to_rgb(e['Setting'])
File "/Users/hahaha/Library/Application Support/Anki2/addons21/1899278645/menu.py", line 40, in hex_to_rgb
red = int(c[0:2],16)
<class 'ValueError'>: invalid literal for int() with base 16: 'wh'
Comment from author
Thanks for this error report.
I think it might be this: in your config under "Setting" for "forecolor" and "backcolor" the color must be set in the hexadecimal format with a leading # ("#RRGGBB"). You may not use "white". I forgot to put this on the website which I just updated.
If this answer doesn't help disable all other add-ons and try again. If the error still persists share your config. Maybe it's easier to share it on reddit.com/r/anki, anki.tenderapp.com or https://github.com/ijgnd/anki__editor__apply__font_color__background_color__custom_class__custom_style/issues .
I think it might be this: in your config under "Setting" for "forecolor" and "backcolor" the color must be set in the hexadecimal format with a leading # ("#RRGGBB"). You may not use "white". I forgot to put this on the website which I just updated.
If this answer doesn't help disable all other add-ons and try again. If the error still persists share your config. Maybe it's easier to share it on reddit.com/r/anki, anki.tenderapp.com or https://github.com/ijgnd/anki__editor__apply__font_color__background_color__custom_class__custom_style/issues .

Good!

Great !!

One of the best addons out there and a must have if you like to apply heavy formatting on your cards.
It allow to configure pretty much any text formatting and apply it with one button without being forced to use multiple shortcuts or using the painfully cumberstone original interface.
It allow to configure pretty much any text formatting and apply it with one button without being forced to use multiple shortcuts or using the painfully cumberstone original interface.

good

Awesome to import style, applying custom class and so on.

but how to set the shortcut key on Mac os?
Comment from author
I'm not a Mac user. As far as I know the only difference is that if you set e.g. "Ctrl+0" in your config you need to press "Cmd+0". The control key is translated to the command key.
I don't know if in Anki on MacOS you can use the Ctrl key directly and I don't know if you can write "Cmd+0" in the config file.
Apart from this there shouldn't be anything special about using this add-on on MacOS.
I don't know if in Anki on MacOS you can use the Ctrl key directly and I don't know if you can write "Cmd+0" in the config file.
Apart from this there shouldn't be anything special about using this add-on on MacOS.

is there a way to modify the code so i can change the font size instead of font color??
Comment from author
you could try the latest version. A custom configuration should do what you want.