2021-07-18 10:34:01 +02:00
|
|
|
---
|
|
|
|
author: Hugo Authors
|
|
|
|
title: Math Typesetting
|
|
|
|
date: 2021-07-18T10:52:59+08:00
|
2022-11-08 16:10:57 +01:00
|
|
|
description: A brief guide to setup KaTeX.
|
2021-07-18 10:34:01 +02:00
|
|
|
math: true
|
2022-11-09 09:03:19 +01:00
|
|
|
tags:
|
|
|
|
- KaTex
|
2021-07-18 10:34:01 +02:00
|
|
|
---
|
|
|
|
|
|
|
|
Mathematical notation in a Hugo project can be enabled by using third party JavaScript libraries.
|
2021-11-27 06:48:40 +01:00
|
|
|
|
2021-07-18 10:34:01 +02:00
|
|
|
<!--more-->
|
|
|
|
|
|
|
|
In this example we will be using [KaTeX](https://katex.org/)
|
|
|
|
|
|
|
|
- Create a partial under `/layouts/partials/math.html`
|
|
|
|
- Within this partial reference the [Auto-render Extension](https://katex.org/docs/autorender.html) or host these scripts locally.
|
|
|
|
- Include the partial in your templates like so:
|
|
|
|
|
|
|
|
```bash
|
|
|
|
{{ 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](https://katex.org/docs/supported.html)
|
|
|
|
|
|
|
|
{{< math.inline >}}
|
|
|
|
{{ if or .Page.Params.math .Site.Params.math }}
|
2021-11-27 06:48:40 +01:00
|
|
|
|
2021-07-18 10:34:01 +02:00
|
|
|
<!-- KaTeX -->
|
2021-11-27 06:48:40 +01:00
|
|
|
|
2021-07-18 10:34:01 +02:00
|
|
|
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/katex@0.11.1/dist/katex.min.css" integrity="sha384-zB1R0rpPzHqg7Kpt0Aljp8JPLqbXI3bhnPWROx27a9N0Ll6ZP/+DiW/UqRcLbRjq" crossorigin="anonymous">
|
|
|
|
<script defer src="https://cdn.jsdelivr.net/npm/katex@0.11.1/dist/katex.min.js" integrity="sha384-y23I5Q6l+B6vatafAwxRu/0oK/79VlbSz7Q9aiSZUvyWYIYsd+qj+o24G5ZU2zJz" crossorigin="anonymous"></script>
|
|
|
|
<script defer src="https://cdn.jsdelivr.net/npm/katex@0.11.1/dist/contrib/auto-render.min.js" integrity="sha384-kWPLUVMOks5AQFrykwIup5lo0m3iMkkHrD0uJ4H5cjeGihAutqP0yW0J6dpFiVkI" crossorigin="anonymous" onload="renderMathInElement(document.body);"></script>
|
|
|
|
{{ end }}
|
|
|
|
{{</ math.inline >}}
|
|
|
|
|
|
|
|
### Examples
|
|
|
|
|
|
|
|
{{< math.inline >}}
|
2021-11-27 06:48:40 +01:00
|
|
|
|
2021-07-18 10:34:01 +02:00
|
|
|
<p>
|
|
|
|
Inline math: \(\varphi = \dfrac{1+\sqrt5}{2}= 1.6180339887…\)
|
|
|
|
</p>
|
|
|
|
{{</ math.inline >}}
|
|
|
|
|
|
|
|
Block math:
|
|
|
|
$$
|
|
|
|
\varphi = 1+\frac{1} {1+\frac{1} {1+\frac{1} {1+\cdots} } }
|
|
|
|
$$
|