/casper-dev-blog-theme

👻 Customized ghost casper theme for developer's blog

Primary LanguageCSSOtherNOASSERTION

Customized ghost casper theme for developer's blog

Inspired from Hungys's CasperS

This repo is customized casper theme for my ghost dev blog. Currently, it lives on sujinlee.me.

  • Casper 3
  • Works with Ghost 3+
  • Google Analytics integration
  • Disqus integration (comments, comment count)
  • Prism-powered syntax highlight
  • KaTex
  • Social links with Simple Icons integration (TBD)
  • LightMode / DarkMode

How to install theme in your live ghost

  • Download this repo as zip file.
  • Go to your desgin panel in ghost admin page (https:///ghost/#/settings/design)
  • Click Upload a theme button and upload zip file.
  • Activate new theme.
  • Go to code injection panel. (https:///ghost/#/settings/code-injection)
  • Update google analytics variable in Site Header code block.
<script>
  var ga_id = "your_google_id"
</script>
  • Update social links and google analytics variables in Site Footer code block.
    • Social icons : facebook, flickr, github, gmail, googleplus', instagram, line, linkedin, messenger, microsoftoutlook, plurk, sinaweibo, skype, snapchat, stackoverflow, telegram, twitter, wechat, whatsapp
<script>
  var social_link = {
    linkedin: "https://www.linkedin.com/in/username",
    github: "https://github.com/username",
    medium: "https://medium.com/@userid"
  }
</script>
  • Update your disqus shortname in Site Footer.
<script>
  var disqus_shortname = "sujinlee"
</script>

Disqus configuration

Katex usage

  • Use a pair of single($)/double($$) dollar sign as formula delimiter.

katex

How to customize casper theme

  • Install ghost locally as following official setup guide doc.
  • Clone or download repo and put them in content/themes/ folder under your Ghost installation.
$ cd /[your-ghost-root-directory]
$ git clone https://github.com/sujinleeme/casper-dev-blog-theme.git content/themes/[theme-name]
  • Run ghost start.
  • Go to theme folder and install packages.
$ cd content/themes/[theme-name]
$ yarn install