Hugo に数式を挿入する その2
- POST
[前回までの記事]
Hugo に数式を挿入する 経緯 mathjax のバージョンを 3 系 にアップデートした際に単純にいかなかったので備忘録として残しておく
手順 参考 を見ながらアップデートする ※version2 から version 3 への変換を利用
partials フォルダ配下の以下のファイルを修正する
CDN で提供されている最新の MathJax.js の URL は、cdnjs.com で確認する
<script type="text/javascript"> MathJax = { tex: { inlineMath: [['$','$'], ['\\(','\\)']], processEscapes: true, tags: "ams", autoload: { color: [], colorV2: ['color'] }, packages: {'[+]': ['noerrors']} }, chtml: { matchFontHeight: false, displayAlign: "left", // version 2 で css で変更していた 数式の表示位置の設定 displayIndent: "2em" }, options: { skipHtmlTags: ['script', 'noscript', 'style', 'textarea', 'pre'], renderActions: { /* これを記述しないと インライン数式(例. ${}_n \mathrm{ P }_k$) が機能しない */ find_script_mathtex: [10, function (doc) { for (const node of document.querySelectorAll('script[type^="math/tex"]')) { const display = !!node.type.match(/; *mode=display/); const math = new doc.options.MathItem(node.textContent, doc.inputJax[0], display); const text = document.createTextNode(''); node.parentNode.replaceChild(text, node); math.start = {node: text, delim: '', n: 0}; math.end = {node: text, delim: '', n: 0}; doc.math.push(math); } }, ''] } }, loader: { load: ['[tex]/noerrors'] } }; </script> <script type="text/javascript" async src="https://cdn.jsdelivr.net/npm/mathjax@3/es5/tex-chtml.js" id="MathJax-script"></script> 1 で作成した partial を head or footer で読込