[hugo]KaTex Intergration

keywords：hugo, KaTex, Math Equation, Mathematics

Steps:

1. Create a partial under /layouts/partials/math.html.
2. Within this partial reference the Auto-render Extension or host these scripts locally.
   e.g. in /layouts/partials/math.html:

   <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/katex@0.16.11/dist/katex.min.css" integrity="sha384-nB0miv6/jRmo5UMMR1wu3Gz6NLsoTkbqJghGIsx//Rlm+ZU03BU6SQNC66uf4l5+" crossorigin="anonymous">
   <script defer src="https://cdn.jsdelivr.net/npm/katex@0.16.11/dist/katex.min.js" integrity="sha384-7zkQWkzuo3B5mTepMUcHkMB5jZaolc2xDwL6VFqjFALcbeS9Ggm/Yr2r3Dy4lfFg" crossorigin="anonymous"></script>
   <script defer src="https://cdn.jsdelivr.net/npm/katex@0.16.11/dist/contrib/auto-render.min.js" integrity="sha384-43gviWU0YVjaDtb/GhzOouOXtZMP/7XUzwPTstBeZFe/+rCMvRwr4yROQP43s0Xk" crossorigin="anonymous"></script>
   <script>
       document.addEventListener("DOMContentLoaded", function() {
           renderMathInElement(document.body, {
             // customised options
             // • auto-render specific keys, e.g.:
             delimiters: [
                 {left: '$$', right: '$$', display: true},
                 {left: '$', right: '$', display: false},
                 {left: '\\(', right: '\\)', display: false},
                 {left: '\\[', right: '\\]', display: true}
             ],
             // • rendering keys, e.g.:
             throwOnError : false
           });
       });
   </script>
   

3. Add source in your your templates, e.g. theme’s header.html:

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

4. Enable math in your content files.

   math= "true"
   

Then KaTex would works, Testing:

$$\varphi = 1+\frac{1} {1+\frac{1} {1+\frac{1} {1+\cdots} } }$$

$$\varphi = 1+\frac{1} {1+\frac{1} {1+\frac{1} {1+\cdots} } }$$

Reference

Supported Functions
https://katex.org/docs/supported.html

Math Typesetting
https://github.com/gohugoio/hugoBasicExample/blob/master/content/post/math-typesetting.mmark

我曾想把梅西打造为世界最佳球员，但梅西却把我送上了世界最佳教练的宝座上。 ——瓜迪奥拉