How to create content for different users, in the Ghost editor

Here's an approach I've used for letting clients set up a page with content for different audiences. In this case, you can pick content for free, paid, and non-members separately.

2025-2-8: It looks like there're improvements to Ghost in process that will make this unnecessary! Hooray for blog posts with workarounds that quickly become unnecessary, I guess! But if you need it right now, here's how:

Edit the theme (a teeny bit)

I’d modify default.hbs. Up in the body tag, within class=" a bunch of stuff ", I’d add something like this:

{{#if @member}} member{{#if @member.paid}} paid {{else}} free{{/if}}{{else}} not-member{{/if}} 

Make sure that’s within the quotes defining the class for the body.

Add styles

You’ll also need some styles. Those can go into code injection (easiest) or in your theme’s css files (but remember that most themes need their css compiled, which you might not be set up for).

These styles hide the ‘wrong’ content. For example, if the body is marked with “paid”, that means this is a paying member, so they shouldn’t see (display: none) the free-member-content or unregistered-member-content.

In code injection (sitewide):

<style>
body.paid .free-member-content, 
body.paid .unregistered-content,
body.free .unregistered-content, 
body.free .paid-content,
body.unregistered .free-member-content, 
body.unregistered .paid-member-content {
   display: none;
}
</style>

Write the page

THEN, on your individual pages where you need to control who can see what, you’re going to set up some HTML cards, which you’ll probably want to make into snippets, for convenience. You’re going to have one like: <div class="paid-content">
another: <div class="free-member-content">
and another: <div class="unregistered-content">

And then finally, one that is just </div>. That one is used to close any of the ‘opening’ divs you used above.

[If you haven’t figured out snippets yet, now is the time, so that you can just pull these out of the + menu like they’re cards.]

Now for the fun part - let's set up a page with different content! In the editor, you use the “paid members” snippet before the content that is for paid members only, followed by the closing div snippet after that content. Similarly with the free and unregistered divs, always followed by the closing div.

So now, your content for different user types is in separate divs, and which div the user can see is going to depend on the type of user.

No theme editing?

It's possible to detect the member's status (at least between member and non-member) by using some javascript to detect what the login/account button in the theme says. This is going to depend on the specific theme, but many themes change the text of the button, and you can detect that. That javascript can run in the code injection footer.