MathJax/KaTeX have difficulty with line breaks

support
1

Hugo version
hugo v0.143.1+extended+withdeploy linux/amd64 BuildDate=unknown

Using
Emacs with Kaushal Modi’s excellent ox-hugo org-mode to Hugo exporter. (This just copies equations straight across as they are into the generated html though.)

The problem
My blog (such as it is) is mostly mathematical, so I use Mathjax heavily, although at the moment I’m experimenting with KaTeX. But the same thing happens with each one: line breaks ruin the equation.

For example, the matrix equation

\[
P=\begin{bmatrix}2&3&1\\ 2&1&1\\ -4&1&1\end{bmatrix}^{-1}
\begin{bmatrix}4&12&9\\ 4&4&1\\ 16&-8&1\end{bmatrix}=
\begin{bmatrix}2&-2&0\\ 0&-4&-4\\ -8&4&3\end{bmatrix}
\]

is not typeset at all; to obtain the result I want everything has to be on the one line:

\[
P=\begin{bmatrix}2&3&1\\ 2&1&1\\ -4&1&1\end{bmatrix}^{-1}\begin{bmatrix}4&12&9\\ 4&4&1\\ 16&-8&1\end{bmatrix}=\begin{bmatrix}2&-2&0\\ 0&-4&-4\\ -8&4&3\end{bmatrix}
\]

In fact, the only way I seem to obtain a decent matrix equation is to have the entire thing on one long line - which of course makes it very hard to read.

As far as I recall I never used to have this problem - and I don’t know whether it’s a Hugo problem, or a MathJax/KaTeX problem, or something else. But I’d be delighted of any advice.

2

If you want to render mathematical markup on the client side, follow these directions:

https://gohugo.io/content-management/mathematics/#setup

If you want to render mathematical markup on the server side, follow these directions:

https://gohugo.io/functions/transform/tomath/#example

In either case I see this:

image
image421×109 3.61 KB

3

Thank you very much for the links to those documents. I have tried to work through the client side material, with no success so far. So still I have the problem of line breaks preventing an equation from being typeset. I’ll check it again though.

I’m surprised it should be that difficult. There’s also some confusion: the documentation for hugo-clarity, the theme I’m using, asks to set the parameter

enableMathNotation = true

whereas the Hugo documentation asks for

math = true

Also, in the documentation, the passthrough delimiters are set as

[markup.goldmark.extensions.passthrough.delimiters]
          block = [['\[', '\]'], ['$', '$']]
          inline = [['\(', '\)']]

but the MathJax setup includes

tex: {
      displayMath: [['\\[', '\\]'], ['$', '$']],  // block
      inlineMath: [['\\(', '\\)']]                  // inline
    },

with a warning that the delimiters should match. But the passthrough delimiters have two backslashes, as \\[, and the tex delimiters just one: \[. This seems confusing.

I’ll keep experimenting! And again, thank you very much.

4

It isn’t. The documentation that I referred you to has been thoroughly tested.

That’s the theme author’s choice. It’s irrelevant as long the conditional check for JavaScript and CSS inclusion uses the same key.

The values are the same. In TOML, single quoted strings are raw literals (the backslash is just a backslash), where in JavaScript the backslash always escapes the following character, regardless of whether the string is encapsulated in single quotes or double quotes.

If you need additional assistance, please post a link to the public repository for your site.

5

Thank you very much. I’m still not sure why it’s not working as it should … I’ll ask on the theme discussions as well.

Alasdair