I’m currently in the process of getting acquainted with the Bubble platform and have run into an issue on how I set things up or a bug that I could use some assistance with.
I am trying to configure a login and signup option using Bubble’s pre-built components. Based on the tutorial videos I’ve watched, it seemed the workflows for these options were already set up. However, upon attempting to implement these, it appears the process now requires manual configuration for connecting the form popup to the button, as no workflows are currently pre-configured.
So far, I’ve managed to create the popup and have set the header buttons login & sign up to display their respective groups. However, when the button is clicked, the popup isn’t being triggered as expected.
Any help or pointers on how to link the form popup to the button would be greatly appreciated!
It looks like you’re actually selecting to show a group that is INSIDE the popup group, not the popup group itself. On the button workflow, see if there’s an element named anything with the word ‘popup’ in it, like ‘Signup / Login Popup’ and choose that to show instead.
Hey ms, thank you for responding so quickly! That did make the popup display but now I am facing another challenge, with making the proper group display when the respective button is clicked. At the moment, “Log In” is displaying the “Sign Up” group. How would I solve this?
I tried to set a conditional to hide the signup group when someone is logged in but I don’t see a “User is Logged In option in the list”.
Am I going about this the right way, or should I create to separate popups?
You’ll just need to track down the correct/ corresponding workflow with that button - here’s how it appears in mine (this is most Bubble’s default reusable login element, minimal changes by me):
You seem to be going about it the right way regarding conditionals - try looking for: ‘Current User’ → ‘Is Logged In’ as part of your conditional statement.
This looks right to me - testing is the best way to ensure, especially in incognito mode as that will have no strings attached to any browser caching / previous logins / etc.
States are a way to store values on the client (browser) side, and can be set to really be inside just about any element on the page. I usually create them on the element that’s going to reference it, or trigger it, just so I remember where it is. For example, I have an ‘Edit’ button, that has a custom state called ‘edit’ on it, and is a yes/no. By default, it’s ‘no’. When the user clicks ‘Edit’, it sets the custom state to ‘edit’, which does 2 things:
I have a condition on the button that when the custom state ‘edit’ is ‘yes’, the button now says ‘save’ instead of ‘edit’
I have other elements on the page that become visible (like ‘delete’ buttons on line-items, or input fields that replace the text fields so the user can edit the values)
‘Set state’ is the workflow action required to tell the custom state what data it should be holding.
Set Focus I haven’t done much with myself, but my understanding is it’s how you can establish exactly where on the screen a popup should appear. Here’s a quick video Bubble has that explains it better than I could: How to Use the Group Focus Element | Bubble Quick Tip - YouTube
