My Ghost Configuration

I started with a minimalist setup, using the default Casper theme with a few necessary additions. If you like any of them, here's the resources I used.

Initially, I made all my alterations in the Ghost header through code injection. Eventually, that got too bulky, so I started working on my own theme, which has a corresponding git repository. Eventually, I will link to that here. In the meantime, here's my features, with some of their code.

The stuff that has code here.

<!-- CDNs -->
<script src="https://google-code-prettify.googlecode.com/svn/loader/run_prettify.js"></script>
<script src="http://cdn.mathjax.org/mathjax/latest/MathJax.js?config=TeX-AMS-MML_HTMLorMML"></script>
<script src="http://code.jquery.com/jquery-1.11.3.min.js"></script>

<!-- handle external links -->
<script type="application/javascript">
$(document).ready(function() {
  $('a').each(function() {
     var a = new RegExp('/' + window.location.host + '/');
     if (!a.test(this.href)) {
         /* open in a new window */
         $(this).attr("target","_blank");
         /* add unicode arrow */
         $(this).append("↗");
     }
  });
});
</script>

• prettify CDN for pretty code syntax highlighting, usable with markdown syntax
• mathjax CDN for pretty LaTeX-style math ^[1]
• jQuery CDN for the features below
• handling spoiler text and toggle
• handling external links:
• to open in a new window: when the document is ready, insert this css-tricks code
• to add unicode arrow (↗): insert $(this).append("↗"); inside the conditional statement of the css-tricks code.

The stuff that will have code linked later.

• the table of contents
• to automatically generate: I followed this post
• to get centering right: this guide
• to follow scrolling text: I followed this Q&A and added some CSS and jQuery code of my own
• to add a show/hide button: I added some code inspired by this demo.
• to make sideways/rotated text: (CSS-only) I started with this solution, and then finagled the surrounding divs to match.
• the blue links for expanding hidden text are implemented through jQuery extensions to the markdown syntax, which can be found in assets/js/markdown.extended.js in my theme repository once I link it into here.

Footnotes