Working with MathJax on Jekyll

07 Feb 2015 . tech . Comments #MathJax #Research

One of the many perks of running Jekyll is that it supports LaTeX-like math equation in a post/pages and in turn on a website.

I have the tool to now write equations like:

$$P(A|B) = \dfrac{P(B|A)P(A)}{P(B)}$$

####What is MathJax? The MathJax website describes itself as, “an open-source JavaScript display engine for LaTeX, MathML, and AsciiMath notation that works in all modern browsers.”

####Getting Started Getting MathJax to work is rather simple. The following script must be added to each page you want to use MathJax. As Jekyll has a neat structure, I put this script in _layout/post.html. Practically you can invoke this script in any page/post by including it the respective layout.

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

Additionally, I had to change the markdown flavour in _config.yml to markdown: kramdown as redcarpet didn’t support MathJax. Few other HTML converters that support MathJax are: Pandoc, MultiMarkdown.

###Working with MathJax Although there is a prerequisite knowledge of working with LaTeX, its is rather simple to pick up. The official documentation is available here, but you’ll probably find the quick reference more useful.

For inline equation, I use <span>$$\left(\frac12\right)$$</span> that will be displayed as $\left(\frac12\right)$ .

For display equation, I use $$min_{w,b} \frac{ww^T}2 s.t.: y_i(w^T x_i + b) \gt 1 (\forall x_i)$$ that shall be displayed as:

$$min_{w,b} \frac{ww^T}2 s.t.: y_i(w^T x_i + b) \gt 1 (\forall x_i)$$

I use the <div align="center"> to get the equation neatly centered.

For some reason, the other commands like \$...\$ for in-line math, and \\[...\\] for displayed equations don’t seem to work for me.

Tip: You can use \text{} inside equations to enter text like such that, and

####Drawback As I had to move to kramdown from redcarpet to get MathJax working, the beautiful blockquotes of redcarpet are not available in this flavour. But never the less, its a affordable trade-off.