Advanced Usage
Subscription plans with Memberstack

Subscription Plans

In this tutorial, you will learn how to integrate Memberstack, a third-party service for user memberships and payments, with your no-code website builder. We will also guide you on how to add a data attribute called "data-ms-content" to a script code with the ID "interaxai-widget-config." This attribute will enable you to customize the behavior of your InteraxAI widget based on the membership status of your users.

Requirements

Please follow the steps below:

Step 1: Sign up for a Memberstack Account

To get started, you need to have a Memberstack account. If you don't have one, go to the Memberstack (opens in a new tab) website and sign up for an account. Once you have successfully created an account, proceed to the next step.

Step 2: Adding Memberstack to Your Website

To add Memberstack to your website, you need to copy the code snippet provided by Memberstack and paste it into the <head> section of your website. You can find the code snippet by going to the Settings page of your Memberstack account and clicking the Install Code tab.

Step 3: Obtain an InteraxAI Widget

To integrate Memberstack with your website, you will need an InteraxAI widget. If you already have one, great! If not, create a new InteraxAI widget according to your preferences.

Step 4: Add a Modal Element to Your Widget

To add a modal element to your widget, go to your widget's configuration page and click the Style tab. Then, click the Insert button and select Modal from the dropdown menu.

Once you have added a modal element to your widget, you can now set a generation limit for your widget and the time period for the limit. Please note that you must also add a whitelistId to your widget. This is a unique ID that will verify the membership status of your users.

Step 5: Adding the widget to your website

To add the widget to your website, you need to copy the code snippet provided by InteraxAI and paste it into your website. You can find the code snippet by going to the Embed tab of your widget's configuration page.

Here's an example of what the updated InteraxAI config script code should look like:

<script id="interaxai-widget-config" data-ms-content="<your whitelistId>">
  window.INTERAX_AI = {
    widgetID: "<your widget id>",
    ownerID: "<your owner id>",
  };
</script>

In the above example, the value of "data-ms-content" is must be set to one of your whitelistIds from your widget's modal element. This means that users with a paid membership will bypass the modal and have unlimited access to your widget. On the other hand, users without a paid membership will be prompted the modal and will be limited to the number of generations you have set.

Prompt examples & suggestions