Custom Styles (font color, background colour, classes)
0.18MB. Updated 2021-03-03.
The author has shared 13 other
item(s).
Description
This add-on used to be named "editor: apply font color, background color, custom class, custom style". Multiple people complained that it's too long. So on 2020-09-05 I changed the name.
This description only refers to the add-on for the Anki versions 2.1.24 (which was released on 2020-04-28) or later.
If you find a bug let me know in the official anki support forum, on github.
This add-on offers more styling options for the Anki editor: You can quickly set different font colors, background colors, font sizes or apply custom classes or styles. You can use shortcuts, buttons from the top of the editor or the context menu.
Before you use this add-on make sure to read sections "Setup/Updating Templates" and "Quirks" and "updating the styling on Mobile" below.
This add-on has some limitations for technical reasons: You either know some background about the anki editor and how to work around these or you will run into some problems like disappearing markup. If reading the sections mentioned above for two minutes is too much or if you can't live with these limitations don't use this add-on. Then just stop reading here.
Unfortunately this add-on currently also has some unnecessary limitation:
- Sometimes the applied formatting is not limited to the selection but slightly more or less is formatted.
- This add-on does not work with the add-on Multi-column note editor from 2020-05-23 in Anki version 2.1.28+. The problem can be solved in the multi-column note editor add-on.
Use this add-on at your own risk.
If you want to use a custom style but don't know css there are online sites that make creating styles easier. A google search lead to sites like this one or this one.
# Functions
This add-on offers the following options:
1. directly changing the font color by changing the html color attribute. This is also built into Anki but switching between different colors is time consuming. You can set different font colors with the "Quick Colour Changing" add-on. This add-on additionally gives you the option to have multiple dedicated buttons or menu entries for font colors you often use. But my add-on might be easier to use.
2. you can set the background color directly using the html background-color attribute. The option to change the background color is also available in the add-on "Mini Format Pack". But switching between different colors is time consuming.
3. you can style text with the html style attribute.
4. you can set css for custom classes and apply these classes to the text selected using the inline "span" tag.
5. you can set css for custom classes and apply these classes to the text selected using the "div" tag which is a block element which means you'll have a line-break before and after it. Some styling only makes sense when it's applied to a div.
6. There's are easy to use dialogs/options to change the font color, the background color, and the font size by using css and html classes. This has some advantages and some drawabacks: html classes are roughly similar to "styles" that you can apply in Word or LibreOffice. When you use html classes you can later change the color for all the fonts you've highlighted at the same time and you can also set different colors for night mode.
7. You can wrap the text selected with custom text snippets, see below.
# Text Wrapping
You can wrap selected text with fixed text snippets, e.g. you can set up a shortcut with "before" set to "Art ", and "after" set to " TFEU".
This lets you wrap, e.g., "2" in the Editor, and it will become "Art 2 TFEU" (which is Article 2 of the Treaty on the
Functioning of the European Union). This is useful for any kind of repetitive typing.
the text wrapping function is useful for hgiesel's Closet For Anki. Text Wrapping also supports counters that take the current field into account. The best way to show this is with an example:
- Having "before" set to "{{c%i::", and "after" to "}}", makes a text wrapper that mimics the built-in Ctrl-Shift-C cloze shortcut (think of %i as increment).
- Having "before" set to "{{c%t::", and "after" to "}}", makes a text wrapper that mimics the built-in Ctrl-Alt-Shift-C cloze shortcut (think of %t as top).
This is useful if you want to set the cloze shortcut to a custom key, or any add-on that mimics the built-in clozes in some way, see e.g. here. If you want a naked percentage sign, use "%%".
# Quirks
Background: The Anki editor you see in the Add window and at the bottom of the browser is not meant to be a fully featured word processing software like Word or LibreOffice. Anki is meant to be used with short flashcards that don't require a lot of styling. The Anki manual repeatedly suggests to follow a "minimum information principle" when creating notes/cards. And there's only so much an add-on can do ...
All functions mentioned in section above apart from "1/html color attribute" have quirks/drawbacks:
- In all versions of Anki that I've used so far (the most recent when the add-on was released was 2.1.26) remove the background color (option 2) and styling (option 3) when you copy and paste the text into a different field in Anki. This is not a limitation of this add-on but also applies to background color you set with the add-on "Mini Format Pack".
- The options that use classes (options 4, 5) cannot be undone with Ctrl/Cmd+Z and the regular Ctrl/Cmd+R doesn't remove the classes. Instead this add-on offers a custom shortcut for removing all formatting from selected text. Note: If you insert unformatted text into a html paragraph that already has some formatting the inserted text will also show this formatting. So the "remove all formatting" options only works as expected if you have unformatted text before your selection.
I use classes because I don't mind using a custom clear shortcut.
Another problem: In some cases an underlying component of Anki (the js command "inserthtml" in chromium) changes from inline to css styling and vice versa. As long as you don't change your css or rely on different styling for night mode you should't notice this ...
# Setup
Each note type MUST have the string 
# Alternatives
If you just want to sometimes change the text color or background color this add-on might be overkill. Or maybe you find the config too complicated. Or maybe you run into an error with this add-on. Then you could have a look at these options:
- The option to change the background color is available in the Mini Format Pack. But switching between different colors is time consuming.
- Anki has a function to change the font color. But switching between different colors is time consuming.
- There's the add-on Quick Colour Changing that allows to set shortcuts for different font colors.
- the extended (table) editor allows to edit one field in a powerful WYYIWYG editor (TinyMCE)
- Wrapper meta-addon for wrapping with nested divs
# Authors
- Henrik Giesel/hgiesel: Many contributions in 2020, and maintainer since 2020-09
- ijgnd: Original add-on creator, all versions until 2020-09.
- For a detailed copyright notice, see __init__.py from the add-on.
# Versions
- 2020-09-17 fix inline styling, fix import json
- 2020-09-16 bug fixes for the styling config window
- 2020-09-05 reworked config window (by hgiesel)
- 2020-08-14 many under the hood improvements by hgiesel
- 2020-08-09 fix so that it works in the EditCurrent dialog when using the add-on Persistent Editor (version from 2020-08-03), multiple improvements by hgiesel: on shortcut conflicts make shortcuts from my add-on work, more custom text wrapping options, ...
- 2020-07-22 write utf8 file on windows, tweak template updating
- 2020-07-12 first workaround for problem that sometimes rangy markups more than the selection: I use rangy only if the selection contains html tags, see github issue 18.
- 2020-06-26 Text Wrapper extended with counter (by hgiesel)
- 2020-06-23 more clear labels on settings for MacOS (by hgiesel)
- 2020-06-14 fix for weird MacOS bug(#12) by hgiesel.
- 2020-06-13 small fix: keyerror in adjust_config.py
- 2020-06-10 small fix: github issue #11
- 2020-06-08 v0.4 2.1.24+ only: for classes there's a night mode option, quick config dialogs for classes that only change the font color, the background color, or the font size. Classes and the html-style tag are more reliably applied. Added text wrapper option. Added the wrap with div option. Major changes under the hood. Now it works with the add-on Customize Editor Stylesheet
- 2020-01-22 update templates on mobile, misc
- 2019-11-21 bgcolor fix
- 2019-08-29 v0.31 extended info boxes for the user (2.1), replaced the add-on for 2.0 with a message
- 2019-08-06 v0.3 new configuration dialog
- 2019-07-16 v0.2.3 added manifest.json
- 2019-06-15 v0.2.2 bugfix
- 2019-02-25 v0.2.1 bugfix
- 2019-02-19 v0.2 added context menu, styles, classes
- 2019-01-29 v0.1.1
- 2019-01-16 v0.1
# Functions
This add-on offers the following options:
1. directly changing the font color by changing the html color attribute. This is also built into Anki but switching between different colors is time consuming. You can set different font colors with the "Quick Colour Changing" add-on. This add-on additionally gives you the option to have multiple dedicated buttons or menu entries for font colors you often use. But my add-on might be easier to use.
2. you can set the background color directly using the html background-color attribute. The option to change the background color is also available in the add-on "Mini Format Pack". But switching between different colors is time consuming.
3. you can style text with the html style attribute.
4. you can set css for custom classes and apply these classes to the text selected using the inline "span" tag.
5. you can set css for custom classes and apply these classes to the text selected using the "div" tag which is a block element which means you'll have a line-break before and after it. Some styling only makes sense when it's applied to a div.
6. There's are easy to use dialogs/options to change the font color, the background color, and the font size by using css and html classes. This has some advantages and some drawabacks: html classes are roughly similar to "styles" that you can apply in Word or LibreOffice. When you use html classes you can later change the color for all the fonts you've highlighted at the same time and you can also set different colors for night mode.
7. You can wrap the text selected with custom text snippets, see below.
# Text Wrapping
You can wrap selected text with fixed text snippets, e.g. you can set up a shortcut with "before" set to "Art ", and "after" set to " TFEU".
This lets you wrap, e.g., "2" in the Editor, and it will become "Art 2 TFEU" (which is Article 2 of the Treaty on the
Functioning of the European Union). This is useful for any kind of repetitive typing.
the text wrapping function is useful for hgiesel's Closet For Anki. Text Wrapping also supports counters that take the current field into account. The best way to show this is with an example:
- Having "before" set to "{{c%i::", and "after" to "}}", makes a text wrapper that mimics the built-in Ctrl-Shift-C cloze shortcut (think of %i as increment).
- Having "before" set to "{{c%t::", and "after" to "}}", makes a text wrapper that mimics the built-in Ctrl-Alt-Shift-C cloze shortcut (think of %t as top).
This is useful if you want to set the cloze shortcut to a custom key, or any add-on that mimics the built-in clozes in some way, see e.g. here. If you want a naked percentage sign, use "%%".
# Quirks
Background: The Anki editor you see in the Add window and at the bottom of the browser is not meant to be a fully featured word processing software like Word or LibreOffice. Anki is meant to be used with short flashcards that don't require a lot of styling. The Anki manual repeatedly suggests to follow a "minimum information principle" when creating notes/cards. And there's only so much an add-on can do ...
All functions mentioned in section above apart from "1/html color attribute" have quirks/drawbacks:
- In all versions of Anki that I've used so far (the most recent when the add-on was released was 2.1.26) remove the background color (option 2) and styling (option 3) when you copy and paste the text into a different field in Anki. This is not a limitation of this add-on but also applies to background color you set with the add-on "Mini Format Pack".
- The options that use classes (options 4, 5) cannot be undone with Ctrl/Cmd+Z and the regular Ctrl/Cmd+R doesn't remove the classes. Instead this add-on offers a custom shortcut for removing all formatting from selected text. Note: If you insert unformatted text into a html paragraph that already has some formatting the inserted text will also show this formatting. So the "remove all formatting" options only works as expected if you have unformatted text before your selection.
I use classes because I don't mind using a custom clear shortcut.
Another problem: In some cases an underlying component of Anki (the js command "inserthtml" in chromium) changes from inline to css styling and vice versa. As long as you don't change your css or rely on different styling for night mode you should't notice this ...
# Setup
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. I've had many "bug" reports where people didn't do this. So this add-on offers to automatically adjust all notes types. This function has been in the add-on for about 10 months and so far I haven't heard a complaint. But if for some reason it failed you would have a major problem. You would have to manually fix the styling of maybe all note types or restore from a backup. So you must have backups before you use this add-on. When it comes to backups a common mistake is that users never check if they can actually restore their backups. A lot of people have learned that their backup didn't work only when they needed it ... In general having backups and knowing how to restore them is something everyone should know. This add-on might be the only one you use that has such a scary warning. I include the warning for various reasons here:
- I have answered many support questions about Anki in the Anki subreddit. Some people lost months or years of work because they didn't have proper backups (and they didn't use mobile or ... ).
- A future version of Anki might change so that the code that currently works has unintended effects and maybe at that point I no longer use Anki or this add-on so that the add-on is not adjusted to this latest version.
- Even though so far I haven't heard a complaint after thousands of downloads but maybe there's a bug that only affects only 1 in 10000? Or maybe my most recent update introduced a bug?
# updating the styling on 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.
# bugs, errors, feedback
Please do not use reviews for bug reports or support requests. I don't get notified of your reviews, and properly troubleshooting an issue through them is nearly impossible (formatting is limited and I can't reply multiple times). If you find a bug let me know in the official anki support forum, on github.
# Alternatives
If you just want to sometimes change the text color or background color this add-on might be overkill. Or maybe you find the config too complicated. Or maybe you run into an error with this add-on. Then you could have a look at these options:
- The option to change the background color is available in the Mini Format Pack. But switching between different colors is time consuming.
- Anki has a function to change the font color. But switching between different colors is time consuming.
- There's the add-on Quick Colour Changing that allows to set shortcuts for different font colors.
- the extended (table) editor allows to edit one field in a powerful WYYIWYG editor (TinyMCE)
- Wrapper meta-addon for wrapping with nested divs
# Authors
- Henrik Giesel/hgiesel: Many contributions in 2020, and maintainer since 2020-09
- ijgnd: Original add-on creator, all versions until 2020-09.
- For a detailed copyright notice, see __init__.py from the add-on.
# Versions
- 2020-09-17 fix inline styling, fix import json
- 2020-09-16 bug fixes for the styling config window
- 2020-09-05 reworked config window (by hgiesel)
- 2020-08-14 many under the hood improvements by hgiesel
- 2020-08-09 fix so that it works in the EditCurrent dialog when using the add-on Persistent Editor (version from 2020-08-03), multiple improvements by hgiesel: on shortcut conflicts make shortcuts from my add-on work, more custom text wrapping options, ...
- 2020-07-22 write utf8 file on windows, tweak template updating
- 2020-07-12 first workaround for problem that sometimes rangy markups more than the selection: I use rangy only if the selection contains html tags, see github issue 18.
- 2020-06-26 Text Wrapper extended with counter (by hgiesel)
- 2020-06-23 more clear labels on settings for MacOS (by hgiesel)
- 2020-06-14 fix for weird MacOS bug(#12) by hgiesel.
- 2020-06-13 small fix: keyerror in adjust_config.py
- 2020-06-10 small fix: github issue #11
- 2020-06-08 v0.4 2.1.24+ only: for classes there's a night mode option, quick config dialogs for classes that only change the font color, the background color, or the font size. Classes and the html-style tag are more reliably applied. Added text wrapper option. Added the wrap with div option. Major changes under the hood. Now it works with the add-on Customize Editor Stylesheet
- 2020-01-22 update templates on mobile, misc
- 2019-11-21 bgcolor fix
- 2019-08-29 v0.31 extended info boxes for the user (2.1), replaced the add-on for 2.0 with a message
- 2019-08-06 v0.3 new configuration dialog
- 2019-07-16 v0.2.3 added manifest.json
- 2019-06-15 v0.2.2 bugfix
- 2019-02-25 v0.2.1 bugfix
- 2019-02-19 v0.2 added context menu, styles, classes
- 2019-01-29 v0.1.1
- 2019-01-16 v0.1
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
on
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:
on
font-family cannot be changed. Would you be kond enough to fix this bug?QAQ
on
Not version 2.1.54
on
essential tool!
thank you!
thank you!
on
Essential. Please update to newer versions of anki (2.1.54 Qt6).
on
It doesn't run with new update 2.1.54 Qt5 ... Hoping you guys will be able to do something
on
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
on
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.
on
addons worked perfectly.
please update!
please update!
on
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
on
Works PERFECTLY, thanks!
on
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).
on
so far so good but I'd really like to be able to use undo (ctrl+z) instead of manually removing added format.
on
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)
on
Really a great plugin, but currently has some issues. One of the issues is the ability to add inline style with Anki version 4.1.43 doesn't work; once I downgraded to version 4.1.40 then the inline styling work. Also, one bug I just noticed is that it deletes text when using the "clear formatting" button. For example, in the text "The <link> HTML element allows authors to link.." clearing the formatting will delete the text "<link>".
on
Very useful
on
This is great thank you so much
on
I really like it but I couldn't remove the formating and I've tried with the setting but didn't work
on
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?
on
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.
on
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)
on
wonderful,it is great if it can work with the add-on Multi-column note editor
on
Very usefull!
Love you man
Love you man
on
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.
on
Exactly what I was looking for!
on
Excelente! Muito Obrigado.
on
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.
on
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.
on
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?
on
Fantastic!
on
666方便
on
更新了最新的插件后，我发现我的卡牌在编辑模式下的荧光可以正常显示，但是预览/生成卡片会发现我所设置的背景荧光颜色就失效了，我个人分析了一下原因是不是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.
on
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.
on
Perfect for assigning custom span classes to portions of text!
on
It helps me a lot customizing my desire fonts!!
on
Great add-on for Anki. Thank you so much. It saves me a lot of time
on
This is super convenient for formatting inline code that appears in my fields. Thanks.
on
Great addon, saves me a lot of time. Good job and thank you!
on
save me lots of time, but backcolor and class doesn't work for me(except forecolor) ,my version is 2.1.20 (47a1bf8b)
on
Nicely done--saving me a lot of time when color-coding items!
on
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.
on
Excellent! better than highlight add on multiple time.
on
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?
on
----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.
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.
on
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.
on
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
on
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.
on
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.
on
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.
on
very good
on
Excellent, does what I need it to do.
on
错误
有一个错误发生了.请在按住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 .
on
Good!
on
Great !!
on
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.
on
good
on
Awesome to import style, applying custom class and so on.
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.
on
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.