How I got LaTeX working with Hugo and blogdown
Solution 1 of 3
NOTE: This solution for getting LaTeX to work via MathJax requires the blog post to be in .Rmd format. It doesn’t work in .Rmarkdown. And recall, the latter is needed for my syntax highlighting to work. So currently I don’t know how to create a post that has both syntax highlighting for code (requires .Rmarkdown) and LaTeX math expressions (requires .Rmd). (Hey, wait! The syntax highlighting for the GJL_mathjax.html code lower down in this post does work. I don’t know if Python and R highlighting would work though?)
To get LaTeX expressions to work the way you’d expect, you have to put some MathJax code in the relevant post. The way that various websites recommend to do this is via one of Hugo’s partial template files. The reason they recommend doing it via a partial is so you can load that partial in one of your template files. For example, in my theme’s single.html template, I see the code
{{ partial "share.html" . }}
which ensures that the partial for sharing is included by default on every post of type “single”. Many sources recommend inserting the MathJax code into a partial such as header.html or footer.html – something that’s guaranteed to get loaded in every post – but those partials aren’t included in my single.html template. So I just created a new partial called GJL_mathjax.html, and in my single.html template, below the line {{ partial "share.html" . }}, I added
{{ partial "GJL_mathjax.html" . }}
This ensures the MathJax bit of code (from GJL_mathjax.html) gets inserted in every post of type “single”, and now things work! So the result of $x=5$ is \(x=5\), and the result of $$x=5$$ is \[x=5\]
The content of GJL_mathjax.html is:
<script src="//yihui.name/js/math-code.js"></script>
<script async
src="//cdn.bootcss.com/mathjax/2.7.1/MathJax.js?config=TeX-MML-AM_CHTML">
</script>
<!-- The above block is from https://bookdown.org/yihui/blogdown/templates.html -->
The above code can be found under the bullet “Support math expressions through MathJax”.
Testing this solution on R code
Does this syntax highlighting show up right?
myFunction <- function(f,g,h){
print('Hi Mom')
return (f*g*h^2)
}
Testing this solution on Python code
How about this python code, with the three backticks in the code fence followed by python?
x = [1, 2, 3, 4, 5]
print(x[0:4])
And how about without the python – just the typical plain code fence?
x = [1, 2, 3, 4, 5]
print(x[0:4])
Solution 2 of 3
I could also try this other solution. Yihui comments that his solution (solution 1, above) is better and avoids some “potential problem.” But perhaps this solution would allow the LaTeX math to work with .Rmarkdown files (instead of only working with .Rmd files, for which I can’t get syntax highlighting to work!).
Solution 3 of 3
There’s another apparently independent solution Yihui used … here’s some other snippet that Yihui put into his footer.html in his Lithium theme:
<script type="text/x-mathjax-config">
MathJax.Hub.Config({
tex2jax: {
skipTags: ['script', 'noscript', 'style', 'textarea', 'pre']
}
});
</script>
<script type="text/javascript"
src="https://cdn.mathjax.org/mathjax/latest/MathJax.js?config=TeX-AMS-MML_HTMLorMML">
</script>