Memrise card template [support thread]

Anki Card Design
346

Deck thumbnails and Memrise course styles

The older interface styling addon has been fully reworked and merged into the main support add-on. Now the main deck screen allows adding deck thumbnails, styling for Memrise levels converted into subdecks, and includes the means of controlling deck order on the home screen, modifying all provided interface styles or easily adding custom user styles and scripts to any Anki window (including individual Editor fields).

Course styles for decks
Course styles for decks748×672 41.1 KB

  1. To attach a thumbnail to a deck, simply place an image file named _thumb_%deckname% into your collection.media folder (can be quickly accessed via Tools → Check Media → View Files):

    • Image files are to be placed directly at the collection.media root, not inside any subfolder
    • If a deck is located inside another deck, the names of its parents should not be included in the thumbnail file name, only the name of the target deck itself
    • Note that the add-on removes ordinal numbers from the start of the displayed deck names, so these numbers should not be included in the thumbnail file names.

    For example, if a deck name is 1.2. Lesson 2 and it is placed inside another deck called 1. section A, the thumbnail name should be _thumb_Lesson 2.

  2. Image formats used by default for the thumbnails are listed in the thumbnail extensions setting in the add-on Config (Tools → Add-ons → double click the “Memrise Cards Lt” name). The list can be simply extened by adding more formats, like .gif and .webp (including animated ones), but keep in mind that longer lists take more time to scan through when thumbnails are loaded and may ultimately lead to noticeable flickering when the deck screen is refreshed. For this reason, it is recommended to keep only the used formats in the list and remove any redundant ones.

    animated thumbnails

  3. Subdecks with the names starting with L followed by an ordinal number (e.g., L05. particles) are interpreted as Memrise levels and automatically get appropriate icons on the main screen and deck overview screen:

    Memrise level icons
    Memrise level icons599×446 23.1 KB

  4. All styling described above can be disabled by changing "deck styling" to false in the add-on Config. To also disable the feature that hides ordinal numbers from deck names, set "numbered decks" to false as well. Keeping "numbered decks": true alongside "deck styling": false instead allows controlling the deck order by prepending their names with appropriate numerals, without the numerals themselves being displayed and without any other style changes introduced by the add-on.

  5. The add-on css and js injecting functionality can be leveraged to add custom user styles and scripts to any Anki webview window. Simply place appropriately named files into the user_files directory inside the add-on folder (Tools → Add-ons → select “Memrise Cards Lt” in the list → View Files):

    • General-use files and to be injected into every window: common_styles.css and common_scripts.js
    • Home screen and deck overview: deck_styles.css and deck_scripts.js
    • Review screens, including card preview and card template editor: reviewer_styles.css and reviewer_scripts.js
    • Editor: editor_styles.css and editor_scripts.js
      • To adjust the appearance depending on the Type of a Note being viewed, editor styles can take advantage of the “data-notetype” attribute attached to the <body> element by the add-on
    • field_styles.css for styling content inside individual fields in the editor, e.g., word highlights or alternative answers. There is no field_scripts.js, because they would be automatically hoisted by the JS engine to the root of the editor and thus equivalent to editor_scripts.js

    As an example, the add-on includes the style for Note Types made using the Memrise Note Type Constructor to be colored similarly to the Memrise community course editing page:

    image
    image672×558 22.5 KB

    To remove this styling, delete the editor_styles.css located in the user_files directory.

  6. In general, the deck screen styles are more robust than in the Lstyle predecessor and, when enabled, overwrite changes of the deck names introduced by the Enhance Main Window and similar add-ons (shout-out to @Himawari).