Getting member's URL slug in a Webflow link

Hi,

In the header of my website, I want to add a “My profile” link where the current logged in user is redirected to his profile.
I have a custom field on Memberstack which is the webflow slug (url)

In webflow, I know how to get this slug in a html text : “data-ms-member=slug-webflow” will show mysite.webflow.io/user/slug for example

but I want to put this text in a <a href=""> so the link can be dynamic

I checked the front end API https://help.memberstack.com/en/articles/3850012-front-end-api so I managed to do that. But I’m stuck here
Capture d’écran 2020-08-18 à 16.06.33

Does somebody now how to convert member[“slug-webflow”] into a variable that can be the value in the href link?

Hey Roxane :wave:

Try doing something like this instead. :grinning:

<script>
 MemberStack.onReady.then(function(member) {
  let slug = member["slug-webflow"];
  let elem = document.getElementById("profileButton");
  if (elem) {
   elem.href = slug;
  }
})
</script>

<a id="profileButton" href="">View my profile</a>

You would switch out the top code with the code you have and then add an id to the link.

1 Like

@Josh-Lopez could you also just do this instead?

<a id="profileButton" data-ms-member="slug-webflow" href="#">View my profile</a>

I’m assuming that MS is parsing links with their data attribute in them and injecting the herf for us?

1 Like

Thank you both for your answers!

@ChrisDrit I tried it first but it doesn’t work: the text link shows the slug but the link is “#”

@Josh-Lopez it does work :partying_face: I adapted a little the code (I needed to concatenate two strings) and I put the script code in the page settings before the </body>. One thing to remember is to put the script code after the a href because it doesn’t work if it’s before.

2 Likes