✨ Flair — a customizable, stylish theme for your blogExplore

How to Add Members Specific Section in Your Ghost Template

How to implement member specific code blocks in Ghost themes and specific use cases such as custom account page, membership page and other elements.

Norbert
Norbert4 min read

Starting with Ghost 4.0 memberships and newsletters are natively part of the platform, Ghost is not just a blogging platform anymore but with the features that have been added it's much more than that.

When we are talking about post content you can check out this guide for using the public preview and creating custom cta in Ghost CMS.

For some more advanced changes related to different templates you have and to really take advantage of these features you might need to adjust your Ghost theme and make some sections of your site free member or paid member specific. This can be done quite easily with the helpers provided by Ghost:

{{#if @member.paid}}

  {{! Content for paid members }}

{{else if @member}}

  {{! Content for free members }}

{{else}}

  {{! Content for regular users }}

{{/if}}

These are the conditions you can use in your Ghost template files to check whether the current user is a paid member, free member or a regular user. You can use this to customize your theme.

Next, let's see some use cases, besides the post content.

Custom account page

You can create custom account page if you don't want to use the Ghost Portal feature. When creating such a page, you can show different content to users depending on their status.

For a paid member you can build a profile using the member attributes provided by Ghost. Then the member subscription attributes can be used to show the subscription info of the user, such as the status of the subscription, until when the subscription is valid and much more.

You can even show a preview of posts depending on the access level of the current user.

For free members you can build a profile section using the member attributes similarly to paying users. Another section that can be great for free members is a way to upgrade and for this you can build a checkout section containing the different tiers available, monthly and yearly pricing with details and an easy way to subscribe.

Regular users should have no access to the account page, for them a redirect can be implemented:

<script>
  window.location = '{{@site.url}}/signin/';
</script>

Check out the account page in our Dashi theme.

Custom membership page

A membership page can be a great way to list the different tiers users can subscribe to and also give some detail about each plan.

Here is how the structure of such a page would look like:

{{#if @member.paid}}
  <script>window.location = '{{@site.url}}/account/';</script>
{{else}}
  {{#unless @member}}
    {{> pricing/free}}
  {{/unless}}

  {{> pricing/monthly}}
  {{> pricing/yearly}}
{{/if}}

Paid members would be redirected to the account page, as that one would give the information about their subscription.

The free plan would be shown only to regular users, if we are dealing with a free member then we only show the premium plans, the monthly and yearly pricing plans.

Check out the membership page in our Dashi theme.

Besides the specific pages like membership and account, you might want to show different content to members in the header like additional links, or even in the footer or sidebar sections you can use the conditions to optimize the content.

In the header section you can use the checks to either show "Login", "Subscribe" buttons for regular users, or simple "Upgrade" to free members, while for paid members you can show an "Account" link.

In the footer or sidebar section of a theme you can implement a subscribe form, which should not be displayed for paying members. That could be handled like this:

{{#if @member.paid}}
{{else if @member}}
  <h4>{{t "Premium Membership"}}</h4>
  <div>{{t "Unlock full access to see the entire library by subscribing to a paid plan."}}</div>
  <a href="/membership/">{{t "Upgrade"}}</a>
{{else}}
  <h4>{{@site.title}}</h4>
  <div>{{t "Get the latest insights directly to your inbox!"}}</div>
  {{> subscribe-form}}
{{/if}}

Paying members would not see this section, free members would get a cta to upgrade with a link to the membership page and regular users would see a form where they can subscribe and become members. These are just a couple of use cases, but there can be much more.

I hope you found this guide helpful.

More in Tips & Tricks

All tips

Ghost CMS Price Helper Overview & Tips

How to use the price helper in your Ghost theme. Overview of the available options and specific use cases with examples on what you can do with the helper.

Ghost Pro Hosting

Get the best managed Ghost CMS hosting and focus on bringing value to your audience.