Use goldmark-mathjax extension

I’d like to use the goldmark-mathjax extension on my site, but I’m not sure where to start on installing it — I presumably have to install the extension and somehow tell hugo how to find it, but I have no idea where to start. Could anyone give me a hint?

Thanks!

The goldmark-mathjax only wraps the math in html tags. With mathjax@3 these tags aren’t necessary. You would still have to load MathJax javascript and render in the browser.

That comment does not jive with my experience. When I insert a display math, e.g.

$$\begin{vmatrix}a & b\\ c & d \end{vmatrix}$$


It no longer displays correctly (once processed by MathJax) because the markdown -> html translation has inserted additional tags.

i.e. awwong’s claim is incorrect: as well as wrapping the result in html tags (unimportant) it also ensures that the contents of the display math block are not treated as markdown (very important). More precisely, plain goldmark transforms the above into:

$$\begin{vmatrix}a &amp; b\<br> c &amp; d \end{vmatrix}$$


The main problem is that \\ has turned into \, so there is no longer a second line in the matrix.

I understand. Thank you for the clarification. This approach works for me…

1) Markdown

{{< mathjax >}}
$$\begin{vmatrix}a & b\\ c & d \end{vmatrix}$$
{{< /mathjax >}}


2) layouts/shortcodes/mathjax.html:

{{ .Inner }}


3) Inserted into <head> of page:

<script>
MathJax = {
tex: {
inlineMath: [['$', '$'], ['\$$', '\$$']]
},
svg: {
fontCache: 'global'
}
};
</script>
<script type="text/javascript" id="MathJax-script" async src="https://cdn.jsdelivr.net/npm/mathjax@3/es5/tex-svg.js">


4) Result

1 Like

Yes, I’m aware of workarounds, but I’d like to be able to use goldmark-mathjax in order to avoid them, thus my question about how to install it.

A shortcode is certainly not a workaround.

To use the goldmark-mathjax extension you would need to fork Hugo, modify its source and compile the binary on your own.