Power Format Pack: Markdown, code blocks, lists, tables, syntax highlight & more

Power Format Pack IMPORTANT: This add-on only works with Anki 2.0.*. There is no support for Anki 2.1, and most likely, there never will be. Please read this issue on GitLab for more information. Thanks everyone for using this add-on over the years and rating it so highly. It has been my pleasure. Check out the Mini Format Pack created by Glutanimate, who ported some of the functionality of this add-on to Anki 2.1. MARKDOWN You can use Markdown to style your notes. Markdown is a text-to-HTML conversion tool, that lets you quickly style your notes. If you don't know Markdown yet, have a look at this tutorial. Enable Markdown Markdown is disabled by default, to keep this add-on as modularized as possible. To enable it, go to the add-on settings (Power Format Pack add-on (options) > Options... > Markdown) and tick the checkbox next to "Markdown". Restart Anki to complete the process. Using Markdown When you click the Markdown button, your Markdown syntax will be translated into HTML and displayed. You are now in Markdown mode. Markdown mode is indicated by the changed background color and the warning message under the field you are editing. In Markdown mode, you cannot use any of the formatting buttons you would normally have access to. This is done to prevent any accidental editing of the displayed result. If you want to make changes to the card, first toggle the Markdown button again and go back to normal mode. However, if you absolutely need to edit the card in Markdown mode, you can choose to keep the buttons enabled from the options menu, by ticking the checkbox Allow editing of rendered Markdown. When you do add text to your card or alter the HTML directly in Markdown mode, a dialog box will appear asking whether you want to revert to your previous Markdown syntax, or try to incorporate the changes in your card. Be advised, however, that the result may lose some of your original Markdown syntax, especially if the original syntax was complex (footnotes, tables, code blocks). To make sure you always return to your original syntax when exiting Markdown mode, you can check the Always automatically revert back to saved Markdown checkbox in the options. Doing this will never show you the warning dialog box and will always discard any changes made in Markdown mode. Don't use Markdown in combination with other formatting I recommend you use either Markdown or the rich formatting buttons, but not both at the same time. Markdown was designed to be a fast and simple way to quickly write relatively simple formatted text. As such, it won't know what to do with complex cards that use formatting unknown to the Markdown specification. So when clicking the Markdown button, it _will_ "erase" formatting that it does not know how to handle. You were warned. Extra Markdown syntax This add-on supports some Markdown syntax not found in John Gruber's original Markdown: CODE BLOCKS Code blocks can be created by indenting four spaces with a white line before and after the code block. The syntax can be specified either by: :::java public class Test { } or by using: ```python def print_me(this): print "Printing: ", this ``` Code blocks can be styled by choosing a predefined styling in the settings, or by creating your own stylesheet. More (technical) details on code blocks (e.g. highlighting of lines) can be found on the Python Markdown project. DEFINITION LISTS A definition list can be created as follows: Apple : Pomaceous fruit of plants of the genus Malus in the family Rosaceae. Orange : The fruit of an evergreen tree of the genus Citrus. Make sure there is a white line between the different definitions. FOOTNOTES Footnotes[^1] have a label[^@#$%] and the footnote's content. [^1]: This is a footnote content. [^@#$%]: A footnote on the label: "@#$%". A footnote label must start with a caret ^ and may contain any inline text (including spaces) between a set of square brackets []. Only the first caret has any special meaning. A footnote content must start with the label followed by a colon and at least one space. The label used to define the content must exactly match the label used in the body (including capitalization and white space). The content would then follow the label either on the same line or on the next line. The content may contain multiple lines, paragraphs, code blocks, block quotes and most any other markdown syntax. The additional lines must be indented one level (four spaces or one tab). More (technical) details on footnotes (e.g. multiple blocks of content) can be found on the Python Markdown project. ABBREVIATIONS The Markdown syntax: The HTML specification is maintained by the W3C. *[HTML]: Hyper Text Markup Language *[W3C]: World Wide Web Consortium will be rendered as: <p>The <abbr title="Hyper Text Markup Language">HTML</abbr> specification is maintained by the <abbr title="World Wide Web Consortium">W3C</abbr>.</p> TABLES Tables have the same syntax as described below for the table button. Tables can be styled with CSS in your stylesheet. ATTRIBUTES An example attribute list might look like this: {: #someid .someclass somekey='some value' } A word which starts with a hash (#) will set the id of an element. A word which starts with a dot (.) will be added to the list of classes assigned to an element. A key/value pair (somekey='some value') will assign that pair to the element. Be aware that while the dot syntax will add to a class, using key/value pairs will always override the previously defined attribute. Consider the following: {: #id1 .class1 id=id2 class="class2 class3" .class4 } The above example would result in the following attributes being defined: id="id2" class="class2 class3 class4" Say you have a CSS class: .large { font-size: 32px; } You can add this class to a paragraph like this: A person often meets his destiny on the road he took to avoid it. {: .large} More (technical) details on attributes (e.g. block-level and inline attributes) can be found on the Python Markdown project. FORMATTING BUTTONS Besides Markdown, this add-on adds the following supplementary formatting buttons to Anki:

• a code button that will wrap selected text in a <code> (default: Ctrl + ,). You can specify the CSS class you want to use in combination with <code>. For example, we have a CSS class named c defined in the Styling section of Cards: .c { font-family: droid sans mono; background-color: #f2f2f2; padding-left: 5px; padding-right: 5px; } In the options Tools > Power Format Pack (options) > Alter <code> CSS... we can specify the class name, so that our <code> elements will be automatically transformed to <code class="c">.
Depending on your CSS definition, this may look like:
• an unordered list button (default Ctrl + [):
  • One
  • Two
  • Three
• an ordered list button (default Ctrl + ]):
  1. One
  2. Two
  3. Three
• an indent button (default Ctrl + Shift + ]) to indent text or lists:
  1. One
     • Two
       1. Three
• an outdent button (default Ctrl + Shift + [) to outdent text or lists
• a strikethrough button (default Alt + Shift + 5):
• a code block button (default Ctrl + .) that creates a <pre> block element around the selected element. This works the same way the code button works. You can specify the CSS class you want to use in combination with <pre> by going to Tools > Power Format Pack (options) > Alter <code> CSS...
• a horizontal rule button (default Ctrl + H) that inserts a horizontal rule after the current position of the cursor
• a definition list button (default Ctrl + Shift + D): Upon clicking the button, a popup will appear where you can enter your terms and descriptions.
• a table button (default Ctrl + Shift + 3): Select the text you want to create a table from. This works very much the same as a Markdown list: header1 | header2 -|- elem1 | elem2 This will create a list with two columns and two rows. The -|- part is optional, but can be used to align the column to the left (:-), right (-:) or to the center (:-:). You can skip this line completely, but do make sure you add a pipe character | between elements to designate a border. Alternatively, if you do not select any text, upon clicking the Create a table button you will be presented with a dialog window asking you to specify the number of rows and columns. In the option menu, you can select whether you want your tables to be styled by the add-on (default) or if you prefer to use your own style sheet.

• a keyboard key button (default Ctrl + Shift + K): This will create a keyboard key, for example Esc. By itself, the text that is wrapped in <kbd> will not look any different from the rest of the text. You have to style it first by going to the Styling section of Cards and add CSS to your liking. For example: kbd { box-shadow: inset 0px 1px 0px 0px #ffffff; background: -webkit-gradient(linear, left top, left bottom, color-stop(0.05, #f9f9f9), color-stop(1, #e9e9e9) ); background-color: #f9f9f9; border-radius: 5px; border: 1px solid #dcdcdc; display: inline-block; font-size: 0.8em; height: 30px; line-height: 30px; padding: 0px 10px; text-align: center; text-shadow: 1px 1px 0px #ffffff; }
Depending on your CSS, this may look like:
• a hyperlink button (default Ctrl + Shift + H): Upon pressing the button, you will be presented with a dialog window where you can enter both a link and text. To unlink a hyperlink, use the unlink button.
• a text highlight button (default Ctrl + Shift + N to select color, Ctrl + Shift + B to apply it): Highlight your text with colors.
• a blockquote button (default Ctrl + Shift + Y): Cite your source distinctively from the rest of the text. You can add an author by putting brackets around the text: Do not pray for easy lives. Pray to be stronger men. [[John F. Kennedy]] Do not pray for easy lives. Pray to be stronger men.<br/> John F. Kennedy
• alignment buttons: Align your text left, right, center or justified. Shortcuts are Ctrl + Shift + Alt + L, R, B and J, respectively.
• a heading button (shortcut Ctrl + Alt + 1): You can either create a heading by prepending text with hashes: # for a <h1> heading, ###### for a <h6> heading. If you do not prepend any hashes, or if you select no text at all, a dialog will appear where you can create your own heading.

CUSTOM USER-DEFINED KEYBINDINGS You can change the default keybindings to your liking by going to Tools > Power Format Pack add-on (options) > Keybindings... You will be presented with a table view of all available functionality on the left and the associated keyboard shortcuts on the right. To change a particular keybinding, double click on the shortcut and press the desired keyboard combination. Be aware that all keyboard combinations will be accepted, although some of them won't actually work in practice. If you assign the keyboard shortcut 'A' to a certain functionality, for example, the shortcut won't actually do anything. Also keep in mind that there is no check for duplicate keybindings. This means that when a keybinding is already taken by either your OS, Anki, this add-on, or some other running program, the result is undefined. You can sort either on functionality ('Action') or keybindings by clicking on the appropriate header columns. If you want to revert to the default keybindings provided by Power Format Pack, click the 'Restore Defaults' button. You can undo any changes you made and keep the dialog window open by pressing the 'Reset' button. 'Cancel' will do the same but will also close the window. Lastly, when you click 'Save', the dialog window will close and your changes will be applied. DISABLING UNUSED BUTTONS The buttons can be enabled or disabled individually in Tools > Power Format Pack (options), so feel free to disable the buttons you don't use. SOURCE CODE The source code is available on GitLab. If you have any issues, please report them there! CHANGELOG -------------------------------------------------- 28-08-2014 v0.1.0: initial release 29-08-2014 v0.1.1: bug fix and outdent button added 30-08-2014 v0.1.2: <code> element bug fixed 03-09-2014 v0.1.3: added definition lists and tables 06-09-2014 v0.1.4: bug fixes 24-09-2014 v0.2.0: definition list greatly improved and tables redesigned with light look 25-09-2014 v0.2.1: added proper icons 28-09-2014 v0.2.2: bug fixed with empty definition list 11-10-2014 v0.2.3: bug fix for code tag and improved pre tags to also include a CSS class 19-10-2014 v0.2.4: changed shortcuts for indent and outdent buttons, because they interfered with core Anki shortcuts in Browser 24-10-2014 v0.3.0: improved tables: selected text can now be converted to a table; added hyperlink and keyboard key buttons; improved options menu 25-10-2014 v0.3.1: bug fix with hyperlinks where it would in some cases incorrectly prepend a second http:// 27-10-2014 v0.3.2: bug fix where empty lists would be duplicated to complete field when using <code> format 28-10-2014 v0.3.3: added Unicode support to stop tables and other stuff from breaking when non-English is entered (sorry about that :), added optional alignment to tables 16-11-2014 v0.4.0: added text background color 25-11-2014 v0.4.1: add-on now remembers last used color 25-11-2014 v0.4.2: bug fixes 17-02-2015 v0.5.0: highlight colors on all platforms! (yes, it took it while) added text alignment, headings, and block quotes 24-02-2015 v0.5.1: fixed preference handling, it will now revert to the default settings upon encountering an error; bug fix for tables where HTML (or anything in brackets) wouldn't be escaped; changed shortcut for text align center to Ctrl+Shift+Alt+B to prevent conflict with cloze deletions 24-02-2015 v0.5.2: fixed bug in path location of preference file (was hard-coded) 22-05-2015 v0.6.0: enhanced types of ordered list, added <abbr> tag, added About dialog, cleaned up preferences, refactored code 26-05-2015 v0.6.1: re-enabled text highlighting on Mac OS X and Windows 29-09-2015 v0.7.0: added user-defined keybindings; added author to block quote 29-11-2015 v0.8.0: added Markdown 10-12-2015 v0.8.1: fix for assertion error when keybinding is not Unicode 21-12-2015 v0.8.2: made hyperlink functionality more liberal (will now not force http:// prefix) 06-01-2016 v0.8.3: fixed assertion-related errors 10-01-2016 v0.8.3.1-0.8.3.5: minor bug fixes 02-02-2016 v0.8.6.2: added way to change position of button bar; fixed Markdown issues 05-02-2016 v0.8.6.3: fix for error in Windows where username is not ASCII 09-02-2016 v0.8.6.4: fix for backwards compatibility with older versions of Anki 12-08-2016 v0.8.6.5: fix for fixed ordered list error 13-10-2016 v0.8.8.0: made Markdown optional, allow editing of rendered Markdown, added option for tables with optional styling 22-10-2016 v0.8.8.1: workaround for deletion of font-weight attribute in first span by Anki 26-01-2017 v0.8.8.3: added option to use user CSS for styling code blocks; miscellaneous bug fixes and improvements 13-05-2017 v0.8.8.4: performance and stability improvements for Markdown 21-08-2017 v0.8.9.0: edit keyboard shortcuts from within Anki 16-07-2018 v0.9.1: some refactoring, nothing should have changed except that the code should smell a little less