Casper Lite: My first Ghost theme

Ever since I started using Ghost I've struggled to find a theme that really fit the feel I wanted for my site. I love the default theme Casper but dislike the fonts used and the fact that it uses a custom font for icons. I'm already using Font Awesome for social icons on the home page (double icons anyone?) so they were easy to replace the custom ones Casper uses, all I nned to do was replace the Google Font loaded fonts with system ones.

As such, Casper Lite is born!

Using system fonts has a tone of benefits. They speed up rendering, decrease the overall size of your page and give a familiar feel for visitors, just to name a few. After looking around at the WordPress' implementation and the font stack Medium uses (also documented on Smashing Magazine), I chose the Medium set. Overall I think it works amazingly. Rendering is faster (no more snapping/shifting around as fonts load!) and the page is smaller!

Next was to get rid of the custom font used for icons on the website. Luckily Font Awesome can just be dropped in 1-1 for all of these across the theme. with a few CSS tweaks here and there.

Overall Casper Lite has a few main features:

  • Uses system fonts for faster rendering
  • Replace all custom icons with Font Awesome icons (No more double fonts!)
  • Additional social sharing buttons and social links for authors and website

My next big task is to replace the sidebar menu with something a littler simpler (a top menubar maybe?) and some extra home links on things like pages. Take a look at the roadmap on GitHub.

*Check it out on [GitHub](https://github.com/jloh/casper-lite "GitHub - jloh/casper-lite: A minimalist fork of the original Casper theme by Ghost") and don't forget to ⭐️ it!*

James Loh

I'm a Sysadmin for a web solutions company deploying clouds across the globe. I learn new things every day.

Byte by Byte

A weekly newsletter with 5 articles on tech from the past week. No spam, I promise!


or checkout our previous issues on our website!