Issue with adding Mathjax support to posts using BeautifulHugo Theme

Using Themes
1

I have the BeautifulHugo theme working in Hugo 0.74.3 and also included Mathjax support. BeautifulHugo comes with Katex support native, but Mathjax supports Tikz diagrams as well.

I created some simple posts to just test some functionalities. While the block math equations work just fine, it seems like inline math does not work. So I was trying to figure out what could be the issue. Here is a live example if anyone wants to check, Markdown Test - Datakind WeRobotics Building Detector.

The picture shows what is in the link. Selection_008

The corresponding markdown looks like. Note that I have tried both inline math delimiters, including the $ ... $ and the \( ... \) but neither work.

This is a sentence with math $y_{t} = a*y_{t-1} + \epsilon \sim N(0, \sigma^2)$.


\begin{equation}
x^n + y^n = z^n 
\end{equation}

This is the same equation again.

Also, here is what the mathjax configuration looks like. I created a layouts/partial/mathjax_support.html file with the following code. I added this partial to the header.html. Note that the inlineMath characters look correct,
so that does not seem to be the issue.

<script type="text/javascript">
    MathJax.Hub.Config({
    tex2jax: {
      inlineMath: [['$','$'], ['\\(','\\)']],
      displayMath: [['$$','$$'], ['\\[', '\\]']],
      processEscapes: true,
      processEnvironments: true,
      skipTags: ['script', 'noscript', 'style', 'textarea', 'pre'],
      TeX: { equationNumbers: { autoNumber: "AMS" },
           extensions: ["AMSmath.js", "AMSsymbols.js"] }
    }
    });
    MathJax.Hub.Queue(function() {
      // Fix <code> tags after MathJax finishes running. This is a
      // hack to overcome a shortcoming of Markdown. Discussion at
      // https://github.com/mojombo/jekyll/issues/199
      var all = MathJax.Hub.getAllJax(), i;
      for(i = 0; i < all.length; i += 1) {
          all[i].SourceElement().parentNode.className += ' has-jax';
      }
    });

    MathJax.Hub.Config({
    // Autonumbering by mathjax
    TeX: { equationNumbers: { autoNumber: "AMS" } }
    });
  </script>

<script src="https://polyfill.io/v3/polyfill.min.js?features=es6"></script>
<script id="MathJax-script" async src="https://cdn.jsdelivr.net/npm/mathjax@3/es5/tex-mml-chtml.js"></script>

Any ideas of how to fix this?

2

there are some MathJax topics here, use the search function please

my samples are there

I use the tex shortcode to trigger the inclusion of MathJax.
Don’t use the backslashes, iit is an escape character, makes some trouble.