How to set up event access permissions in Webflow CMS using Memberstack's different access levels? Answered
Hi there, I wonder if someone can assist me here (quite urgent)
I have setup a memberstack account, with 3 access levels. I have set up a CMS collection of upcoming events in Webflow, i want to set certain events in the CMS to only be visible by certain access groups that I set per event?
Any help would be appreciated please 🙏
Comments
10 comments
You could load up some custom javascript in the page head that checks their plan before the rest of the page loads. You should be able to set a CMS variable in that code embed so it only let’s people see if it their plan matches. If it doesn’t, it could redirect them back to the events page.
Alternatively, you could build a few different sections that hide or populate different sections in, based on the plan that is set (so one that encourages people to upgrade, another that shows them the event details, and another with a registration button). That’s something you can do without custom javascript and a few attributes.
Thanks for the reply Jordan,
As per some ChatGPT help it gave me some javascript (I think as you mentioned above) to paste into webflow and add an attribute data-access to the collection item. But when testing (in staging currently) it doesnt seem to work, if i open the console it shows { "data": null } or no members found.. I have added the 3 members to the CMS settings and on each cms item with the plan that should be able to see it. And the plans match the 3 plans I setup in memberstack, is it becuase its on staging or perhaps a setting in my memberstack ?
Or should i be using the 'Copy plan ID in memberstack instead of the plan name?
Hey Thomas Dupreez, being a staging site is likely not the issue. And whether to use plan ID or plan name will depend on the code / settings you have enabled.
Could you share a read-only link of the site where you are trying to implement this so that we can further troubleshoot what is the issue?
Thanks for your response A J
Here is the link - https://preview.webflow.com/preview/helm-website?utm_medium=preview_link&utm_source=da[…]e&preview=8ddec5da1477f8a8b1fc8e617f83955b&workflow=preview
I initially attempted the Memberstack way using what the AI bot reccommened with the "Set Up Memberstack Data Attributes" and "Conditional visibilty", but this didnt seem to work, - I probably did something wrong, but my latest attempt I used some javascript code pasted in the wbeflow page that is suppose to pick up the user status and show/hide content accordingly, but this isnt working either unfortunately
This is quite pressing so if you are able to help that would be amazing A J or Jordan Ryskamp
I can see the custom code is incorrect, since it attempts to get member JSON data as opposed to current member data which has the plan info.
That being said, if you want to show content based on the plan the user is in, you can use these attributes as per your use-case. You can set the value of these attributes in each cms item in Eventbrite events collection and map it on the page under custom attribute.
But in case, you want to compare the access level you specify in the CMS item, you can make use of get current member function and try to fetch the plan name and compare it likewise.
Thank you A J, will be trying this soon! Just to confirm do I have to do one or the other or impliment both? I purely just want when a member of a certain plan logs in, the cms collection of events is filtered to only show what that memebrs plan is set for them to see (certain events might allow for a combination of the plans to view them). This will be set by a text field called "Access Level" I added in the cms collection, so the person adding an event will simply put - "Plan A, Plan B" - in the Access Level text field which means when these 2 plans log in they can see the event but if a Plan C member logs in the event will be hidden. Thanks for all your help so far 🙏
You can either use custom code or use gated content + attributes to implement it, no need to do both.
But in case the plans have exclusive content, i.e. plan a users can't see events listed for plan b and c and so on, and an event might be visible for a combination of plans, you likely have to take the custom code option alone since that will give you the flexibility you need. Make sure to use the right function listed above, customize it for your use-case and compare the access level text with the plan name and also ensure the access level name matches the plan name that you have setup in memberstack dashboard and it should work.
Okay thank you
To achieve this setup with Memberstack and Webflow, you'll need to use Memberstack’s custom attributes for restricting content based on access levels. First, ensure you've connected Memberstack to your Webflow project and set up the appropriate access levels (e.g., free, paid, admin). In your Webflow CMS collection for events, add a custom field (like "Access Level") to specify which access group can view each event. Then, use Memberstack’s API or conditional visibility feature in Webflow to hide/show content based on the user’s access level. You can use Memberstack’s
ms-membershipattribute to target specific content visibility for different users or access levels, ensuring that only those with the right membership can see the events they’re eligible for.In order to do this, you can implement Memberstack's Visibility Rules with your Webflow CMS. First, you'll have to connect your Memberstack account to Webflow and also set your access levels in Memberstack. Then, you can use conditional visibility settings in Webflow for every event in your CMS collection. For every event, you create a custom field (call it Access Level) which defines which access level can see the event (i.e. a paid member could have individual access). Then, in Webflow's Designer, you can apply visibility rules on the CMS list or individual elements according to the user's access level which can reference Memberstack's dynamic data. That way, only users with the correct access level will be able to see the events they can see.
Please sign in to leave a comment.