Build Hugo site with theme PaperMod
Special Functions and Extensions Math Typesetting Mathematical notation in a Hugo project can be enabled by using third party JavaScript libraries - KaTeX
create the math partial file: touch layouts/partials/math.html add below content to math.html
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/katex@0.16.8/dist/katex.min.css"> <script defer src="https://cdn.jsdelivr.net/npm/katex@0.16.8/dist/katex.min.js"></script> <script defer src="https://cdn.jsdelivr.net/npm/katex@0.16.8/dist/contrib/auto-render.min.js" onload="renderMathInElement(document.body);"></script> <script> document.addEventListener("DOMContentLoaded", function() { renderMathInElement(document.body, { delimiters: [ {left: '$$', right: '$$', display: true}, {left: '$', right: '$', display: false}, {left: '\\(', right: '\\)', display: false}, {left: '\\[', right: '\\]', display: true} ], throwOnError : false }); }); </script> Customize the extend_head.html: cp themes/PaperMode/layouts/partials/extend_head.html layouts/partials/extend_head.html insert below content to extend_head.html
{{ if or .Params.math .Site.Params.math }} {{ partial "math.html" . }} {{ end }} Enable math rendering by adding this to your config.yaml params: math: true # Enable math globally Config.yaml change TOC change the table of content on the right side colum of webpage, or in the middle top.
...