hugo-coder/exampleSite/content/posts/math-typesetting.md

+++ authors = ["Lone Coder"] title = "Math Typesetting" date = "2023-07-10" description = "A brief guide to setup KaTeX" math = true tags = [

"hugo",
"markdown",
"css",
"html",

] categories = [

"theme demo",
"syntax",

] series = ["Theme Demo"] +++

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:

  {{ if or .Params.math .Site.Params.math }}
  {{ partial "math.html" . }}
  {{ 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

{{< math.inline >}} {{ if or .Page.Params.math .Site.Params.math }}

{{ end }} {{</ math.inline >}}

Examples

{{< math.inline >}}

Inline math: (\varphi = \dfrac{1+\sqrt5}{2}= 1.6180339887…)

{{</ math.inline >}}

Block math:

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