Deprecated, next theme have built in mathjax support

How to use mathjax in hexo

Well, I need maths equation in next post, but hexo does not support latex naturally, I goolge a little bit, find this, which use mathjax with hexo. I try it out, it’s total working, here are some test.

  1. Multi-line equation.
    \begin{aligned}
    \dot{x} & = \sigma(y-x) \\
    \dot{y} & = \rho x - y - xz \\
    \dot{z} & = -\beta z + xy
    \end{aligned}

  2. Matrix
    \begin{bmatrix}
    1 & 2\\
    3 & 4
    \end{bmatrix}

  3. Complex equation
    $$\frac{\partial u}{\partial t}=
    h^2 \left( \frac{\partial^2 u}{\partial x^2}+
    \frac{\partial^2 u}{\partial y^2}+
    \frac{\partial^2 u}{\partial z^2}\right)$$

Cool, all works well. Only one thing to notice, do not begin with +,=,- in your equation, it may conflicts with markdown parser in hexo.

Make mathjax integrate with hexo theme

But for hexo theme developer, it’s probably not a good idea to enable mathjax by default, it’s better letting user choose whether they want to enable it. So it’s important to integrate mathjax with hexo theme. It can be easily done by adding a few lines from above method. In mathjax.ejs file, add one line in front of it.

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
<% if (theme.mathjax.enable){ %>
<script type="text/x-mathjax-config">
MathJax.Hub.Config({
tex2jax: {
inlineMath: [ ['$','$'], ["\\(","\\)"] ],
processEscapes: true
}
});
</script>

<script type="text/x-mathjax-config">
MathJax.Hub.Config({
tex2jax: {
skipTags: ['script', 'noscript', 'style', 'textarea', 'pre', 'code']
}
});
</script>

<script type="text/x-mathjax-config">
MathJax.Hub.Queue(function() {
var all = MathJax.Hub.getAllJax(), i;
for(i=0; i < all.length; i += 1) {
all[i].SourceElement().parentNode.className += ' has-jax';
}
});
</script>

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

Note that there is a if sentence on the top, it reads the theme config to see if mathjax is enabled. And in the theme config file, there should be some lines like:

1
2
mathjax:
enable: true

Then it is done, you can choose to enable mathjax by modify config file.


Comments

2014-03-05