XinYi Chua
XinYi Chua

Reputation: 281

How to configure Mathjax in Python Django

I would like to know how to configure Mathjax in Django in a Q&A system where Questions and Answers will be based on LaTeX format.

I have tried to add:

<script type="text/javascript"
   src="http://cdn.mathjax.org/mathjax/latest/MathJax.js?config=TeX-AMS-MML_HTMLorMML"></script>

into the html template where the questions and answers will be displayed to no avail.

Thanks.

Upvotes: 3

Views: 3623

Answers (3)

xiaoou wang
xiaoou wang

Reputation: 1041

see https://docs.mathjax.org/en/latest/web/configuration.html. For the demo indicated here to work you should also add ['\(', '\)'] to inlineMath:


<script>
MathJax = {
  tex: {
    inlineMath: [['$', '$'], ['\\(', '\\)']]
  },
  svg: {
    fontCache: 'global'
  }
};
</script>
<script type="text/javascript" id="MathJax-script" async
  src="https://cdn.jsdelivr.net/npm/mathjax@3/es5/tex-svg.js">
</script>

Upvotes: 0

Davide Cervone
Davide Cervone

Reputation: 12260

If the page's content is dynamically created, you will need to call MathJax after the content has been loaded. See the documentation for details. The main idea is that you have to include

MathJax.Hub.Queue(["Typeset",MathJax.Hub]);

in the javascript that is executed after the content is in place.

Upvotes: 5

Mint.High
Mint.High

Reputation: 83

fOR Dynamic content here's is the working solution. I used AsciiMath Input as the input format in mathjax that incorporates ASCIIMathML. In the base.html add the following scripts:

<script>
  MathJax = {
    loader: {load: ['input/asciimath', 'output/chtml']}
  }
</script>
<script src="https://polyfill.io/v3/polyfill.min.js?features=es6"></script>
<script type="text/javascript" id="MathJax-script" async src="https://cdn.jsdelivr.net/npm/mathjax@3/es5/startup.js"></script>
<script type="text/javascript" id="MathJax-script" async src="https://cdn.jsdelivr.net/npm/mathjax@3/es5/tex-chtml.js">

and remember to enclose the dynamic text by back-ticks”, i.e., `...` So in the django-admin you can simply enter sqrt(50) as ` sqrt(50) ` or ` x^2 ` and the dynamic content which is passed from view to the template, in the template you surround {{e1}} by back-ticks

` {{ e1 }} `

instead of
{{ e1 }} where e1 is the dynamic content. So if e1 which was earlier displayed in plain text as 2*sqrt(2) will now be displyed as 2√2.

For more details: http://docs.mathjax.org/en/latest/input/asciimath.html#asciimath-support

Upvotes: 0

Related Questions