Customize AsciiMath math delimiters

Question

I want to use AsciiMath to render math formula on my page. I followed the AsciiMath getting started and put the scripts in head tag:

<script>
    MathJax = {
        tex: {inlineMath: [['$', '$'], ['\\(', '\\)']]}
    };
 </script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/mathjax/2.7.4/latest.js?config=AM_CHTML"> 
</script>
<script src="/statics/js/libs/ASCIIMathML.js"></script>

and this is my paragraph:

<p>some sample text `sqrt{3x-1}+(1+x)^2` some sample text $\sqrt{3x-1}+(1+x)^2$ some sample text</p>

it only renders sqrt{3x-1}+(1+x)^2 part which surrounds with backticks, although I changed the MathJax config to use $ as delimiters.

I'm not sure what am I missing here.

Answer 1

Your MathJax configuration file is AM_CHTML, which only includes that AsciiMath input processor, not the the TeX input processor, so that is why you are not getting the TeX expression typeset. You would need to use one that contains both AsciiMath and TeX input (say, TeX-MML-AM_CHTML, which also includes MathML), or configure MathJax to load the TeX input processor separately via

<script>
MathJax = {
  jax: ['input/TeX'],
  extensions: ['tex2jax.js'],
  tex2jax: {inlineMath: [['$', '$'], ['\\(', '\\)']]}
};
</script>
<script src="https://cdn.jsdelivr.net/npm/mathjax@2/MathJax.js?config=AM_CHTML"></script>

Note also that you are using version 2 of MathJax, but a version 3 configuration. For version 2, you need to configure the inlineMath in the tex2jax configuration block, not tex (as you do in version 3).

Finally, you do not need the line

<script src="/statics/js/libs/ASCIIMathML.js"></script>

at all, as AsciiMath is included in the MathJax configuration that you are using, and including it here would just interfere with MathJax's processing of the AsciiMath (note that ASCIIMathML.js would convert the math to MathML, which may not display in all browsers, notably Microsoft Edge and Google Chrome).