Hugo で生成するコンテンツに KaTeX を導入する。

  • Hugo : 0.82.0
  • KateX : 0.13.0

layouts/particals/katex.html に以下を記述する。(Auto-render Extension 参照)

<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/katex@0.13.0/dist/katex.min.css" integrity="sha384-t5CR+zwDAROtph0PXGte6ia8heboACF9R5l/DiY+WZ3P2lxNgvJkQk5n7GPvLMYw" crossorigin="anonymous">
<script defer src="https://cdn.jsdelivr.net/npm/katex@0.13.0/dist/katex.min.js" integrity="sha384-FaFLTlohFghEIZkw6VGwmf9ISTubWAVYW8tG8+w2LAIftJEULZABrF9PPFv+tVkH" crossorigin="anonymous"></script>
<script defer src="https://cdn.jsdelivr.net/npm/katex@0.13.0/dist/contrib/auto-render.min.js" integrity="sha384-bHBqxz8fokvgoJ/sc17HODNxa42TlaEhB+w8ZJXTc2nZf1VgEaFZeZvT4Mznfz0v" crossorigin="anonymous"
    onload="renderMathInElement(document.body);"></script>

以下の関数が提供される。

function renderMathInElement(elem, options)

document.addEventListener("DOMContentLoaded", function() {
  renderMathInElement(
      document.body,
      {
          delimiters: [
              {left: "$$", right: "$$", display: true},
              {left: "\\[", right: "\\]", display: true},
              {left: "$", right: "$", display: false},
              {left: "\\(", right: "\\)", display: false}
          ]
      });
  });

layouts/particals/footer.html に以下を追加する。

  {{ partial "katex.html" . }}

表示例

  • ディスプレイ数式

    • 記述 : $$A+B$$ $ \implies $ $$A+B$$
    • 記述 : \\[A+B\\] $ \implies $ \[A+B\]
    • 記述 : \\[\hat{\theta}\\] $ \implies $ \[\hat{\theta}\]
    • 記述 :
      \\[\sum_{ \begin{subarray}{l} i\in\Lambda\\ 0<j<n \end{subarray}}\\]
      $ \implies $ \[\sum_{ \begin{subarray}{} i\in\Lambda\ 0<j<n \end{subarray}}\]
    • 記述： $$\int_{a}^{b} x^2 dx$$ $ \implies $ $$\int_{a}^{b} x^2 dx$$

  • インライン数式

    • 記述 : \\(A+B\\) $ \implies $ \(A+B\)
    • 記述 : $A+B$ $ \implies $ $A+B$
    • 記述 : \\(\hat{\theta}\\) $ \implies $ \(\hat{\theta}\)
    • 記述 :
      \\(\sum_{ \begin{subarray}{l} i\in\Lambda\\ 0<j<n \end{subarray}}\\)
      $ \implies $ $\sum_{ \begin{subarray}{} i\in\Lambda\ 0<j<n \end{subarray}}$
    • 記述： $\int_{a}^{b} x^2 dx$ $ \implies $ $\int_{a}^{b} x^2 dx$

以下の記事を参考にした。