另辟蹊径吧,可最早探讨phpBB论坛上渲染LaTex公式的帖子是2007年的事。我也不知道是phpBB的用户很陋,从来不贴公式,抑或是水平很高,无师自通,不用求教和讨论。
我搜索半天,挺痛苦的,就是高人们总是不给你完整的实现过程,都是拣最精要的地方用只言片语秀一下就打住,可能非如此无以显其高吧。总的来说,IT领域对我这样的非专业人士来说很不友好,民科不好混啊。
最后我找到了“MathJax的基本使用 - 启明星工作室 - 博客园”这篇文章,总算把问题攒起来了,终于取得了突破,基本搞定了这个问题。现录出如下:
在overall_header.html的head段里加上一下来自katex官网文档的代码:
代码: 全选
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/[email protected]/dist/katex.min.css" integrity="sha384-wcIxkf4k558AjM3Yz3BBFQUbk/zgIYC2R0QpeeYb+TwlBVMrlgLqwRjRtGZiK7ww" crossorigin="anonymous">
<script defer src="https://cdn.jsdelivr.net/npm/[email protected]/dist/katex.min.js" integrity="sha384-hIoBPJpTUs74ddyc4bFZSM1TVlQDA60VBbJS0oA934VSz82sBx1X7kSx2ATBDIyd" crossorigin="anonymous"></script>
<script defer src="https://cdn.jsdelivr.net/npm/[email protected]/dist/contrib/auto-render.min.js" integrity="sha384-43gviWU0YVjaDtb/GhzOouOXtZMP/7XUzwPTstBeZFe/+rCMvRwr4yROQP43s0Xk" crossorigin="anonymous"></script>
<script>
document.addEventListener("DOMContentLoaded", function() {
renderMathInElement(document.body, {
// customised options
// • auto-render specific keys, e.g.:
delimiters: [
{left: '$$', right: '$$', display: true},
{left: '$', right: '$', display: false},
{left: '\\(', right: '\\)', display: false},
{left: '\\[', right: '\\]', display: true}
],
// • rendering keys, e.g.:
throwOnError : false
});
});
</script>
没必要用BBcode标签了,直接单\$分割符渲染行内公式,左对齐;双\$分隔符渲染行间公式,另起一行,居中。
另外,还可以用MathJax实现公式渲染,但渲染速度要慢一些,而且js和css文件没法下载到本地引用。其overall_header.html的加入代码如下:
代码: 全选
<script type="text/x-mathjax-config">
MathJax.Hub.Config({
extensions: ["tex2jax.js"],
jax: ["input/TeX", "output/HTML-CSS"],
tex2jax: {
inlineMath: [ ['$','$'], ["\\(","\\)"] ],
displayMath: [ ['$$','$$'], ["\\[","\\]"] ],
processEscapes: true
},
"HTML-CSS": { fonts: ["TeX"] }
});
</script>
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/mathjax/2.7.7/MathJax.js?config=TeX-AMS_HTML">
</script>