To connect the forms on your Webflow website to HubSpot without a native integration, you can follow these steps:
1. Sign up for a free HubSpot account: If you don't have a HubSpot account already, go to HubSpot's website and sign up for a free account.
2. Set up your form in Webflow: In your Webflow project, navigate to the page where you want to add the form. Drag and drop a Form Block onto your page and customize it as per your requirements. Add the necessary form fields and make sure to include an email field for lead capture. You can also use custom attributes to track additional information.
3. Create a webhook in Webflow: A webhook is a URL that allows Webflow to send data submitted through the form to an external service. Create a new webhook in Webflow by going to Project Settings > Integrate > Webhooks. Provide a name for your webhook and enter HubSpot API endpoint URL in the "URL" field.
4. Set up a HubSpot form webhook: In your HubSpot account, navigate to the Forms section. Create a new form or choose an existing one to connect with your Webflow form. Inside the chosen HubSpot form, go to the "Options" tab and select "Form webhook." Enter the webhook URL that you obtained from Webflow in the URL field. Click "Save" to apply the changes.
5. Map form fields: In the HubSpot form editor, map the form fields with the corresponding HubSpot contact properties. This step helps HubSpot understand the data received from Webflow and store it in the appropriate fields.
6. Customize the confirmation message: After the form submission, you'll likely want to display a confirmation message to the user. In Webflow, navigate to the Form Block settings and customize the success message accordingly.
7. Test the integration: Before going live, it's crucial to test the integration. Fill out the form on your Webflow website and submit it. Check if the data is being captured correctly in HubSpot. Validate that the data is being stored in the right fields and matches your form fields' mapping.
By following these steps, you can connect the forms on your Webflow website to HubSpot without relying on a native integration. This integration allows you to easily capture user information and use it for lead nurturing and marketing automation within HubSpot.