The EASIEST Way To Build Unique Member Dashboards In Webflow (Memberstack 2.0)
Вставка
- Опубліковано 8 чер 2024
- Today I am going to show you how you can build member-specific dashboards inside of Webflow! This way you can provide your clients with live, custom dashboards with their own unique KPI's.
One of the most common requests I receive is how to make member-specific dashboards inside of Webflow. These unique member dashboards have a variety of use cases - personalized online courses, personalized member analytics dashboards, etc - all of which can be built inside of Webflow using No-Code tools.
Memberstack 2.0 is one of the most popular ways to build member-specific dashboards inside of Webflow. Their software allows us to gate our content, build free or paid membership plans, embed signup and login forms seamlessly into our Webflow accounts, and create member-specific landing pages and dashboards - all with little to no code. They are awesome! The issue however, is that the documentation to get started in Memberstack 2.0 is vague and difficult to decipher. Personally, I found it very difficult to get my unique member dashboards up and running using their onboarding instruction manual, so I decided to make a full tutorial video so that you can get your unique member sites ready to rock with as little hassle as possible!
In this video I will show you how to create your member-specific pages in Webflow (including Memberstack custom fields, Webflow CMS template pages, login redirects, and Zapier integrations). I will also show you how to set up your AirTable database to allow for seamless, live updating of your client dashboards with your unique KPI's. By the end of this video you will have a fully functioning client-specific dashboard site complete with a simple way to update each clients unique KPI's!
I have been using Webflow to build my websites for years. If you are a novice website developer looking to launch a new project or business (and don't know how to code), your best bet is using Webflow. With Webflow, you code visually, and have complete control over your website down to the pixel. No more having to go through style sheets or JSON files in Wordpress in order to customize your site to your needs. With Webflow, you are able to visually code your website from scratch. Subscribe for weekly tutorials!
-------------------
🆘 Need help building your paid membership site??? ⬇️
✉️ Business Inquiries: survivingyourtwentys@gmail.com
-------------------
Resources -
🎬 Watch THIS first - The FASTEST Way To Build A Membership Site In Webflow (Memberstack 2.0): • The FASTEST Way To Bui...
🥞 Memberstack: memberstack.com/?via=survivin...
🌊 Webflow: webflow.grsm.io/l9bi5zf0cljy
--------------------
Timestamps -
0:00 👋 INTRO
1:03 💾 Step #1: Add New Custom Fields
4:00 🏌️ Step # 2: Create Members CMS Collection
5:46 📊 Step #3: Build Live Client Dashboard
7:43 ⚡ Step #4: Add Zapier Integrations & Login Redirect
13:58 ☯️ Step #5: Set Up Redirect Button In Webflow
14:50 🚧 First Test!!!
16:03 🗄️ Step #6: Set Up Airtable Database & Zap
19:20 😜 Step #7: Send Airtable To Webflow Zap
23:26 👷 FINAL Test!!!
25:23 ✌️ CONCLUSION
--------------------
🎵 Music-
www.epidemicsound.com/track/n...
-------------------
👨 WHO AM I -
I'm Alex, a 26 year old Financial Analyst who lives in Nashville, TN. I'm now over half way through my twenties (I'm getting old!) and believe that I've acquired some valuable life advice over the past 6 years that I wish I knew when I was just entering my third decade of life. I make videos to pass on these life lessons to all of you (along with other ideas, tips, tricks, knowledge, experience, stories of success, stories of failure, etc.) so that you all can survive your twenties with more grace than I have managed so far!
Love your videos, no one is focusing on multi vendor marketplaces like you are, thanks for these tips
This has been so helpful and has saved me hours of work, thank you for taking the time to make this video and share what you know!!
Excellent, thank you. That saved a few hours ...
Thanks so much! You're a lifesaver.
There was other content on UA-cam on creating member-specific pages in Webflow, but not with Memberstack 2.0, so I really appreciate it! ❤
No problem, glad I could help!
Thanks a lot Alex this is exactly what i needed for a project I'm working on 🙌😊
Happy to help!
Legend - thank you!
Incredible! Easy to follow steps too, thank you so much :) I haven't been able to find instructions for building this DIY style anywhere without needing a proper dev background. I'm hoping Webflow will add some graph/chart components in the future into the Member sections to help connect data like this to plot graphs, and be able to toggle and filter date ranges like you made like MTD, YTD that would be the dream. Appreciate all your hard work on figuring this out 🖤from a fellow bean counter
No problem thanks for being here! Let me know if there's anything specific you'd like to see going forward. Was thinking about figuring out how to build more graphs etc. into the dashboards so could be a potential part 3 coming soon!
@@survivingyour20s hello! Can I pay you for an hour of your time? I have a webflow user dashboard idea, non memberstack. I am super close and you are probably the only person that can help.
Trying to store user specific embed in a text field in user account and then display in a tab on the user account. Seems possible, but i am struggling with getting the to render from the dashboard-embed custom field in the member account.
Amazing tutorial!
you explained this so well!
Thanks man, glad you enjoyed!
OMG! This is MAGIC
Nice work!
Thanks man!
more memberstack membership videos please! aha thank you!
No problem! Thanks for being here
Thanks!
Hey man, love your vids! Learning alot. Hey was wondering if I want to bypass the "Welcome" page upon signup and directly route to the member-specific page, how would I do that?
This was amazing! Do you think you can do a video of Native Unique Member Dashboards In Webflow with (Users) and (Logic)
Great tutorial! Thanks!
For some reason the auto redirect on login didnt work for me though
Thank you!! I've been looking for this everywhere. How do you think this process may be different now that Webflow has introduced user accounts? I'd love to know whether you'd still use Memberstack or not and why.
thank you
Can we create a member dashboard with all the features of this video for ready-to-sell webflow templates or is it only possible for special projects?
This is a good tutorial. However, it fails to mention crucial information: the high cost of using Zapier ($19-$49/mo), as well as the lag time (2-15min) for a zap to update. These factors make this solution non-viable for most people interested in replicating this, and should be mentioned at the very beginning of the video.
Thanks a lot for these videos. They are very useful. Would it be possible that you also make a video showing how to allow visitors on a webflow site to edit data in a cms collection assigned to them? Like Crocoblock in Elementor Pro. Thanks in advance.
I'll see what I can do!
echo the comment below, there's no up to date memberstack 2.0 content with all the latest webflow features. your tutorials are really easy to follow and you're doing a great job thanks for all the help!
No problem, super glad you're here!
Do I need to bind the name fields in memberstack to custom attributes in the text field for it to accurately update the personalised text field with the currently logged in users name? It's only showing the last signed up user and not updating when I log in as any other user. Trying to work out what I have missed here
Wondering if in Sept 2023 Webflow Memberships can be used? I still see notes from Webflow in designer with disclaimers. Maybe ok to use just for basic gated content sections?
Is it possible to allow your memebers to purchase eachothers services within the site. Almost like eBay would work, but for memeber access only?
👋👋
Could you make a dashboard where members can track clicks, submissions, profile visits.
Would be soo happy, need this on a big new project 😀
Heyo, how much do you pay for all of those third-party plugins monthly? Just curious on how much you spent on tools like these
What if I want my user to edit their personal details like their favorite City which they submitted during sign up form on the dashboard live?
How that can be achieved. Please help me to navigate this.
Thank you for this video! But I have a question. Can we manually add our customers? Because I have a database of 200 customers
Yes you should be able to in the Memberstack 'Members' section. I think there are a few import options to get your customers manually added.
You're fkin genius ty dude
hahaha thanks man glad I could help
I've found your content on UA-cam INCREDIBLY helpful and have been able to build my project because of it...thank you.
I have a quick question....you show us how to set up the 'Login Redirect' link so that when a member logs back in, they are directed to their Unique Webflow Dashboard that's generated from the 'New Members Template' in the CMS. However, for a new signup, the user is directed to the 'Gated Dashboard' page (which we set up in your 1st video) and is not connected to the 'New Members Template Page'. How do you get a new member on sign up to be directed to their Unique New Member dashboard CMS page and not the static dashboard page? Any help would be appreciated. (I hope this question makes sense)
I have the same question here. I know what you were asking.
After signing up, redirect the user to a blank page with a big *GO TO YOUR DASHBOARD* button. So immediately the user signs up, thats the next thing they see, and since thats the only thing they can see on that page, they will click it and be redirected to their dashboard. Simple
@@fullstackmarketing247 After signing up, redirect the user to a blank page with a big *GO TO YOUR DASHBOARD* button. So immediately the user signs up, thats the next thing they see, and since thats the only thing they can see on that page, they will click it and be redirected to their dashboard. Simple
Hi mate. Firstly, thankyou for your videos, your tutorials are so easy to follow!. I am having one issue... When i log out as one user, then relog in as a new created user, it still shows the old users member specific welcome message and content on the member specific dashboard. I have tried refreshing the page etc. Is there an easy answer to what I may have done to cause this problem? Thankyou and sorry for the questions!
I am facing same issue. did you get solution ?
Sorry...to add more detail to my problem. When I create a new user, it takes me to the correct memberspecific dashboard displaying the new signup users name in the welcome cms item text. But when i log in as different users it doesnt change, it still presents the signup users name/cms item. So it works fine with signup users but then wont update with any other logged in users. Until I create a new user login/signup then it replaces with the new users name and again, wont change back to the old ones when i log out and back in as the old one lol
With your video I can see a mistake. if you have another's members dashboard URL you can access this user's dashboard with your login info. Can you solve this issue?
Hi Alex, would you look into adding e-commerce to a personalised dashboard? Something like Foxy or Snipcart to be controlled via cms items and then having the purchased items show up in a personalised dashboard. Thank you.
I'm looking into the same thing but with shopify, did you end up doing this?
Why not use Foxy or Snipcart?
I will definitely check it out, I'm still unsure on how to set it up though@@lawrencelandeloos3761
I find Whalesync much easier to sync data between Webflow and Airtable
Been hearing a lot about this lately, I will dive in and play around with it. Thanks for the suggestion
I'm stuck on the redirect to user dashboard step. No matter what I do it doesn't work. Funny thing is it was working fine the first time I set it up and suddenly stopped working
ensure your login redirect is the name of the collection
anyone have any luck with multiple plans? There's no documentation on how this works. How do my customers register for different plans? Literally the last thing I need to hook up and it's killing me how awful their documentation is. Isn't this one of their key features?
Do you think Unique Member Dashboards are possible with Webflow’s Memberships now?
Has anyone figured out how to do this with Webflow Memberships yet?
hey bro how much money to build this for me?
Email me if you're still struggling with this and we can work together! survivingyourtwentys@gmail.com
Hi I had a question. Would this have a security risk in that if anyone is logged in and enters someone else's dashboard url into the search bar, It would take them to someone else's dashboard, instead of redirecting them to their own. Is that right or am I going wrong somewhere? Thanks
You are not wrong, anyone with the link can access all the specific member pages of any member, it is all out in the open, so security-wise this is very bad. It relies on creating unique ID names which can't be randomly guessed. I mean, there are usecases for this kind of setup too, and I will personally implement solution like this for a small project where secrecy of the data isn't important (and I am thankful for this video because of that), but any serious project/company where data privacy is a requirement should avoid this method.
@@ljubov_studio Thanks for answering my question! Do you know of any blogs/videos highlighting the most secure way to go about this? Thanks
@@alfieanil7019 Might be a bit late for this to be relevant to you but I've found there is a way of securing the information* - by adding a bit of javascript to the page, you can add the memberstack ID of the logged in user to the page and the member ID in the CMS item, and then change the display style to 'none' on any (or all) of those two elements don't match.
*It's not perfect, because if you went into the inspector and changed the display style, you could reveal it but it is a little more secure! I've done it on a site and it worked out pretty well.
@@oodledesign how can i get memberstack id with js
@@MahmudulHasan-fw3gu There's a couple of different ways, what I've done recently is add a div block with the id of 'member-id' and with the custom attribute of data-ms-member="id" which pulls in the memberstack id of the current user, and then I can reference it in any other scripts by targeting the id of the block (or even the attribute). You can do this by adding this line:
var memberID = document.getElementById("member-id");
And then can use the variable memberID to pull the ID through.
monu jhava
This was amazing! you break down the news and earnings so easy for me, I've come a long way since I started trading. Made $300k which has been trading from last month
Very cool video. The only thing is that i cant see item ID field while setting up my zap.