Generating Form

Below are the step-by-step instructions for generating a Webflow form with Form Fields Pro and inserting it into the Webflow Designer. Start from Step 1 and follow each step in order.

Step 1 — Create a New Form

1. Open Form Fields Pro and click the New Form button.

2. Enter a unique name for the form.

3. Click Next to open the form builder.

Step 2 — Add Input Fields and Insert the Form into Webflow

1. In the Form Fields Pro app, click the “+” icon to open the Input Fields Panel.

2. From the panel, select or drag and drop the input fields you want to include in your form.

3. Open your Webflow Designer and add a Form component from the Components Panel.

4. Inside the Form component, select the Form Element and delete all existing default fields (e.g., name, email, submit button).

5. Keep the Form Element selected and return to the Form Fields Pro app.

6. Click Insert Form to automatically insert your newly-created form structure into the selected Webflow Form Element.

7. For visual guidance, watch the video tutorial provided below.