[Support] Inline maths equations with $6$ or \(...\) not {{< math.inline >}}

[bee-san]

To use maths inline, we have to use:

{{< math.inline >}}

Following this article https://adityatelange.github.io/hugo-PaperMod/posts/math-typesetting/.

Is there anyway we can use single dollars such as $6$ for inline, and double dollars for blocks $$6$$? or \(...\) for inline?

If so, how? I'm rather new to this and I can't find anything from mindlessly digging around :)

[kdkasad]

Is there anyway we can use single dollars such as $6$ for inline, and double dollars for blocks $$6$$? or \(...\) for inline?

Yes. You don't actually need the {{< math.inline >}} lines around the KaTeX. Those are to tell Hugo to parse what's inside it as an HTML Hugo template rather than as Markdown (that's why the conditional statements work). So they are required around the lines which include the KaTeX scripts, but not around the actual KaTeX markup.

You can use \\( ... \\) for inline KaTeX. You have to use two backslashes due to the way backslashes are treated during Markdown processing

The following works just fine:

{{< math.inline >}}
{{ if or .Page.Params.math .Site.Params.math }}

<!-- KaTeX -->
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/[email protected]/dist/katex.min.css" integrity="sha384-zB1R0rpPzHqg7Kpt0Aljp8JPLqbXI3bhnPWROx27a9N0Ll6ZP/+DiW/UqRcLbRjq" crossorigin="anonymous">
<script defer src="https://cdn.jsdelivr.net/npm/[email protected]/dist/katex.min.js" integrity="sha384-y23I5Q6l+B6vatafAwxRu/0oK/79VlbSz7Q9aiSZUvyWYIYsd+qj+o24G5ZU2zJz" crossorigin="anonymous"></script>
<script defer src="https://cdn.jsdelivr.net/npm/[email protected]/dist/contrib/auto-render.min.js" integrity="sha384-kWPLUVMOks5AQFrykwIup5lo0m3iMkkHrD0uJ4H5cjeGihAutqP0yW0J6dpFiVkI" crossorigin="anonymous" onload="renderMathInElement(document.body);"></script>
{{ end }}
{{</ math.inline >}}

### Examples

Inline math: \\(\varphi = \dfrac{1+\sqrt5}{2}= 1.6180339887…\\)

Block math:

$$
 \varphi = 1+\frac{1} {1+\frac{1} {1+\frac{1} {1+\cdots} } }
$$

The reason the inline shortcodes are used here is because the math partial is not included in the hugo-PaperMod theme. If wanted, I could create a PR to include it so you don't need inline shortcodes at all (which is preferred).

[kdkasad]

Turns out there's a way to set custom delimiters for KaTeX: https://katex.org/docs/autorender.html#api

So you could use $ ... $ as the inline delimiters.

[bee-san]

Turns out there's a way to set custom delimiters for KaTeX: https://katex.org/docs/autorender.html#api

So you could use $ ... $ as the inline delimiters.

Thanks for this! ❤️ How would I go about making the API support $ ... $? I assumed like this:

<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/[email protected]/dist/katex.min.css" integrity="sha384-AfEj0r4/OFrOo5t7NnNe46zW/tFgW6x/bCJG8FqQCEo3+Aro6EYUG4+cU+KJWu/X" crossorigin="anonymous">
<script defer src="https://cdn.jsdelivr.net/npm/[email protected]/dist/katex.min.js" integrity="sha384-g7c+Jr9ZivxKLnZTDUhnkOnsh30B4H0rpLUpJ4jAIKs4fnJI+sEnkvrMWph2EDg4" crossorigin="anonymous"></script>

<script defer src="https://cdn.jsdelivr.net/npm/[email protected]/dist/contrib/auto-render.min.js" integrity="sha384-mll67QQFJfxn0IYznZYonOWZ644AWYC+Pt2cHqMaRhXVrursRwvLnLaebdGIlYNa" crossorigin="anonymous"
    onload="renderMathInElement(document.body, [ {left: "$$", right: "$$", display: true}, {left: "$", right: "$", display: false}, {left: "\\(", right: "\\)", display: false}, {left: "\\[", right: "\\]", display: true} ]);">
</script>

But this doesn't work :(

[kdkasad]

I think the list must be the value of the delimiters key. Example:

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

The way that section is written is rather confusing, to be honest.

[pourmand1376]

I used the approach taken in here and I could successfully use inline math with Hugo.