bradleytaunt/ET-Jekyll

Syntax highlighting and MathJax support

Closed this issue · 3 comments

laventura commented

This theme looks lovely. 👍Very simple and useful and compact.

Two quick Qs. How do you get/add support for

  1. Syntax highlighting
  2. MathJax for math equations, etc?

Thanks!

bradleytaunt commented

Thank you for the kind words!

You bring up a great point and have inspired me to update the theme itself. You can see the full changes here: 305a9f8

In a nutshell:

  • Added support for MathJax in blog posts
  • Included support for lazyload images in blog posts

As for your request for syntax highlighting - this theme is meant to stay inline with the design principles of Edward Tufte, so default syntax uses the same styling and coloring as all other blog post content.

A few options you can look into in order to add your own custom syntax highlighting:

  1. http://rouge.jneen.net/
  2. https://highlightjs.org/
  3. http://prismjs.com/

I'm marking this ticket as closed since I have updated the theme accordingly. 😄

laventura commented

Thanks. Looks good.

For syntax highlighting, how would I use, say highlight.js or prism.js, to highlight the code?
Where would I add these JS files?
(Sorry, I haven't tried these.. so am not sure)

bradleytaunt commented

As with any 3rd party script, your best bet is to place it in either the head or just before the end of the body element if you prefer performance.

So place whichever script you decide to use in one of these:

  1. https://github.com/bradleytaunt/ET-Jekyll/blob/master/_includes/head-post.html
  2. https://github.com/bradleytaunt/ET-Jekyll/blob/master/_includes/footer.html

Any further customization you would have to look at the documentation for those specific plugins.