Displaying math in Jekyll/Chirpy

If you’re (like me) using the Chirpy theme for your Jekyll site, here’s how to quickly set up MathJax so that you can display beautiful math equations such as

\[e^{\pi i} + 1 = 0.\]

If you have a look at a site which is generated for you from one of the markdown files for your posts (in the _site/posts) folder, you’ll see an index.html file. The layout for this file is defined in _layouts/default.html file. The _layouts folder, among others can be found in the theme folder; to find its location, run bundle show jekyll-theme-chirpy.

Copy the _layouts folder to your site’s root directory, and include MathJax to your page by appending the line

<script id="MathJax-script" async src="https://cdn.jsdelivr.net/npm/mathjax@3/es5/tex-mml-chtml.js"></script>

to _layouts/default.html.

Now, you can write your math!

For example,

{% raw %}
    $$e^{\pi i} + 1 = 0.$$
{% endraw %}