How to track onboarding completion status in Memberstack JSON and force redirect until finished? Answered

Post author
Jamie Debnam

Hey guys, I’ve done a multi step onboarding process with memberstack but the info we capture in that process is really important for how they use the app, is it possible for us to track something in a users json or metadata that if they haven’t completed the onboarding, they will be redirected to it if they load anywhere else on the site?

Comments

11 comments

  • Comment author
    Chukwudi

    Hi Jamie,

    Here's how you can go about that:

    First, you have to create a custom field on Memberstack called consent, then on your website, create a field called consent. It can be a hidden field or a checkbox that a user needs to check before submitting the form but ensure the value is set to true and it also has the data attribute data-ms-member="consent".

    Place the custom code below in the site settings before the </head> or </body> tag:

    <script>
    document.addEventListener("DOMContentLoaded", async function() {
    window.$memberstackDom.getCurrentMember().then((member) => {
      if (member.data) {
        console.log(member);
        var consent = member.data["customFields"]["consent"];
        if (consent != "true") { // Check for false without quotes
          window.location.href = '/onboarding'; // Change this to your onboarding page URL
        }
      }
    });
    });
    </script>

    This code will correctly check if the consent value is not "true" and redirect the user to the onboarding page.

    0
  • Comment author
    Jamie Debnam

    Hey Chukwudi that’s great appreciate it! Having a slight issue though, when they sign up and get redirected to the first step of onboarding, it seems to execute this code even though they’re on the page anyway so the page is constantly refreshing. Any ideas?

    0
  • Comment author
    Chukwudi

    Sorry about that, Jamie. Please remove the code from the Site-wide settings and place it on the page a user lands on after logging in, and any other pages on the website that aren't gated. If your pages are gated, you may not have to put the code on the gated pages if you have already set the 'Access denied' URL on the gated content settings to the login page.

    0
  • Comment author
    Duncan from Memberstack

    I’m working on a MemberScript + tutorial for this 👍 Should be ready soon. Thanks Chukwudi for creating that code!

    0
  • Comment author
    Duncan from Memberstack

    Done! #memberscript-updates

    0
  • Comment author
    Jamie Debnam

    Thanks Duncan from Memberstack!

    0
  • Comment author
    Jonny Campbell

    Hi, is there a way to redirect users to an onboarding flow after signing up but before they see the stripe checkout page when signing up on a paid plan? My mockup makes it clearer what I'm attempting to do:
    https://www.figma.com/file/4d0FxK0RtBrqU0SJgVAYVr/Memberstack-Flow?type=design&node-id=3%3A49&mode=design&t=s1gpOBKQ3UIOPp5n-1

    0
  • Comment author
    TAYLOR DAVIDSON

    From a conversion POV, you'd always want to reduce the friction to sign up and pay you. So better to have all the steps after checkout.

    0
  • Comment author
    Jonny Campbell

    I'd like to be able to test that.

    0
  • Comment author
    Raquel Lopez

    Hi,

    You can create a free plan that would act as a middleman between the member sign up and the paid subscription.

    As long as the user is in this "onboarding plan" he would have to fill all the onboarding wizard and should have limited access to anything. And, when the user completes it then you can upgrade the membership that would redirect it to the sign up plan.

    Idea credits to William de Broucker, 😁

    0
  • Comment author
    Jonny Campbell

    Thank you Raquel Lopez! 🙏

    0

Please sign in to leave a comment.