wordpress支持数学公式显示

想在wp里显示数学公式怎么办?查询了相关资料,有的用插件有的写代码之类的。经过实践和测试,下面的方案亲测可行。

采用的方案是一个基于LaTeX显示数学公式的JavaScript引擎-MathJax-https://www.mathjax.org/,这个JS引擎的优点是全浏览器支持,不需要额外插件设置,非常方便。

配置

具体使用步骤如下:在使用主题的header.php文件里添加JS引用,具体步骤:登陆wordpress,进入外观->编辑->主题页眉 (header.php)。在head标签里添加一行代码引入MathJax:

<script src='https://cdnjs.cloudflare.com/ajax/libs/mathjax/2.7.0/MathJax.js?config=TeX-MML-AM_CHTML'></script>

值得注意的是,这行代码必须要放到 <?php wp_head(); ?>之前,否则不生效)这里的JS地址用的是MathJax的官方CDN,其实也完全可以把这个MathJax.js文件下载放到本地,然后配置成本地地址。

使用

该如何显示数学公式呢?我们知道MathJax是基于LaTeX的,所以首先要用LaTeX语法把数学公式写出来。这里推荐一个非常好用的在线的LaTeX编辑数学公式的网站:Oneline LaTex Equation Editor
这个网站提供图形化编辑工具,能实时显示数学公式。LaTeX编辑数学公式的语法学习成本基本为零,很简单,写得多了都不需要图形化工具了。

在线LaTeX公式编辑器-编辑器 (latexlive.com) 这个网站可以打开。

用LaTex写好了数学公式之后在博客里把它加进去,这里要使用某些特定的分隔符以方便被MathJax识别。具体地,有两种显示方式:

换行显示displayed mathematics),它的分隔符是 $$...$$和 \[...\ ,比如我们有一个数学公式: \sqrt{a^2+b^2} ,那么它的换行显示的格式就是: $$\sqrt{a^2+b^2}$$ 或者 \[\sqrt{a^2+b^2}\] ,显示效果就是这样的$$\sqrt{a^2+b^2}$$

行内显示in-line mathematics),它的分割符号是 \(...\) ,行内显示的格式: \(\sqrt{a^2+b^2}\) ,显示效果:\(\sqrt{a^2+b^2}\)就是这样的

完成以上3个简单的步骤就能在你的博客或者任何HTML页面里显示数学公式了。

发表评论