Files
hextra_mirror/exampleSite/content/docs/guide/latex.md
Xin 9a20f07d4e feat(math): support local katex assets and improve docs (#742)
* refactor(math): update LaTeX guide and enhance KaTeX integration

- Revised the LaTeX documentation for clarity and improved structure, changing section titles and descriptions for better understanding.
- Added support for chemistry expressions using the mhchem extension.
- Introduced a new KaTeX CSS loader partial to streamline the integration of KaTeX, allowing for configurable remote or local asset loading.
- Updated the head partial to utilize the new KaTeX loader, enhancing the flexibility of math rendering options.

* refactor(mathjax): simplify MathJax script URL configuration

- Removed the dynamic version assignment for MathJax and set a fixed version in the script URL for consistency and clarity.

* docs(latex): enhance LaTeX guide and clarify chemistry expressions

- Updated section titles for better clarity, changing "Supported Functions" to "Chemistry Expressions."
- Improved description of the mhchem extension for rendering chemistry equations.
- Removed redundant instructions regarding the passthrough extension in Hugo.
- Corrected minor typographical errors in references to MathJax.
2025-08-13 15:14:46 +08:00

4.2 KiB

title, weight
title weight
LaTeX 4

LaTeX math expressions are rendered using (\KaTeX) by default. Simply start including them in your Markdown content without any manual configurations.

Usage

You can use LaTeX for both inline expressions and for larger blocks of text.

Inline Math

To include an expression within a line of text, wrap it in \( and \) delimiters.

This \(\sigma(z) = \frac{1}{1 + e^{-z}}\) is an inline expression.

This ( \sigma(z) = \frac{1}{1 + e^{-z}} ) is an inline expression.

Display Math

For expressions that you want to stand on their own in a separate paragraph, use $$ delimiters.

$$F(\omega) = \int_{-\infty}^{\infty} f(t)\, e^{-j \omega t} \, dt$$

will be rendered as:

F(\omega) = \int_{-\infty}^{\infty} f(t)\, e^{-j \omega t} \, dt

You can also use LaTeX environments like aligned for multi-line expressions.

$$
\begin{aligned}
  \nabla \cdot \mathbf{E} &= \frac{\rho}{\varepsilon_0} \\
  \nabla \cdot \mathbf{B} &= 0 \\
  \nabla \times \mathbf{E} &= -\frac{\partial \mathbf{B}}{\partial t} \\
  \nabla \times \mathbf{B} &= \mu_0 \left( \mathbf{J} + \varepsilon_0 \frac{\partial \mathbf{E}}{\partial t} \right)
\end{aligned}
$$

will be rendered as:


\begin{aligned}
  \nabla \cdot \mathbf{E} &= \frac{\rho}{\varepsilon_0} \\
  \nabla \cdot \mathbf{B} &= 0 \\
  \nabla \times \mathbf{E} &= -\frac{\partial \mathbf{B}}{\partial t} \\
  \nabla \times \mathbf{B} &= \mu_0 \left( \mathbf{J} + \varepsilon_0 \frac{\partial \mathbf{E}}{\partial t} \right)
\end{aligned}

For a list of supported functions, see KaTeX supported functions.

Chemistry Expressions

The mhchem extension is enabled by default, allowing you to easily render chemistry equations and formulas.

Inline: (\ce{H2O}) is water.

Separate paragraph:

$$\ce{Hg^2+ ->[I-] HgI2 ->[I-] [Hg^{II}I4]^2-}$$

will be rendered as:

\ce{Hg^2+ ->[I-] HgI2 ->[I-] [Hg^{II}I4]^2-}

Configuration

Important

Please enable and configure the passthrough extension in the Hugo configuration file, so that Hugo can detect LaTeX math expressions in your Markdown content.

markup:
  goldmark:
    extensions:
      passthrough:
        delimiters:
          block: [['\[', '\]'], ["$$", "$$"]]
          inline: [['\(', '\)']]
        enable: true

Math Engine

KaTeX is the default engine used to render LaTeX math expressions during the build process supported by Hugo.

The default is KaTeX, but you can also switch to MathJax if you need features only available in MathJax.

KaTeX

The default setup requires no configuration. Hugo fetches the KaTeX CSS from the CDN. If you need to pin a specific version of KaTeX or use local assets, you can do so in your hugo.yaml file.

Override CDN base URL
params:
  math:
    engine: katex
    katex:
      base: "https://cdn.jsdelivr.net/npm/katex@0.16.22/dist"
Use local assets

You can also place the css file under assets and publish additional font files required by KaTeX.

params:
  math:
    engine: katex
    katex:
      css: "css/katex.min.css"
      assets:
        - "fonts/KaTeX_Main-Regular.woff2"
        # Add other font files here

It will load the KaTeX CSS file from assets/css/katex.min.css instead of downloading from CDN.

MathJax

Alternatively, you can use MathJax to render math expressions:

params:
  math:
    engine: mathjax

Note

You can further customize MathJax (for example, adjust loader options, or change the CDN/source) by overriding the template at layouts/_partials/scripts/mathjax.html in your project. Hugo will use your version instead of the theme's default.