# MathJax with code fences 2

I use the MathJax implementation which is described here.

Something like

$\Rightarrow$


renders, but something like


$\Rightarrow$



doesn’t render. Can somebody reproduce this?

The solution mentioned here, doesn’t work for me, because I use math in nested shortcodes:

{{% example %}}

Our first example

{{< math >}}
$\Rightarrow$
{{< /math >}}

{{% /example %}}


Outside the {{% example %}} environment the {{< math >}} part would render perfectly.

You should give us more information to help.
What is in your shortcode?

I use a math shortcode with this inside

${{safeHTML .Inner}}$
the call looks like

{{< math >}}\Rightarrow{{< /math >}}

This is a short content, copy it in the other shortcode - as a workaround

shortcodes/math.html

{{ .Inner }}

shortcodes/example.html

<div class="some classes">
<div class="some classes">
Example
</div>
{{ .Inner }}
</div>


I tried to add safeHTML to both of the {{ .Inner }} in the shortcodes, but it doesn’t work.

I would put the braces in there

${{ .Inner }}$

and call it

{{<example>}}\rightarrow{{</example>}}

It still gets escaped

{{% example %}}

Our first example

{{< math >}}
\Rightarrow
{{< /math >}}

{{% /example %}}


Output

(\Rightarrow)

can you switch from  to other symbols?
$works for me. Must be set in the script call. 1 Like What works in nested shortcodes {{< math >}}$\Rightarrow${{< /math >} and {{< math >}}\Rightarrow{{< /math >} (with dollars in shortcodes like ${{ .Inner }}$) What doesn’t work nested shortcodes {{< math >}}$\Rightarrow${{< /math >} and {{< math >}}\Rightarrow{{< /math >} (with parenthesis in shortcodes like ${{ .Inner }}$) BUT You have to activate the dollar symbol in the MathJax configuration MathJax 2.7 <script type="text/javascript" async src="https://cdnjs.cloudflare.com/ajax/libs/mathjax/2.7.7/MathJax.js?config=TeX-MML-AM_CHTML"> MathJax.Hub.Config({ tex2jax: { inlineMath: [['$','$'], ['\$','\$']], displayMath: [['$$','$$']] } }); </script>  MathJax 3 MathJax = { tex: { inlineMath: [['$', '$'], ['\$', '\$']], displayMath: [['$$','$$'], ['\$', '\$']] } }; <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-svg.js"></script>  EDIT I just found out that $\Rightarrow\$

or

$$\Rightarrow$$

renders perfectly (in- and outside of shortcodes) without the {{< math >}}-environment. I didn’t expect that.

Maybe somebody can explains why this works?

the back-slash is an escape character to remove syntax functions of other characters.
this can play a role here.

Here is a great trick that I have used really effectively in one of my themes:

Without this trick, remembering to escape the backslashes is a pain, and other special characters get interpreted. With this trick, easy!
I did not invent this trick - but am really greatfull to the author since it has really saved me a lot!
1 Like

In the comments of the post you shared, there is another solution mentioned which also looks very nice:

https://www.stderr.nl/Blog/Blog/MathJaxInMarkdown.html

I will try both and figure out what works best for me.

This topic was automatically closed 2 days after the last reply. New replies are no longer allowed.