How To Create Multi-Step Forms In Bubble.io (Complete Guide)

If you’re trying to build a multi-step form in Bubble, then this is the tutorial for you 🔥

Multi-step forms create an intuitive experience for your end-users. It saves them navigating between separate pages in your app.

Throughout this guide, you’ll learn everything there is to know about creating a fully responsive form. This includes:

1. How to design each section of your form
2. How to hide & display relevant sections
3. How to build the workflows that power the form
4. How to build the conditions that hide & display the form
5. How to create a custom progress bar

---

---

⏱ Timeline: ⏱
00:00 - Course overview
00:36 - App preview
02:35 - Designing the form
10:32 - Creating the custom states
13:58 - Building the workflows
18:28 - Hiding & displaying groups
23:46 - Submitting the form
24:52 - Creating a progress bar
42:08 - Additional insights

[mindforge]

This guy is absolute genius. Your teaching skills are the charts your the best, Thank you so much for your help💗💗💗💗

[andersonprofetadebrito]

I am from Brazil. And I haven't found a tutorial like this here. I had to look for it in English and I don't even know English. Watch subtitled.

I want to thank you very much because that was exactly what I needed.

Thanks

[apmcintyre]

Great tutorial Lachlan, well presented and a nice clean setup. I'll be using it in my app!

[MarceloBusiness-tlgr]

Excellent tutorial, very didactic and ends up teaching a lot about Bubble within a simple theme. Congratulations!

[vibehighest]

i think i am starting to understand now. please correct me if I am custom states, in its most basic form/function, allow groups or elements to be visible when an event or action is triggered, as long as it is not visible on page load and collapsed when hidden?

[kayzchronicupturn]

Your teachings are gold! thank you!!!!

[CliniTechGmbH]

Thanks very much for your great video. I have faced just one issue. My groups can hide and display again by clicking next or back, BUT, my page is big as I created 4 groups in it and so in preview when next group displays, it goes down and needs to scroll down to see the next group. what mistakes I made? thanks for your help in advance.

[ghvghvhbhjb]

hello. please make a video about creating a scaning app if it is possible with bubble.
i have an idea of app which requires scaning feature.

[peterdouglasross]

Thanks Lachlan! Why not just use Show and Hide elements actions and toggle visibility in layout tab instead of custom states?

[patrickokojie]

If a page on my form is for the user to select between checkboxes, how do i save the checkbox option chosen to the database?

[KykykyTPTP]

Thank you for the wonderful video! I have two issues. I have everything set as columns. 1. For some reason, nothing is showing when I load the page. Soi made the group 1 to be visible when page is load but then it won’t disappear when I hit next. 2. When I hit next button on my second group, it goes back to the group 1. World appreciate your guidance

[haroldroyceanonuevo]

But How can We add a Validation? Ex. Next Button only when all input fields have a value then go on next step

[JamesAFranklinIINY]

new subscriber! Thank you for all the awesome content I am new to building in Bubble and you have been a BIG help. One question that i could not figure out and no one seems to have this, How would you create a login/registration where the account they are setting up is link to a account already in the app. example they would need to match the Account number when registering and they are just adding there own user name to that account already in the database to link to. (hope i made sense, lol)

[kennynassen]

Nice video!

It's possible to do it by using the URL too no?

Sometiles custom states are a bit tricky hahah

[patrickokojie]

I've created my form, but i'm not seeing the option to collapse the group when hidden. I've made sure to have the container set to "column" instead of "fixed", but I can't get this option to appear. Does anyone have a solution?

[Sam-vzpf]

Thank Mate. Your serving the bubble community.

[patrickokojie]

Really great video! How would I setup a conditional form? Like I have questions I want the user to see only if they chose a certain response on a previous form question?

[haroldroyceanonuevo]

Can it work on reusable element with pop - up?

[arthurkeller]

Great video!

Its possible to create a sales engagement app with bubble? its like a crm but only for pre sales, it show your task with each lead day by day

meetime is an example

[LostAndFoundAnywhere]

Hi @Building With Bubble. I just want to tell you that this is an amazing vid. I really like your content and all what you post on Youtube. But I have a question, can you build a lost and found software using bubble( If somebody lost/found something he would have to sign in then post what he lost/found. if somebody found someone's lost object, they would chat in a built in chat with users page. there is also a search page to search for lost and found items.)? Please that would be absolutely amazing. Thanks!