The fastest math typesetting library for the web.

KaTeX

How to insert formulas in a webpage? For example, $x=\frac{-b\pm\sqrt{b^2-4ac}}{2a}$.

One method is to use images, but it is extremely inconvenient. The best approach is to describe mathematical formulas in text and leave the rendering to the engine. LaTeX is a commonly used typesetting tool, including but not limited to mathematical formulas, tables, and chemical formulas. However, our primary need is to display mathematical formulas, so we only require a subset of LaTeX that can render mathematical formulas. KaTeX is a lightweight mathematical formula engine that supports HTML.

File Configuration

  1. Open the theme configuration file _config.butterfly.yml, disable MathJax, and modify KaTeX.

     1# MathJax
 2mathjax:
 3  enable: false
 4  per_page: false
 5
 6# KaTeX
 7katex:
 8  enable: true # false to load when needed, must add katex: true in the Markdown Front-matter
 9  per_page: false
10  hide_scrollbar: true

  2. Uninstall the marked or kramed plugin and install hexo-renderer-markdown-it. You can check this in the package.json file.

    1npm un hexo-renderer-marked --save # Uninstall the marked plugin
2npm un hexo-renderer-kramed --save # Uninstall the kramed plugin
3npm i hexo-renderer-markdown-it --save # Install the rendering plugin
4npm install katex @renbaoshuo/markdown-it-katex # Install the rendering plugin

  3. Configure in the _config.yml file in the root directory of hexo.

    1markdown:
2  plugins:
3    - plugin:
4      name: "@renbaoshuo/markdown-it-katex"
5      enable: true
6      options:
7        strict: false # Disable verbose warning messages from KaTeX on the command line

  4. After successful configuration, add the parameter katex: true at the beginning of the article that needs rendering.