There’s plenty of tutorials out there that show how to extract URL parameter data and use it on your Webflow website. I can’t find a single tutorial showing how to add this data to the URL. I want a page’s URL parameter to be automatically populated with the memberstack ID of the logged in user. Much appreciated if someone can point me in the right direction.
Here is my site Read-Only: LINK
(how to share your site Read-Only link)
A url describes a path to a resource, so usually, if you wanted to add querystring params, you’d add them directly to the links where you want them.
You could to that with an absolute link in Webflow, e.g. link to https://mysite.com?foo=bar.
However in your case you’re wanting dynamic links, so you could go with HTML Embeds;
<a href="https://mysite.com?user-id=whatever">Click me</a>
And then whatever could be inserted or scripted to be anything you want.
It doesn’t help you much to add that ID to the current page you’re on, since you’re already there- the only way that ID would be preserved is if someone bookmarks that page. But then… they’d need to log in anyway to access the page.
Now to get the Memberstack ID, you’ll want to check Memberstack’s forums, but it looks like this may be what you’re looking for.
Thanks.
There’s still two things that are not clear to me.
That script refers to the URL the user is send to by pressing a link, so it would need to be connected to the button/link that sends the user to the ‘logged in page’, right? I don’t know how I can connect this script to a log in button. Can you explain this or point me to a tutorial?
Not completely clear what you mean with this: “It doesn’t help you much to add that ID to the current page you’re on, since you’re already there- the only way that ID would be preserved is if someone bookmarks that page. But then… they’d need to log in anyway to access the page.” Maybe I should add some more background info, the URL needs to contain the user ID because I will have them fill in daily surveys (Tally) and I want to be able to group the data per user. Later I want to extract that data from my database and feed it back to every specific user in Webflow to show them analytics on their own data.
I’m not at all clear on what you’re trying to do- it will be much easier once you’re further along in your design, and can share a read-only link with a specific question where you’re stuck.
Here I’m having to try to imagine what it is you’re trying to do- but putting an ID in your current-page URL won’t send it anywhere. If you have a survey system that’s perhaps FORMs based, you could pass your ID to it in a hidden field, or perhaps as part of the action URL. But that depends on the system.
So far the only design goal I can see is this part-
If you’re using Memberstack as your membership system, that link I sent you above shows you how you can extract the current Memberstack Member ID. I’m guessing that on some member-only page, you’d have a form, which logged-in users can access. That form would need to capture the memberID of some form, to store with the data. You’d almost certainly do that using a hidden field. No URLs querystrings involved so far. At this point you need to read the docs of your survey system (Tally).
It is clear how to get the member ID from Memberstack in Webflow. To send the member ID with the Tally form in a hidden field, the ID should be retrieved from the URL parameter according to Tally’s website. There doesn’t seem to be a different way to do this with an embedded Tally form. I know with other form providers the hidden field data doesn’t necessarily need to be retrieved from the URL but I prefer to use Tally because it is virtually free, I like how it works and have already set up the database. See screenshot from their website:
My website consists of a home page where some info about the tool is given. Goal of this home page is to direct users to a signup/login page. The login page leads to the logged in page which is where the form will be filled in, so which should have the member ID in the URL.
This is my read only link: https://preview.webflow.com/preview/lc-symptom-tracker?utm_medium=preview_link&utm_source=designer&utm_content=lc-symptom-tracker&preview=0f5a12c7455034d0b67f3e1de0c49d88&pageId=6357b8a1cbd2a59e10cf7b71&workflow=preview
I am having some layout problems as well, so there is not much to see yet that is why I didn’t send it initially. Underneath the ‘information’ section on the ‘data page’ I will have a new section (which I keep failing at adding properly which is a different problem) that will also have tabs. It will have 3 tabs, one tab for embedded Tally Survey 1, second tab for Survey 2 and the third tab which contains an interactive graph containing user specific data.
Hope this makes it more clear what I want to do.
You probably need to get a bit further along in your site build and integration before anyone can help you with this part.
Where is your form appearing? I’m not seeing it in your page layouts anywhere.
Once you have all that built, and you’re ready to do the “pass the ID in” part, it looks like you may have two options-
Set the hidden field value with the Member ID.
Add the Member ID to your URL. Get the URL, re-generate the querystring, update the URL and push it to the browser history stack, and then let Tallyform pick up that param and put it in your hidden field for you.
Option 1 should be far simpler, cleaner, and less prone to breakage- but it depends entirely on how you’re integrating this form into your page.
You’d use e.g. $("#hidden-field").val( memberId );
Option 2 is less clean, and more fragile since users can edit that ID. It also depends on timing- you’d need to change the URL before Tally captures it.
For option 2, look into window.history.replaceState
Check finsweet, they have added attributes to use with query parameters. I haven’t used it yet myself, but may be worth you checking out.
I managed to add the userID to the URL with history.replaceState. The problem I’m facing now indeed may be a timing issue. When I manually refresh the page after the URL is updated the Tally form captures the userID otherwise it doesn’t. I’ve been in contact with people from Tally and was recommended to deconstruct the HTML embed code and place Tally.loadEmbeds underneath updating the URL params. This didn’t work either. Screenshot of the code below. I also tried many different combinations with the setTimeout function. Starting to wonder whether history.replaceState is the problem and Tally can’t read the URL when it is updated like that. Hope you can give some insights.
I don’t work with Memberstack or Tally, so I can’t help much here.
It looks like you’ve got a rogue src= line in the middle of your script though.
Also do you want the loadEmbeds only to happen if there’s a member?
