How to create a confirm email input in Webflow
Memberscripts needed:
Tutorial:
Cloneable:
Why/Use Cases
- Prevent users from submitting important form fields with typos.
Creating a confirm email input in Webflow
This guide will help you build a Webflow form with fields whose inputs can be confirmed by other fields. You’ve no doubt already seen this in action inside forms that ask you to confirm the password you just typed in.
To create a confirmation input in a Webflow form, we’re going to use MemberScript #140 – Confirm Matching Values. Follow the link to get the code you’ll need to add to your page and watch a video tutorial on how to set everything up.
Setting it up
Once you have your form created and styled, you need to add the following attribute to the field whose input you want confirmed:
· ms-code-conf-input=”email”
Now select the field that’s supposed to confirm the first one and add the following attribute to it:
· ms-code-conf=”email”
Next up select the error message that shows up if the inputs don’t match and add the following attribute to it:
· ms-code-conf-error=”email”
The attributes values are just a way to link them, so you can put whatever you want as a value depending on what fields you want confirmed.
Making it work
Now that you’ve got everything set up in Webflow, all you need to do is add the MemberScript #140 custom code to your page, before the closing body tag.
Conclusion
That’s everything, you can now go ahead and test the form on your live site.
If you want to use our demo project to get you started, just click the button below to add it to your Webflow site.
Our demo can help you create a confirmation input in your Webflow field to prevent typos in user submissions.
Take me to Cloneable!
Written by
Ovidiu
Contributor