![tap forms tutorial tap forms tutorial](https://i.ytimg.com/vi/9Q_dlkfOyxM/maxresdefault.jpg)
For email, that’ll check to make sure what’s written in the field is an email - not a random smashing of keyboard characters, like Miguel’s default typing mode. Users won’t see this name directly, but it still shows up in the code, so be careful not to include something you wouldn’t want users to see. Any time we see the NAME field in our Input Settings? This is how we’ll identify the field INTERNALLY, which’ll show up on form submissions. I like to make everything required, but let’s be honest, it’s also the reason Miguel is still filling out my Birthday RSVP even though, I have, indeed, celebrated my birthday over, ha, yes, three weeks ago.)īut there’s more going on in these configuration options. Well, we can go in, and make sure not only the name, but also the EMAIL are marked as REQUIRED. Let’s say we REALLY need to get their name and email.
![tap forms tutorial tap forms tutorial](https://d2t1xqejof9utc.cloudfront.net/pictures/files/135651/original.jpg)
So with a LOT of these form elements, we can sort of double click on them (.or even just click the little button.) and we can see all our options. What is our GOAL? We’re adding these different elements SO THAT we can GATHER all the information we need from POTENTIAL customers…who are filling out this form. And a text area to add in more information. Grimur: Yeah, so with the magic of editing | now have everything we need for our lead gen form. We can start to build this sort of “lead generation form.” So we’ll add in the fields we want. So if you’re tempted to go minimal, consider other ways of doing that.Īnd if we wanted to ADD other Form elements (like the ones we see here) we can drag those right in. These are often CRITICAL for accessible navigation. Otherwise, form anatomy is boring.īut one REALLY good practice here: do NOT delete the field labels. Grimur: Miguel, what’s up? We’re filming. And finally, an ERROR message (if someone has a PROBLEM submitting.)Īnd if we take a tiny looksie under Form, we have pretty much everything we see on the canvas: all our labels, text fields, and the submit button. Open up the Form block? There’s actually THREE things: the form itself (what we see), but SECOND…we have a SUCCESS message (when someone submits the form).
![tap forms tutorial tap forms tutorial](https://ecomm.productivity.com/ecomm_images/items/large/rtk5000.jpg)
And this is CRITICAL for one reason: we NEED a form block to actually CAPTURE the form data.Īnd while there’s a lot of stuff we can SEE, it’s only a THIRD of what’s inside. And by default, the Form Block has a bunch of stuff inside already. So we can bring in a form (by the way, there are LOTS of form things you can add), but we’ll START…with our Form block from the Add panel (we can just drag that in).
#Tap forms tutorial how to
And we’ll move FAIRLY quickly in 5 steps.įirst we’ll go over what’s in a form (the anatomy), we’ll show how to configure form elements, we’ll style our form, we’ll talk success and error states, and finally, we’ll control what happens when someone fills OUT this form. In this lesson, we’re going to build a form - and for this example, it will be a LEAD generation form (we want to capture leads for our fictional business - and it’ll look like THIS at the end).