Pull in slug with custom code - link attribute

Users have a slug generated from being a cms item. So wanted to see if there was a html embed on a button I could add that would pull in the slug for it to link to www.makerpad.co/user/cms-item for example.

Any ideas?

Hi Ben!

Yes, this is possible! Where are you saving the slug for the user? In a hidden profile field?

I don’t actually have it saved anywhere I don’t think? It’s in my CMS and Airtable database.

@bentossell I’d have to understand your use case a bit more. Are you trying to show the logged in user a perpetual link to their CMS collection page? Are you doing this because you want the CMS detail page to be the profile update page (i.e. your new profile pages for makerpad?) or so they can update their profile on their detail page and redirect all other traffic away from it?

I’ve done a ton a work around this, so the devil is in the details.

I want users to click a button which takes them to their user profile (on makerpad) e.g. Click ‘My Profile’ button -> makerpad.co/user/ben-tossell

To do so, you’d have to save it as part of the Memberstack profile or metadata. From there, you can pretty easily target URLs that need that slug. If you don’t have it saved now in the MS profile, since you already have a strong user-base, you’d need to have a way of syncing that data when the login. If you need some help with this, let me know.

Ahhh alrighty, I’ll have to do that then! thanks Jason

1 Like

Hi Tyler,

I’m really keen on doing this as I want free members to be able to log in and click ‘my profile’ which takes them to a specific CMS item in webflow.
I can add the slug of the cms item into memberstack member data.
I’m just not sure how to have a button link be dynamically adjusted by ms data.
Do I need to have the button in a HTML embed - if so, what do I need to put into the HTML embed to make it work?

Hey Samantha :wave:

This depends on how you have it setup. Do you have your URLs using the member ID at the end? If you are willing, could you post your website URL so we can take a look and help guide you? :grinning:

I would like to have the steps go something like this:

  • Member creates an account
  • Zapier creates CMS item dashboard with member ID
  • Zapier updates a hidden profile field with member ID or link to Member ID CMS ITEM
  • When member logs in they can click ‘Dashboard’ which (either links dynamically or has a ms-data attribute) takes them to their CMS Item Dashboard.

I would use the current unique member page feature that memberstack offers but I’m currently using this feature for Paid member dashboards and I want to design completely different dashboards for free members.
This is my version of a workaround for unique dashboards.

All that’s holding me back is creating a button which can be affected by data in the memberstack profile.
e.g. button that links to www.website.com/dashboard-free/MS-DATA

Where MS-DATA is their unique member ID or something similar

Private messaging you now to get more info :smiley:

@Josh-Lopez @samanthaskyrocket

I have the exact same question, what was the answer to this?

I’m wanting to add a “see my public profile” button on a user dashboard, and the url needs to be pulled from Memberstack data

If I’m understanding the ask correctly… make sure that the member has the “member page” field filled out on their profile (you do this via Zapier), then use the front-end API to get that value and populate (via Javascript) the link/button with it.

@ChrisDrit
Hey Chris,

Cheers for the quick reply!

This isn’t the exact use case as the “member page” we’re wanting to send them to is their public profile page, not a dashboard that should only be accessible to them.

This is an example of a profile page I would want to link to on the dashboard.

I added a “profile-url” space in memberstack for the url, and I’m using Zapier to fill it out, but I don’t know how to use it as a link in a button on the dashboard.

@Josh-Lopez is this a common task that has a common solution I’m missing?

1 Like

So if you added this from within the MemberStack dashboard --> Forms & Fields --> Add Custom Field then you’d access it the same way, through the front end api and just inject that into the link/button. All of those fields should show up in the front end api.

Cheers again but I’m still a touch confused

How exactly would I access as a link though?

When I access it using data-ms-member=“profile-url”, it works as replacing the content, but it doesn’t actually work as a link.

Screen Shot 2020-09-22 at 10.14.31 AM

I basically want a way of doing “#/ms/data-ms-member/profile-url” to link to whatever link is associated with the account, but this doesn’t work.

No worries, what you’re trying to do is very advanced.

Let me know if this is clear…

If you’re saying that you setup a custom field called profile-url from within the MemberStack dashboard, found here:

…by clicking that “+ Add custom fields” button, then profile-url is available via the MemberStack Front-End API found here.

The important bit is:

Instead of calling something like member["email"] you’d instead call something like member["profile-url"].

I access the MemberStack Front-End API often and it always works well for me.

You can find some example screencasts walking through this at my site:

This doesn’t show exactly what you need, but scroll down to the bottom and you’ll see some example code that calls this API:

<script>
var Webflow = Webflow || [];
Webflow.push(function() {
  MemberStack.onReady.then(function(member) {
   if(member.memberPage){
    window.location.replace("/");
   }else{
   	setTimeout(function() { location.reload(true); }, 3000);
   }
	})
});
</script>

For you…

The next step would be to figure out how to inject member["profile-url"] into your link/button.

Webflow uses a Javascript library called “JQuery” and if you know the id of the link/button:

Then you should be able to do something like this (warning, totally untested code, consider it more of a “guide” than the absolute answer):

<script>
var Webflow = Webflow || [];
Webflow.push(function() {
  MemberStack.onReady.then(function(member) {
   $('#logout-link').attr("href", member["profile-url"]);
});
</script>
2 Likes

@ChrisDrit, Whoa man, you the true MVP :star_struck:

I’m gonna go through all this tomorrow and let you know how it goes, who knew it would be so difficult! (well i guess you did)

Thank you so much for your help though, this is amazingly helpful!! :rocket:

1 Like