[Product Post] Theme Tip: Granular Permissions, Discussions & Your Content

Posted by Adrian Speyer on Jan 29, 2016, 9:15:17 AM
Find me on:

4 minute read

choice of different content
In the past we've shared dozens of tips to help you supercharge your theme. One of the more popular items has been the use of "If" statements and variables. There are lots of creative ways we've seen this used, along with a current use case, where a customer of ours was looking to show different content depending on different member permissions.

Due to customer privacy, the below example was completed on my demo community. Nevertheless, it was such a great use case, I wanted to share how you could do it too.

Setting the permissions

The first step is to ensure you have the permissions you want for a specific role. Imagine if you will, that you run a customer support community. In your community, you want to create a role called "Platinum" for your best customers. Part of their permissions will be to access to a special category with topics only for them. Let's call that area the "Premium" category.

When you create this new category, select: "This category has custom permissions". It will open a grid which we will modify to give this role special permissions to this category.

Edit_Category_-_premium

Make sure you also note the ID of the Category in your address bar, you'll need this later.

number-category

In our Vanilla dashboard, you will also see the Role for Platinum users will now have these same permissions:

premium-permissions

What does this mean exactly, though? It means a community member with this role will have access to "Add" & "View" a discussion in all default categories, but also have these same permissions in the special "Premium Category".

Now it's time to decide what you want to show.

Deciding What Content

You can add any content you want, really. You can add it the content in a Pocket or add HTML directly into your theme. For our purposes, we will show you how to add content from a Pocket, but the concepts will be similar.

The reason we will use Pockets is that it's a much easier way to change things on the fly. Pockets are a Vanilla add-on that lets you add HTML or Javascript in designated areas in your website. You also have the option to use a custom location. (You can learn more about Pockets here.)

Here is an example of a Pocket we've created:

pockets-message-2

We will select a custom location (as you can see). You can also add CSS to customize theme to make it prettier. Make sure to copy the name of the Pocket. We'll need it in the next step because, if we made this Pocket live, everyone would see it!

Adding Code To Your Theme

Here comes the fun part. Open up customize theme and locate where you want the message to appear. For this example, let's add the message to just above the panel. This would be about here:

show-panel-code

Here is the code to add:

{if CheckPermission('Vanilla.Discussions.Add', 13)}
{pocket name="YouRock"}
{/if}

The following is how it will look:

code_panel

Let's break down the code:

  • We check the permission of the current user. If you use "!" (an exclamation point) in front of CheckPermission, it means the member who does not have such a permission would see the content.
  • You can check any permission you want like CheckPermission('Garden.Activity.View'). This would check if the role has the ability to view the activity stream on your community.
  • Next, why the number 13? We are checking the ability for a member to add a discussion to category 13 (the id associated to the Premium category). As another option, if you want content to show to those who can see, but not add content is to use the view permission, you could do: {if CheckPermission('Vanilla.Discussions.View', 13)}
  • Pocket Name is the name of the Pocket. You don't have to use Pockets, but it can make things easier if you swap out creatives/messages on a regular basis and you don't want to touch your theme.

Here's an extra bonus: If you had two Categories for which you wanted it to show content, here is what it would look like:

{if CheckPermission('Vanilla.Discussions.Add', 13) || CheckPermission('Vanilla.Discussions.Add', 14)}

Also, we noted before that you do not need to use Pockets. You can add whatever HTML/Javascript you want in-between the permission check . Make sure that for Javascript you use {literal}{/literal} tags.

{if CheckPermission('Vanilla.Discussions.Add', 13)}
ADD YOUR HTML, IMAGES OR MORE!
{literal}{/literal}
{/if}

End Result

What does it look like in the end? Check it out:

message-showing

(Please note we did add some custom CSS in the customize theme tab to make the message stand out).

Now it's your turn to make something cool and creative! If you're looking for more, check out this blog post on customizing your Vanilla theme even more.

Topics: Product, News

Related posts

Subscribe to the Community Corner Newsletter and get expert insight and analysis on how to get the most out of your online community every Friday.

Search this blog

Recent Posts

community playbook

Have an Article for Vanilla's Blog?

Send us an email to pr@vanillaforums.com with your topic idea and we'll circle back with our publishing guidelines.