confirm
The page Users are navigated to after they confirm their email.
Last updated
The page Users are navigated to after they confirm their email.
Last updated
By default, the template does not require new Users to confirm their email address, and it does not send new Users confirmation emails. This guide describes how to send confirmation emails to new Users when they sign up, and how to customize the confirmation email that's sent.
If it's not crucial that a User confirms their email, it may be best not to require this so new Users can go to the onboard page and explore your app immediately after signing up. 🙂
Currently, anyone can access this page, but it is meant to be accessed by Users who clicked a link to confirm their email.
This page changes the User's "email confirmed" field's value (type: yes/no, list: no) to yes automatically. The "email confirmed" field is handled automatically by Bubble and built into every app; it can't be deleted.
You can utilize this field's value to show/hide certain features of the app or redirect users, by using the expression When Current User's "email confirmed" (type: yes/no, list: no) is [yes or no] --->
These are just example conditionals and event conditions, and are not included anywhere in the template.
The confirm page is not within any of the template's navigation elements.
If you choose to send a confirmation email to new Users, the link in that confirmation email will navigate them to this page.
The confirm page contains the Button Get Started (Goes to Onboard) element which navigates the Current User to the onboard page:
The illustration on this page is from Streamline Icons and Illustrations. If you would like to change the illustration used on this page, other options are available here. There are also free, MIT-licensed illustrations available from Undraw.
Those are not referral links and Littlebay is not affiliated with Streamline Icons or Undraw.
Navigate to the login/signup popup reusable element in the page elements/organizer:
2. In the workflow tab, click on the workflow event "When Button Sign Up is clicked". This will show you a screen like this:
3. Now we need to modify the "Sign the User up" action, so that it sends a confirmation email each time a new User signs up. To do this, click the "Step 1: Sign the user up" action, highlighted in yellow below:
4. This will open the action's editor. Since the "Send an email to confirm the email" is unchecked, check this checkbox so that a confirm email is sent each time this action is run:
5. Make sure the Confirmation page is set to the "confirm" page:
6. Now an email will be sent to every new User who signs up. When a new User checks their email and clicks the confirmation link in the email, they will be navigated to the confirm page. This will also change the built-in "email confirmed" field (type: yes/no, list: no) to "yes".
The "email confirmed" field is a built-in Bubble field, that is not visible and can't be deleted in the Data tab. It is handled automatically by Bubble. It can be used to show, hide and redirect Users who haven't changed their email by using the expression "When Current User's "confirmed email" is "no" --> do the following."
By default, the template's Sign Up workflow is setup in this way within the login / signup popup reusable element:
To show the Group Confirmation Email element instead of directing the Current User to the onboard page:
Remove the Go to page onboard action
Setting the login/signup popup element's "mode" custom state value to confirm ensures that the Group Confirmation Email element is visible after the Current User clicks signup:
1. Click the caret icon to expand the Elements Tree panel:
2. Click the + icon to expand the Group Login/Signup Container element:
3. Click the Group Confirmation Email element to make it visible in the editor:
4. Click on the Text Confirmation Email Sent element (if you'd like to modify the text shown when the confirmation email is first sent):
Set the login/signup popup reusable element's "mode" custom state (type: text, list: no) to confirm. (You can do this by going to Element Actions --> Set state):
