Modifying page based on member status

Using Ghost
1

I would like to have a few specific pages or posts where the content is changed based on whether the member is:
Logged out
Free member
Paid member
Comp member (if I can separate from paid that’s great, because I could prompt upgrades)

I am not an engineer. With the help of GPT, I’ve been able to modify post.hbs to have custom images at the top of articles based on whether a member is logged out / free / paid. However, it would really help if I could have a page or two where the content changes. Just simple pages for giving instructions.

Why? I’m in the process of moving over a thousand paid members from another platform. That other platform sucks. We can’t see our members email addresses on it, so we can’t just create accounts for everyone. But members think they should be able to use an account from the other website. It’s a nightmare. Some of them are traumatized by the awful platform they are coming from.

Given short attention spans and different devices and browsers, it would be great to link a single URL that gives them directions. But to give them the right directions, I need to know their status.

I was able to modify the top of articles using post.hbs, but that applies to all articles. In this case I just want to modify specific pages. I would prefer to do it in the post editor because then it is easier to retrieve and edit my code. So far none of the suggestions from chatgpt have been able to do it. This isn’t for emails. It’s just for the post or page.

Thank you!

2

Yeah, ChatGPT isn’t a great Ghost engineer. :slight_smile: I think my job is safe for now.

Github-gazing says that functionality like this is coming, but it isn’t here yet. Here’s how I’d do it, if I wanted it today.

IMPORTANT: this is for cases where you want users to see the ‘right’ content, but the ‘wrong’ content is not secret and doesn’t need to be secured, just hidden.

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 tag for the body.

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>

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. :slight_smile: ]

OK, so then what you do on your page, is 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.

Hope that helps!

Hmm… I think I just accidentally wrote next week’s blog post.

3

I think I understand most of that, but in my default.hbs I don’t see any entry for class=" a bunch of stuff ". I’m using a lightly edited version of the dawn theme.

4

Look for the body tag. I’m betting you have one! :)