I used MathJax to add support for showing LaTex style equations on my blog. Because I am using Jekyll with Github pages, I had to add this script to my site’s header include :

  <script type="text/javascript" async  	
    src="https://cdnjs.cloudflare.com/ajax/libs/mathjax/2.7.1/MathJax.js?config=TeX-MML-AM_CHTML">
  </script> 

However, long equations would often get cropped, especially when viewed on mobile browsers. To fix that, add this to your CSS file (as suggested here):

// Enable scrolling in long equations
.MathJax_Display, .MJXc-display, .MathJax_SVG_Display {
    overflow-x: auto;
    overflow-y: hidden;
}

This allows long equations like the following to become scrollable, especially when viewed on a mobile browser.

\[\Psi_{velocity}(10 AM, 11 AM) = E\{velocity_{10 AM} \times velocity_{11 AM}\}\]