Building custom and advanced forms for your Webflow site is easier than you might think.
From demo request forms to signups with multiple integrations and automations, Arengu allows you to create the use case you need without having to code everything from scratch. Plus you can easily embed them by copying and pasting two simple lines of code.
Demo request with user qualification
Personalize your forms and flows qualifying users with data enrichment, or just adding custom rules to ask more data based on the user profile.
Arengu allows you to easily integrate Clearbit in your flows to get more information from the user's email. Add conditional logic based on the form's input data, or the data provided by the data enrichment tool, to trigger different paths and form behaviors.
For example, you can ask for more data if a corporate email is detected, send notifications based on the user’s job position or company size, plus allow certain users to book a meeting with Calendly with a salesperson.
Signup and login
Create completely customized login and registration forms, asking for an email and password or Social Login options like Google, Facebook and Microsoft.
Easily generate and send temporary codes and magic links to build user verification and passwordless flows from scratch or using fully editable templates.
Payments and subscriptions
Integrate Stripe into your forms by dragging and dropping the payment field, and copying and pasting the API key from your account.
Out of the box integrations
Arengu allows you to trigger actions and automations in any stage of the form, not only after form submission. Actually, you can connect any service with an API using the provided native actions and the HTTP Request action to connect your own ones.
For example, you can easily connect Airtable, Google Sheets, or HubSpot to store your user’s information, Mailchimp to subscribe them to your newsletter, or Slack to send custom notifications to your channels.
Check all the available integrations that you can connect via OAuth or simply by copying or pasting the API keys of the corresponding account.
How to embed custom forms in Webflow
A) Using the ‘Embed’ component (Recommended)
First, add the SDK script to your head code in your project settings, under the ‘Custom code’ section, as you can see in the image.
Webflow has an ‘Embed’ component to add custom HTML anywhere in your page, so you can just use it to paste our tag where you want your form to appear.
B) Adding a custom attribute
If you can't use the ‘Embed’ component, you can always add the custom attribute data-arengu-form-id to any component, including your form ID as value.
Just remember to add the SDK script to the head code of the website too, under the ‘Custom code’ section, as you can see in the previous example.
Bonus tip: Dynamic variables in forms
Did you know that you can add dynamic content to your forms using Webflow collections? When using Weblfow's ‘HTML Embed Code’ to add forms, you can easily include dynamic variables from your collections by clicking the ‘Add field’ button.
For example, you can use it to dynamically change titles or pre-fill form fields.