Skip to main content

Tip Badges in ghost

So I am a huge fan of ghost, and I love providing my content free of charge. That being said server hosting costs money.

I added a tips badge to the bottom of my blog posts (see below) to try to offset the costs.

How I did this was simple. I signed up for a gratipay account. Once signed in I went to the widgets section of my profile and found my badge.

I took the image tag and wrapped it around an a tag that will link to my profile.

<a href="https://gratipay.com/TommyParnell">
<img src="https://img.shields.io/gratipay/TommyParnell.svg">
</a>

I then went into my themes folder at content/themes/ghostium where I found a file called post.hbs

I scrolled to where I found the part that the author website url is injected. I then added in the badge from gratify

Before


   <p class="post-author-website">
   <a href="author.website" rel="nofollow">author.website</a>
   </p>

After

   <p class="post-author-website">
   <a href="author.website" rel="nofollow">author.website</a>
   </p>
 <p>
 <a href="https://gratipay.com/TommyParnell"><img src="https://img.shields.io/gratipay/TommyParnell.svg"></a>
</p>

Badge at the top of the page

if you want the badge at the top of the page you can add the code explained above before the post handelbars tag in the post.hbs file

Tagged In:
ghost gratipay