This quick tutorial explains you how you can show off your live Ghost member (subscriber) totals in your Ghost theme.

Here is an example:

creativecompanion.club

There are two ways to do this.

Option 1: Cove

In April 2022, Cove added new "Audience Tools", which included member counters.

(This is what is powering the counter in the example above).

Sign up to Cove. In the sign up flow you will be prompted to set up a new account. Follow the instructions for creating a new Integration in Ghost and copying across the two API keys.

Now in Cove, head to the Tools section. You will see a page called "Member counters".

Click on "Add member counter" and select if you want to show the number of "All members" or "Paying members" on your site.

Adding a new Member counter in Cove

You can also choose how your counter will display on your site. If your member count is 589, this is how the numbers will display:

  • 589 (Plain number)
  • 580 (Rounded down to nearest 10)
  • 500 (Rounded down to nearest 100)

Then go to your theme files and paste in the code that Cove gives you. It will look a bit like this:

<span data-cove-member-counter="06aace0b270bcc639917950a1ac29b5c"></span>

Then also add the tools.js script to your default.hbs file, near the closing </body> script. The script tag can be found on the Member counters page in Cove.

Remember to re-ZIP and upload your theme into Ghost.

Option 2: Ghost template variable

In v5.4.0 (released July 2022), Ghost added a new native template variable which copies Cove's member counter feature.

You can add the {{total_members}} and {{total_paid_members}} tags into your theme to display your member counts.

Note that these numbers will auto-round and you unfortunately have no formatting control. From the Ghost docs:

“If you have 1225 members, it will output 1,200+.
For values above 100,000 it will output 100k+ and 3m+ respectively.”

Remember to re-ZIP and upload your theme into Ghost.

Thanks for reading!

Dan Rowden   Dan Rowden

I am the founder of Codelet. I have four years experience publishing and developing for Ghost, on over 100 sites. Codelet is an agency and blog about the basics and hidden features of Ghost.