/AnKing-Note-Types

Primary LanguageCSSGNU Affero General Public License v3.0AGPL-3.0

AnKing Note Types

For simplicity and ease-of-use, I have uploaded all of my note types here. This will allow for better tracking of changes and better tutorials.

How to Use These Note Types

To download a note type, find the latest version in the Releases tab

To learn how to use and customize a note type, watch this video. For written instructions, open the Note Types Folder. Each Folder has it's own README file that explains the note and it's features

To install the AnKing Note Types add-on, (allows for very easy and user-friendly customization) visit this page: https://ankiweb.net/shared/info/952691989

How to Update These Note Types

There are two methods to update if you already have any of these notes in your collection

Method 1 (Preferred)
  1. Download the AnKing Note Types (Easy Customization) add-on from AnkiWeb. Be sure to restart Anki after installing.
  2. Go to the AnKing->AnKing Note Types menu and then select Update Note Types in the dialog
Method 2
  1. Download the latest file from the Releases tab
  2. Install the Special Fields add-on (restart Anki after installing)
  3. Go to Tools->Special Fields
  4. Click the Update Settings button and then Save
  5. Import the downloaded file. This should update the note styling After importing, we recommended that you go back to Tools->Special Fields and click the Import Tags Settings button to prevent any future updates from altering note styling
Method 3

NOTE: This method is less preferred because updates may be in progress and incomplete.

  1. Locate the appropriate file in the Note Types Folder
  2. Copy the text from the file into the Front Template, Back Template and Styling of the note type
    • You can click the Copy Raw Content (box on top of a box) button in the top right to easily copy everything (it's just left of the pencil icon)

Thank You

Huge thank you to @BlueGreenMagick, @Kleinerpirat, @RisingOrange, u/Ankiphil, and u/holythesea who have helped significantly with the development of these notes over the last few years. Also thank you to u/passwordisnotaco who posted the initial version of the IO-one by one note type.

How to Use & Customize These Note Types

  • This video goes over how to customize card styling (including basic html/css)
  • This video goes into specifics of the AnKingMaster-v2+ updates to the card styling

Features Used In These Note Types

All note types in this repo use many or all of the features listed below. Some will appear slightly different as they have been customized to work with each individual style. Features unique to a note type are listed in the README file of that note type within the Note Types Folder

  • Invisible countdown timer on the front

    Set timer length (Front template)

    // Timer config (timer length, timer finished message)
    var minutes = 0
    var seconds = 9
    var timeOverMsg = "<span style='color:#CC5B5B'>!<br/>!<br/>!<br/>!<br/>!<br/>!</span>"
    

    Turn timer on/off (Styling)

    /* TIMER ON/OFF */
    .timer {
      display: block; /* ‘none’ or ‘block’ */
    }
    

  • Clickable tags (must have Clickable Tags add-on installed for them to be clickable, but they will still display without the add-on)

    Turn on/off by default and adjust for compatibility with No Distractions add-on (Styling)

    /* TAGS ON/OFF DESKTOP & MOBILE*/
    #tags-container {
      display: block; /* ‘none’ or ‘block’ */
    }
    
    .mobile #tags-container {
      display: none; /* ‘none’ or ‘block’ */
    }
    
    /* MOVE TAGS UP FOR 'NO-DISTRACTIONS' ADD-ON */
    #tags-container {
      padding-bottom: 0px; /* 0 normal, 55 to move up */
    }
    

    Toggle on/off with shortcut (Back template)

    Default is C

    // ##############  TAG SHORTCUT  ##############
    var toggleTagsShortcut = "C";
    

  • Editable fields - (For use with the Edit Field During Review (Cloze) add-on)

    To enable/disable editable fields (Back template)

    1. Make sure that the correct add-on is installed (NOT Edit Field During Review)
    2. The config of Edit Field During Review (Cloze) allows for click to edit or ctrl+click to edit
    3. In order to make a field editable, change {{Field Name}} to {{edit:Field Name}}. For cloze fields: Change <div class="editcloze id="text"">{{cloze:Text}}</div> to <div class="editcloze" id="text">{{edit:cloze:Text}}</div> Do NOT change <div class="clozefield">{{cloze:Text}}</div> (This is set for mobile to avoid errors)

  • Wikipedia searches in reviewer

    • Highlight text and then use the shortcut w (if nothing shows up, it's because your search returned no results in wikipedia)
  • Button shortcuts and/or hint hotkeys add-on (need Refocous Cards when Reviewing add-on unless on Anki 2.1.36+)

    • The Hint Hotkeys add-on is no longer necessary
    Individual shortcuts can be customized (Back template)

    // ##############  HINT REVEAL SHORTCUTS  ##############
    // All shortcuts will also open with "H" if using the Hint Hotkeys add-on 
    var ButtonShortcuts = {
        "Lecture Notes" : "Alt + 1",
        "Missed Questions" : "Alt + 2",
    }
    var ToggleAllButtons = "'"
    var ToggleNextButtonShortcut = "H";
    

  • Auto scroll to button that is opened (can be toggled off)

    Turn on/off by default and adjust for compatibility with No Distractions add-on (in styling)

    Change true to false to turn off the auto scroll

    var ScrollToButton = true;
    

  • Auto open hints:

    Old Version (Back template)

    Current Version (Back template)

    // ##############  SHOW HINTS AUTOMATICALLY  ##############
    var ButtonAutoReveal = {
        "Lecture Notes" : false,
        "Missed Questions" : false,
    }
    

  • TTS - watch this video for more details

    How to enable (Front and back template)

    Front template:

    <!-- ##############  Text-to-speech  ##############
    replace the arrows/dashes from the statement below with double brackets-->
    
    <!--tts en_US voices=Apple_Samantha speed=1.4:cloze:Text-->
    

    change to look like:

    <!-- ##############  Text-to-speech  ##############
    replace the arrows/dashes from the statement below with double brackets-->
    
    {{tts en_US voices=Apple_Samantha speed=1.4:cloze:Text}}
    

    Back template:

    <!-- ##############  TEXT-TO-SPEECH ##############
    replace the arrows/dashes from the statement below with double brackets-->
    
    <!--tts en_US voices=Apple_Samantha speed=1.4:cloze-only:Text-->
    

    change to look like:

    <!-- ##############  TEXT-TO-SPEECH ##############
    replace the arrows/dashes from the statement below with double brackets-->
    
    {{tts en_US voices=Apple_Samantha speed=1.4:cloze-only:Text}}
    

  • Images will zoom with click (or hover)

    Change the transform scale or method (Back Template)

    active will cause images to zoom on click. hover will cause images to zoom on hover. Some Note Types have specific zoom scales for specific fields

    /*Image hover zoom*/ 
    img:active {
      transform: scale(1.2);
    }
    .mobile img:active {
      transform: scale(1.0) !important;
    }
    

  • Highlight all tags with a red background when there is a tag containing the text "xxxyyyzzz"

    Change tagID (Front and Back Template)

    //ENTER THE TAG TERM WHICH, WHEN PRESENT, WILL TRIGGER A RED BACKGROUND
    var tagID = "XXXYYYZZZ"
    

TODO

  • Update Readme files with big December update including the add-on
  • Update Cloze-one by one feature so Extra field stays hidden till all are revealed

Contributing

All files in /Note Types are generated from files in /src. DO NOT edit the files in /Note Types! We use ejs to reduce duplicate code across various note types.

To generate the files, Node.js needs to be installed, and npm added to PATH.

After editing the files in /src, run npm run build to generate the files. Always run npm run build before opening a Pull Request.

If you get a Permission denied message, you may need to run sudo chmod 755 ./build to make the /build file executable.

The json files for the note types (for example https://github.com/AnKingMed/AnKing-Note-Types/blob/master/Note%20Types/AnKing/AnKing.json) are how Anki stores models / note types internally. The scheme is described in the AnkiDroid wiki https://github.com/ankidroid/Anki-Android/wiki/Database-Structure#models-jsonobjects. The AnKing Notes Add-on combines such a json file with a front template, a back template and the styling information and loads the resulting note type into Anki.


If you like these, please consider donating to this project




Check out our Anki Mastery Course! (The source of funding for this project)
https://courses.ankipalace.com