How to limit app features to logged in users
In this Bubble tutorial we explore a number of different ways to limit UI elements and Workflows based on whether a user is logged in or logged out.
Unlock hidden app features: Learn how to restrict access for logged-out users in Bubble!
Secure your Bubble app: Discover multiple methods to protect features for logged-in users only.
Master user authentication: Combine element visibility and workflow restrictions for bulletproof app security.
Limiting Features for Logged-in Users
How can you limit features in your Bubble app to just logged-in users? This question is thanks to a comment in one of our previous videos. We read every single one of them, so please like and subscribe, leave a comment if you've got any questions and if you are looking for more Bubble tutorial videos then look no further than our website planetnocode.com where we've got hundreds of Bubble tutorial videos from beginning all the way through to advance. Let's dive into this question though about how we can limit what a logged out user or even a logged in user can do and I'm going to show you a number of different methods and talk you through each of them.
Setting Up a Simple Page with Toast Notifications
So I've got a very simple page here and all I've done is set up a toast notification, check out an earlier video for those, but basically I click this button and I get a notification it runs a workflow and I click this button and it runs a different workflow. So how can I set up so that I don't get the logged out user button if I am logged in and I don't get the logged in user button if I'm logged out?
Checking User Login Status
Well let's get rid of the logged in user button if I'm logged out and to check that I am just going to update this text field here to say logged in and then current user is logged in and that should return. Okay because I just want to make sure in this demo am I logged in or logged out? Well that's not what why something that worked. I don't think I fully cleared it. Okay let me do it differently I'm gonna get rid of my label here. I do like to keep these things in these videos makes it a bit more a bit more rough but it shows how I would go about doing it. So I'll say logged in because that's the yes statement and I'll say logged out. Let's try that. Okay so I am logged out so if I'm logged out I don't want to see the logged in button.
Hiding Elements Based on User Status
So there's a couple of things I can do with this one is I can disable the button. No I don't want to see it. So one is I can hide the button so I could do something like it is a visible page load collapsed when hidden and then it is only visible when current user is logged in this element is visible. So now if I go back to my my demo it's disappeared.
Making Elements Unclickable
So there's nothing else I could do that instead of hiding it I could instead making sure that I now make sure it is visible on page load. I can say current users logged out. This element is not clickable and so now if I go back here. Okay now this is because I have a style I'm using it I'm using a default style by Bubble but I have a condition here which is if the bus isn't clickable it reduces the opacity to 30 so it gives me that nice grayed out look and also notice I'm not sure this shows up on the screen recording but I'm getting my normal pointer mouse rather than my I can click on this element kind of hand with a that sort of thing.
Security Considerations
Now this isn't completely secure and let me just talk about number of reasons why. First of all if I hide the element like I did before you shouldn't be putting like static data that you need to protect and just relying on not rendering it on the page that's not very secure. Of course if it's dynamic data brought from your database you should be using privacy rules to protect the data taken from your database and displayed on the page and you could use that in combination with is the user logged out hide this element that way you've got both levels of protection.
Securing Workflows
The other thing worth pointing out is that it's basically just a bit in the HTML that's saying this element isn't clickable so I could right click on it and I could edit it in the browser developer tools and make sure that it's clickable so it's to be really strict with it I would also recommend that on our workflow we also say only run when current user is logged in so that way the workflow is actually protected as well as disabling the button now maybe that's a bit overkill if you think so leave a comment below but I think that that is technically covering both bases you make the button unclickable in the design tab and you make the workflow unrunnable using an only when statement.
Can't find what you're looking for?
Search our 300+ Bubble tutorial videos. Start learning no code today!
Flexible Pricing Plans to Fit Your No-Code Journey
Choose the plan that aligns with your goals and start building your startup today.
Have questions?
We have answers!
Find answers to common questions about our membership plans, programs, and more.
Both plans offer full access to our learning resources, community, and support. The Annual plan provides a significant discount (over 15%) compared to paying monthly, and it allows you to lock in your rate for a full year.
Absolutely! You can easily upgrade or downgrade your membership plan at any time by logging into your account and selecting the desired plan. Any unused portion of your current plan will be prorated and applied to your new plan.
As a Planet No Code member, you'll receive a discount on our Bubble coaching sessions. Monthly members receive a 10% discount, while Annual members receive a 17.5% discount. To redeem your discount, simply log into your account and book a coaching session through our platform.
Our 8-week intensive mentorship program is designed to provide personalized guidance and support to help you accelerate your startup journey. You'll be matched with a startup expert who will work with you one-on-one to set goals, overcome challenges, and make rapid progress.
To apply for the Mastery Program, simply click the "Request Invitation" button on our pricing page and fill out the application form. Our team will review your application and schedule a call with you to discuss your goals and determine if the program is a good fit for your needs.
We accept all major credit cards, including Visa, Mastercard, American Express, and Discover.
While we don't offer a free trial, we do provide a 14-day money-back guarantee. If you're not completely satisfied with your membership within the first 14 days, simply contact our support team, and we'll issue a full refund.
If you decide that Planet No Code isn't the right fit for you, you can cancel your membership at any time by logging into your account and navigating to the subscription management page. Click the "Cancel Membership" button, and your membership will be terminated at the end of your current billing cycle.