I've seen in the API docs that it's possible to get a user's status (active, trial etc.) from the front end API.

Has anyone used this to hide/show various Webflow elements based on whether a user is active/trialling?ย 

I guess it's a case of something like the below?ย 

MemberStack.onReady.then(function(member) {   
    var membership = member.membership   
    if( membership.status = "trialing") {
        element.style.display = "none";
} else {
          element.style.display = "block";
		}
        
})

Any tips on implementation much appreciated!
Hey Alastair Budge

This is a really interesting idea. I don't currently have any trial memberships for my site so I don't have a working suggestion. However, I have considered using two different memberships to achieve this... basically a free plan that gives them limited access and allows me to hide content. But then have buttons to "upgrade" that when clicked would allow them to actually pay for the membership and switch them into the new plan that would unlock the hidden content.

But if we could do all that with one plan that locks down content for those in the trial phase and then automatically unlocks once they've paid and become active... that would be really cool.

Taggingย ChrisDrit because I got a feeling that he could probably figure this out! ๐Ÿ™‹โ€โ™‚๏ธ
Thanksย ๏ปฟJohn E. Matias๏ปฟ .

I thought about this at the start, but it's not 100% right for my use case. It achieves a similar idea, but I'd rather just have everything in the one membership.

๏ปฟChrisDrit๏ปฟย has shown it's possible!
Thanks for the shout outย John E. Matias !

Alastair Budge yes, this sounds totally doable to me. I think the pseudocode you've added looks spot on.

My approach in the past is usually sending a newly registered or logged in member to an interstitial page. A "welcome" style page with a loading spinner and a brief message.

I then do some checking against the user and route them to another page once that check is done.

For you it could be a page for member in a trial versus active.

Here is some example code for something similar but not exactly the same:

https://community.memberstack.com/c/community-support/how-do-i-redirect-logged-in-members-with-different-redirect-paths-for-different-membership-plans#comment_393950

<script>
  MemberStack.onReady.then(function(member) {   
    switch (member.membership.name) {
      case 'Basic':
        window.location.assign('/members/basic');
        break;
      case 'Pro':
        window.location.assign('/members/pro');
        break;
       default:
        window.location.assign('/members/dashboard');
    }
  });
</script>

Does this help?
Great, thanks Chris. Yes, that's a similar idea. For my use case, I want to show/hide elements in the page based on member type. I think I can achieve this in a similar way to how you have done, except apart form redirecting members I just show/hide elements. Thanks for your help!

Post a comment

Log in