构建支持数学公式的博客

#数学

因为博文要用到数学公式,于是在网上搜索了如何让网页在浏览器中支持数学公式显示的方法,找到了一种方法,试验了一下,发现在小米浏览器下能显示,但在chrome下却网页加载缓慢且无法显示公式。

一开始还以为是markdown 解释器的缘故,在_config.yml中添加了一句

markdown: kramdown

添加后发现不仅数学公式显示不出来了,连新网页也不能生成了,猜想应该是markdown解释器没有生效。仔细检查后发现,markdown:之后, 要空一格 ,然后再输入kramdown。

修改后,页面能生成了,但数学公式仍没有。于是再在_layouts目录下,在default.html文件的

<head>...</head>

部分,添加上如下内容:

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

经测试,在小米浏览器和chrome下都能快速加载页面并显示数学公式。经对照,网上的说法是

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

但在我的博客设置上, 要将src中的http:这几个字符去掉,才能确保成功。


另外,网上也有说添加如下内容的,但我没测试:

<!-- mathjax config similar to math.stackexchange --> 
<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>

然后在发布的时候就可以使用$$来把需要显示的数学式子扩起来。像这样:

$$a^2 + b^2 = c^2$$

发布出来就是漂亮的公式了。

\[a^2 + b^2 = c^2\]

还有一些更酷的例子,例如:

$$ J\alpha(x) = \sum\limits{m=0}^\infty \frac{(-1)^m}{m! \, \Gamma(m + \alpha + 1)}{\left({\frac{x}{2}}\right)}^{2 m + \alpha} $$
\[J\alpha(x) = \sum\limits{m=0}^\infty \frac{(-1)^m}{m! \, \Gamma(m + \alpha + 1)}{\left({\frac{x}{2}}\right)}^{2 m + \alpha}\]

$$ \left( \sum_{k=1}^n a_k bk \right)^2 \leq \left( \sum{k=1}^n ak^2 \right) \left( \sum{k=1}^n b_k^2 \right)$$
\[\left( \sum_{k=1}^n a_k bk \right)^2 \leq \left( \sum{k=1}^n ak^2 \right) \left( \sum{k=1}^n b_k^2 \right)\]

好了,可以大显身手了;-)