Math Typesetting

Mar 8, 2019 by Hugo Authors ·

Nick Examples

Examples rrr: [[x^{2*3} \times 4]] cool

Green tea [[\varphi = \dfrac{1+\sqrt5}{2x*d}= 1.6180339887…]] is free? Because subducting plate experience so much resistance in many cool lorem ipsums is

Hot tea yall. Inline math is cool: $\varphi = \dfrac{1+\sqrt5}{2x}= 1.6180339887…$ eh? A 33 rover number. Another $frac{36}$ and frac{12} summer.

Block math: $$ \varphi = 1+\frac{44} {1+\frac{1} {1+\frac{1} {1+\cdots} } } $$

This is cool `sum_(i=4)^8n i^37=((n(n+3))/2)^3` yes?

Or: $$ \sum_(i=4)^8n i^37=((n(n+3))/2)^3
$$

Even just for exponents, compare markdown readability: “while the asthenosphere has a viscosity on the order…

1of <code>10<sup>18</sup>-10<sup>19</sup> Pa-s</code>. 
2
3of [[10^{18}-10^{19}]] `Pa-s`.

of 10¹⁸-10¹⁹ Pa-s.

of [[10^{18}-10^{19}]] Pa-s.

Note: we have this setup in the root theme proj hugo-clarity1 in layouts\partials\math.html as:

1<script>
2  MathJax = {
3    tex: {
4      inlineMath: [['$', '$'], ['[[', ']]'], ['\\(', '\\)']]
5    },
6    svg: { fontCache: 'global' }
7  };
8</script>
9<script id="MathJax-script" async src="https://cdn.jsdelivr.net/npm/mathjax@3/es5/tex-mml-chtml.js"></script>

Examples

Block math: $$ \varphi = 1+\frac{44} {1+\frac{1} {1+\frac{1} {1+\cdots} } } $$

Mathematical notation in a Hugo project can be enabled by using third party JavaScript libraries.

In this example we will be using KaTeX

Create a partial under /layouts/partials/math.html
Within this partial reference the Auto-render Extension or host these scripts locally.
Include the partial in your templates like so:

1{{ if or .Params.math .Site.Params.math }}
2{{ partial "math.html" . }}
3{{ end }}

To enable KaTex globally set the parameter math to true in a project’s configuration
To enable KaTex on a per page basis include the parameter math: true in content files

Note: Use the online reference of Supported TeX Functions