mkdocs-material/docs/reference/mathjax.md

template
overrides/main.html

MathJax

MathJax is a beautiful and accessible way to display mathematical content in the browser, adds support for mathematical typesetting in different notations (e.g. LaTeX, MathML, AsciiMath), and can be easily integrated with Material for MkDocs.

Configuration

This configuration enables support for rendering block and inline block equations through MathJax. Create a configuration file and add the following lines to mkdocs.yml:

=== ":octicons-file-code-16: docs/javascripts/mathjax.js"

``` js
window.MathJax = {
  tex: {
    inlineMath: [["\\(", "\\)"]],
    displayMath: [["\\[", "\\]"]],
    processEscapes: true,
    processEnvironments: true
  },
  options: {
    ignoreHtmlClass: ".*|",
    processHtmlClass: "arithmatex"
  }
};

document$.subscribe(() => { // (1)
  MathJax.typesetPromise()
})
```

1. This integrates MathJax with [instant loading].

=== ":octicons-file-code-16: mkdocs.yml"

``` yaml
markdown_extensions:
  - pymdownx.arithmatex:
      generic: true

extra_javascript:
  - javascripts/mathjax.js
  - https://polyfill.io/v3/polyfill.min.js?features=es6
  - https://cdn.jsdelivr.net/npm/mathjax@3/es5/tex-mml-chtml.js
```

See additional configuration options:

• Arithmatex

Usage

Using block syntax

Blocks must be enclosed in #!latex $$...$$ or #!latex \[...\]on separate lines:

Example:

$$
\operatorname{ker} f=\{g\in G:f(g)=e_{H}\}{\mbox{.}}
$$

Result:

\operatorname{ker} f=\{g\in G:f(g)=e_{H}\}{\mbox{.}}

Using inline block syntax

Inline blocks must be enclosed in #!latex $...$ or #!latex \(...\):

Example:

The homomorphism $f$ is injective if and only if its kernel is only the 
singleton set $e_G$, because otherwise $\exists a,b\in G$ with $a\neq b$ such 
that $f(a)=f(b)$.

Result:

The homomorphism f is injective if and only if its kernel is only the singleton set e_G, because otherwise \exists a,b\in G with a\neq b such that f(a)=f(b).