1.0.1 • Public • Published

MathJax plugin for Eleventy (11ty)

Eleventy plugin for supporting the MathJax library.

Repository Stats:

GitHub package.json version Stars Badge Forks Badge Pull Requests Badge Issues Badge GitHub contributors License Badge

Code Quality Stats:

Github Actions Build Status Quality Gate Status Coverage CodeFactor Known Vulnerabilities Scorecard score OpenSSF Best Practices

⚡️ Quick start

Install the plugin by using the following command:

npm install --save-dev @sunt-programator/eleventy-plugin-mathjax

Or use this command in case you are using the Yarn package manager:

yarn add --dev @sunt-programator/eleventy-plugin-mathjax

Next, add this plugin into your Eleventy configuration file (e.g. eleventy.config.js):

const mathjaxPlugin = require("@sunt-programator/eleventy-plugin-mathjax");

module.exports = function (eleventyConfig) {

🕘 Usage

For a block math, use the $$...$$ notation:


This will render to:

$$ x=\frac{-b\pm\sqrt{b^2-4ac}}{2a} $$

For an inline math, use the \\(...\\) notation:

This is an inline math: \\(x=\frac{-b\pm\sqrt{b^2-4ac}}{2a}\\).

This will render to:

This is an inline math: $x=\frac{-b\pm\sqrt{b^2-4ac}}{2a}$.

🗿 Options

This plugins supports overriding the global options by passing to the addPlugin function an object as a second argument:

// Copy the fonts from node_modules to the output site directory
  "node_modules/mathjax-full/ts/output/chtml/fonts/tex-woff-v2/": "/fonts/tex-woff-v2/",

// Use the fonts to render the glyphs in CommonHTML mode
eleventyConfig.addPlugin(mathjaxPlugin, {
  chtml: {
    fontURL: "/fonts/tex-woff-v2",

The global options used by this plugin look like this:

const globalOptions = {
  inputFormat: "tex",
  outputFormat: "chtml",
  asciimath: { delimiters: [["\\(", "\\)"]] },
  mml: {},
  tex: {
    packages: AllPackages,
  svg: {},
  chtml: {},
  liteAdaptor: {},
  useAssistiveMml: true,
Option Description
inputFormat The math format of the input. Accepts tex, asciimath or mml. Default: tex.
outputFormat The math format of the produced output. Acceps chtml or svg. Default: chtml.
asciimath The AsciiMath configuration options. Valid if the inputFormat is set to asciimath.
tex The TeX configuration options. Valid if the inputFormat is set to tex.
mml The MathML configuration options. Valid if the inputFormat is set to mml.
svg The SVG configuration options. Valid if the outputFormat is set to svg.
chtml The CommonHTML configuration options. Valid if the outputFormat is set to chtml.
liteAdaptor The Lite Adaptor configuration options.
useAssistiveMml The flag indicating whether to use the assistive MathML.

💡 Inspiration

This plugin used two repos as an inspiration:

  1. MathJax Node Demos - Integration with MathJax
  2. eleventy-plugin-mathjax by Tsung-Ju Chiang - Plugin implementation
  3. Angular - Community Standards files

📰 License

This plugin is MIT licensed.

Package Sidebar


npm i @sunt-programator/eleventy-plugin-mathjax

Weekly Downloads






Unpacked Size

64.7 kB

Total Files


Last publish


  • victor.pogor