Jekyll2021-03-12T13:55:16-06:00https://kevinfossez.github.io/feed.xmlPersonal pageNuclei as open quantum systemsKevin FossezLaTeX on Github Pages+minimal mistakes+MathJax2020-04-26T00:00:00-05:002020-04-26T00:00:00-05:00https://kevinfossez.github.io/posts/2020/04/post-1<p>To have \(\LaTeX\) equations on this website, which is run on Github Pages using Jekyll and AcademicPages (a fork of Minimal Mistakes), I had to make a few guesses, so here are the secrets.</p>
<h2 id="setting-up-mathjax">Setting up MathJax</h2>
<p>First, the LaTeX code is interpreted using MathJax, which is loaded and configured in the file:</p>
<div class="language-plaintext highlighter-rouge"><div class="highlight"><pre class="highlight"><code>_includes/head/custom.html
</code></pre></div></div>
<p>I modified the default configuration of MathJax to use ‘$$’ instead of ‘$’ to delimitate LaTeX code (but there is a catch) or adding some commands (macros) for quantum mechanics.</p>
<p>On the original repository, the version 2.7.4 is loaded by default, I changed it to the 2.7.7 just to have something more recent. I tried the version 3.0.5 and all the equations disappeared, so I did not insist. The modified part of the file looks like this:</p>
<div class="language-plaintext highlighter-rouge"><div class="highlight"><pre class="highlight"><code><script type="text/x-mathjax-config">
MathJax.Hub.Config({
tex2jax: {
inlineMath: [ ['$$','$$'], ["\\(","\\)"] ],
displayMath: [ ['$$','$$'], ["\\(","\\)"] ],
},
TeX: {
Macros: {
bra: ["\\langle{#1}|", 1],
ket: ["|{#1}\\rangle", 1],
braket: ["\\langle{#1}\\rangle", 1],
bk: ["\\langle{#1}|{#2}|{#3}\\rangle", 3]
}
}
});
</script>
<script src='https://cdnjs.cloudflare.com/ajax/libs/mathjax/2.7.7/latest.js?config=TeX-MML-AM_CHTML' async></script>
</code></pre></div></div>
<p>The file mentioned is already included in the header of the default layout for pages which can be found at:</p>
<div class="language-plaintext highlighter-rouge"><div class="highlight"><pre class="highlight"><code>_layouts/default.html
</code></pre></div></div>
<p>Any page based on this layout or another layout based on it will benefit from MathJax automatically.
At that point the only tricky part is to write equations that will be properly interpreted.</p>
<h2 id="writing-interpretable-latex">Writing interpretable \(\LaTeX\)</h2>
<p>It took me hours to figure out how to have aligned equations and matrices with the system powering this website, so here is what I believe I understood:</p>
<ul>
<li>You need to tell Markdown (the language of the .md files) when LaTeX code starts and ends.</li>
<li>Markdown accepts both LaTeX code surrounded by <code class="language-plaintext highlighter-rouge">\$\$</code> or directly between <code class="language-plaintext highlighter-rouge">\\begin{...}</code> and <code class="language-plaintext highlighter-rouge">\\end{...}</code> statements.</li>
<li>Something I do not understand will wrap any LaTeX code surrounded by ‘$$’ that contains an ampersand (‘\&’) with a ‘CODATA’ which will comment out the code by accident.</li>
<li>LaTeX code directly between ‘begin’ and ‘end’ statements (no dollar sings) can contain ampersands if it is formatted as follows:</li>
</ul>
<div class="language-plaintext highlighter-rouge"><div class="highlight"><pre class="highlight"><code>\begin{equation}
\begin{aligned}
...
\end{aligned}
\end{equation}
</code></pre></div></div>
<p>The trick is the use of the ‘aligned’ environment from AMS. Why it is like that? I have no idea.</p>
<p>There are some additional rules that I had to guess. For example, between dollar signs underscores are interpreted directly as LaTeX code, but without the dollar signs Markdown seems to mess with them in some cases as shown below:</p>
<div class="language-plaintext highlighter-rouge"><div class="highlight"><pre class="highlight"><code>$$ {X}_{0} $$ (works)
$$ X_0 $$ (works)
\begin{equation}
\begin{aligned}
{X}_{0} (does not always work)
{X}\_{0} (works)
X_0 (works)
\hat{a}_{b} (does not always work)
\hat{a}_b (works)
\hat{a}_{b+c} (works)
\end{aligned}
\end{equation}
</code></pre></div></div>
<p>A challenging part was to guess how to deal with spaces, linebreaks, and ampersands. In the example below, because there are no dollar signs for the reason explained above, the usual two backslashes must be quadrupled. From what I understood, there are escape backslashes for Markdown and other things and so many of them will disappear before the LaTeX code is interpreted by MathJax.</p>
<div class="language-plaintext highlighter-rouge"><div class="highlight"><pre class="highlight"><code>\begin{equation}
\begin{aligned}
{\sigma}_{1} =
\begin{pmatrix}
0 & 1 \\\\\\\\
1 & 0
\end{pmatrix}
\end{aligned}
\end{equation}
</code></pre></div></div>
<p>Finally, the last trick is for having, for example, a sum of matrices. No blank space is allowed at the end of each line, like in:</p>
<div class="language-plaintext highlighter-rouge"><div class="highlight"><pre class="highlight"><code>\begin{equation}
\begin{aligned}
X_0 \otimes X_1 =
\begin{pmatrix}
0\begin{pmatrix}
0 & 1 \\\\\\\\
1 & 0
\end{pmatrix} & 1\begin{pmatrix}
0 & 1 \\\\\\\\
1 & 0
\end{pmatrix} \\\\\\\\
1\begin{pmatrix}
0 & 1 \\\\\\\\
1 & 0
\end{pmatrix} & 0\begin{pmatrix}
0 & 1 \\\\\\\\
1 & 0
\end{pmatrix}
\end{pmatrix} =
\begin{pmatrix}
0 & 0 & 0 & 1 \\\\\\\\
0 & 0 & 1 & 0 \\\\\\\\
0 & 1 & 0 & 0 \\\\\\\\
1 & 0 & 0 & 0
\end{pmatrix}
\end{aligned}
\end{equation}
</code></pre></div></div>
<p>I hope this will help a few people.</p>Kevin FossezTo have \(\LaTeX\) equations on this website, which is run on Github Pages using Jekyll and AcademicPages (a fork of Minimal Mistakes), I had to make a few guesses, so here are the secrets.