Insert math equation as image inline with text in md.file github page

My GitHub Jekyll blog(https://github.com/psireal9/lanyon) uses Lanyon theme. I wrote a post with Jupyter Notebook which includes math equations. I downloaded the post as .md file. For the file in (\Science\Crystal_Vibrations.md line 22), since the image is inside the environment <em></em> and <font size="3px"></font>, I cant use the usual image insertion method (![formula](url)) so I use this method with <img src="url">. Locally, the image is rendered inline enter image description here

But on the webpage it creates a new lineenter image description here

I’m very frustated atm since I have no HTML knowledge and whatever I tried, I cannot have it inline with the image. I would really appreciate any help

P/s: I found this website (http://haixing-hu.github.io/programming/2013/09/20/how-to-use-mathjax-in-jekyll-generated-github-pages/) which instructs how to automatize Latex math equation in HTML file. I’m really interested to see how this can be done in md.file (specifically how can this be done for Lanyon Theme) since i wrote other posts in this format too and i love consistency.

Hi @psireal9!

It does look like you were ultimately able to use Mathjax inline to display equations. Although the website you mention advises to use the maruku Markdown processor instead of kramdown, kramdown does come with built-in Mathjax support:

https://docs.github.com/en/github/working-with-github-pages/about-github-pages-and-jekyll#configuring-jekyll-in-your-github-pages-site

Any advice for other people trying to integrate equations into GitHub Pages? What ended up working for you?