原本以為 BookStack 上需要改 editor 和 markdown render 才能放 LaTex,沒想到在 customization 那邊加入 JavaScript llibrary 即可。
目前使用的是 KaTex:
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/katex@0.18.7/dist/katex.min.css" integrity="sha384-JctiRyLzXCrSoOOzFlSoWLdyzQl7OrrRnhyeBmzB6ZWtcjccUyc8lCQJqIbs3uQX" crossorigin="anonymous">
<script defer src="https://cdn.jsdelivr.net/npm/katex@0.18.7/dist/katex.min.js" integrity="sha384-+7Keh381hSkXmXqnjC0JBM/kzsN6TFj+wMKychSLjTvJ8/0ElMde2uKl8i6p6Buj" crossorigin="anonymous"></script>
<script defer src="https://cdn.jsdelivr.net/npm/katex@0.18.7/dist/contrib/auto-render.min.js" integrity="sha384-bjyGPfbij8/NDKJhSGZNP/khQVgtHUE5exjm4Ydllo42FwIgYsdLO2lXGmRBf5Mz" crossorigin="anonymous"
onload="renderMathInElement(document.body);"></script>
<script>
window.addEventListener('load', function() {
renderMathInElement(document.querySelector('.page-content'), {
delimiters: [
{left: '$$', right: '$$', display: true},
{left: '$', right: '$', display: false}
]
});
});
</script>
script 分為二段,第一段式載入 library,第二段是將網頁中由 $ 以及 $$ 開頭的段落找出來,並轉 LaTex。另外 display 設定為 true 時,LaTex 顯示時會置中對齊。
效果如下:
math KaTex
$
|1\rangle \otimes |1\rangle \xrightarrow{\text{QFT Adder}} |10\rangle = |2\rangle
$

