Skip to content

webflow.md

Latest commit

 

History

History
43 lines (24 loc) · 2.04 KB

webflow.md

File metadata and controls

43 lines (24 loc) · 2.04 KB
description Here's a guide on how to integrate Web3Forms with Webflow using Form Block and HTML Embed

Webflow

Example Demo: https://web3forms-contact-form.webflow.io/

1. Create a Form Block in Webflow

First, you need to drag the form block element from the Webflow sidebar to your website.

Drag the form block the canvas

2. Create a hidden input field in Webflow

To add our access key, we need to create a hidden input field in webflow to make our contact form work. For that, we use the HTML Embed Option.

Drag Embed Option inside the <Form> Block

3. Add Access Key inside the HTML Embed Block

Now, add the hidden HTML Code as shown below inside the code editor and click Save.

Make sure the embed block is inside the Form Block.

4. Add Form Action URL

Now, setup the form action URL by selecting the form element and choose "Settings" from the right sidebar. Make sure you select POST as method.

Action URL: https://api.web3forms.com/submit

5. Done.

That's it. Web3forms Contact form will work with your Webflow Website now. You can add more customization features like custom redirect, email subject etc using the hidden field similar to step 3. Refer to the Customizations section for more details.