b_ r t k n_ r

thoughts & experiences.

Enabling MathJax on a Jekyll server when offline

I like MathJax. It does a great job displaying equations on web pages written using . However, I recently wrote a Jekyll blog post which uses MathJax and tried to view it on a locally deployed server while commuting on a train journey with no Internet connection. Then, I realised that it did not render the equations at all because it relied on sending AJAX requests to a remote server. Something had to be done and this is how I went about fixing it.

First of all, I cloned MathJax from its Github repository and placed it on a separate folder called PathToMathJax/ outside the scope of this Jekyll site.

In _config.yml, I added a new variable called mathjax_url which contains the URL that Jekyll will use on the production site as below:

mathjax_url: http://cdn.mathjax.org/mathjax/latest/MathJax.js?config=TeX-AMS-MML_HTMLorMML

Then, in order to override the production setting on the development server, I created a separate file called _config-dev.yml on the same folder containing the following:

mathjax_url: http://localhost:4000/MathJax.js

In _layouts/header.html, include the following line:

<script type="text/javascript" src="http://cdn.mathjax.org/mathjax/latest/MathJax.js?config=TeX-AMS-MML_HTMLorMML"></script>

In order to automate deployment on the local server, I created a bash script called serve.sh with the following:

pushd PathToMathJax/; python -m SimpleHTTPServer & popd
jekyll serve --config _config.yml,_config-dev.yml

As you can see, Jekyll uses the settings contained in _config.yml then overrides the settings with the content of _config-dev.yml. Now, simply execute serve.sh to watch everything work together like a clockwork. Hurrah!