Menu

Subscribe

Amending ghost themes

on Ghost, Tech

I have tailored two themes so far:

Ghostscroll

To change the default button text, use the following example: \n\n

  • Open the index.hbs file:

    ~/ghost/content/themes/GhostScroll-master/index.hbs

  • Change the text in the following lines: 

    <a class='btn first'>read full CV</a>
<a class='btn last'>skills in brief</a>

To change the default background colour for every 2nd post, use the following steps:

  • Open this index.js file: 

    ~/ghost/content/themes/GhostScroll-master/assets/js

  • Change the HTML font colour specified by the 'background' property in this code block: 

    $postholder.each(function (e) {
if(e % 2 != 0)
$(this).css({               
'background': <b>'#52686A',</b>
'color'     : 
'white',})        
})

If ghost is already running with forever you will need to restart it. Issue these commands in the ~/ghost/index.js folder.

forever stop index.js

Note If you have multiple ghost blogs running on the same server the following command will stop all of them, and you need to restart each separately.

  • NODE_ENV=production forever start index.js - starts ghost forever in production mode
  • service ghost restart && service nginx restart
Gridy

To change the social media accounts displayed, use the following example:

  • Open the theme-options.hbs file in the

    ghost/content/themes/gridy/partials\n

    • Add a social media account in the socialAccounts block:

      socialAccounts: { 
{{! Social Accounts Settings }}
tenabled : true,
colorful : true,
accounts : {
'rss' : '{{@blog.url}}/rss/',
'button' : 'http://your.new.link'

    • Note: 'button' in the above block grabs an icon from the fontawesome icon set.

Tips
Font awesome

I find this font great for putting in buttons. Play around with it.

Finding the problem

When searching for the right piece of code, sometimes it can be like trying to find a needle in a hay stack. Don't forget your friend, the command line i.e.

cat *.hbs | grep -ie code_phrase
Comments