Member Data Attributes in Webflow

Article author
Josh Lopez
  • Updated

This guide will help you understand how to use Memberstack's "Member Data Attributes" feature to personalize elements on your site with member-specific information. This information is securely stored on Memberstack and only accessible to the site admin and the respective member.

data-ms-member-name__1_.gif

Step 1 → Modify Your Database in Memberstack

new_custom_field.gif

  1. Start by going to your Memberstack app 'Members page'.
  2. Here, you need to select the "Custom Fields" button at the top right of the page.
  3. You'll then assign a name and a unique ID to the field. Make a note of this ID as you'll need it in the next step.

Step 2 → Connect Your Fields in Webflow

data-ms-member-name.gif

  1. Now, move to Webflow and select the element you wish to personalize.
  2. Click on the cog icon on the top right to display the element settings.
  3. Add a custom attribute with the name 'data-ms-member' and the value of your custom field id you noted down from Memberstack (like this: data-ms-member="fieldID").
  4. Once this is done, publish your site and open the page while you are logged in. Memberstack will replace the original text of the selected element with the personalized text stored in Memberstack.

Helpful Hint: If the custom field in Memberstack is empty, the element will return to its original state. So, it's a good idea to have meaningful placeholder text as a default.

Important Points to Keep in Mind

The data associated with a member is private to their account. The data attributes feature can't be used to display data publicly or to other members. This ensures the privacy and security of each member's data.

Was this article helpful?

Comments

0 comments

Please sign in to leave a comment.