Formatting

Material for MkDocs provides support for several HTML elements that can be used to highlight sections of a document or apply specific formatting. Additionally, Critic Markup is supported, adding the ability to display suggested changes for a document.

Configuration

This configuration enables support for keyboard keys, tracking changes in documents, defining sub- and superscript and highlighting text. Add the following lines to mkdocs.yml:

yaml

markdown_extensions:
  - pymdownx.critic
  - pymdownx.caret
  - pymdownx.keys
  - pymdownx.mark
  - pymdownx.tilde

See additional configuration options:

Usage

Highlighting changes

When Critic is enabled, Critic Markup can be used, which adds the ability to highlight suggested changes, as well as add inline comments to a document:

title="Text

Text can be {--deleted--} and replacement text {++added++}. This can also be
combined into {~~one~>a single~~} operation. {==Highlighting==} is also
possible {>>and comments can be added inline<<}.

{==

Formatting can also be applied to blocks by putting the opening and closing
tags on separate lines and adding new lines between the tags and the content.

==}

Text can be <del class="critic">deleted</del> and replacement text <ins class="critic">added</ins>. This can also be combined into <del class="critic">one</del><ins class="critic">a single</ins> operation. <mark class="critic">Highlighting</mark> is also possible <span class="critic comment">and comments can be added inline</span>.

<div> <mark class="critic block"> <p> Formatting can also be applied to blocks by putting the opening and closing tags on separate lines and adding new lines between the tags and the content. </p> </mark> </div> </div>

Highlighting text

When Caret, Mark & Tilde are enabled, text can be highlighted with a simple syntax, which is more convenient that directly using the corresponding mark, ins and del HTML tags:

title="Text

- ==This was marked (highlight)==
- ^^This was inserted (underline)^^
- ~~This was deleted (strikethrough)~~

==This was marked (highlight)==
^^This was inserted (underline)^^
~~This was deleted (strikethrough)~~

</div>

Sub- and superscripts

When Caret & Tilde are enabled, text can be sub- and superscripted with a simple syntax, which is more convenient than directly using the corresponding sub and sup HTML tags:

markdown

- H~2~O
- A^T^A

H2O
A^T^A

</div>

Adding keyboard keys

When Keys is enabled, keyboard keys can be rendered with a simple syntax. Consult the Python Markdown Extensions documentation to learn about all available shortcodes:

markdown

++ctrl+alt+del++

++ctrl+alt+del++

</div>