How can I integrate my Webflow form with Hubspot without using Zapier?

To integrate your Webflow form with HubSpot without using Zapier, you can use HubSpot's native form handler and connect it directly via Webflow's form action settings.

1. Create a HubSpot Form with a Form Action URL

• Log in to HubSpot, go to Marketing > Lead Capture > Forms.
• Create a new form using "Non-HubSpot Forms" (Form API) or choose "Embedded Form", and publish it.
• If using the Form API, ensure you obtain the Portal ID and Form GUID.
• The endpoint for API submissions is:
  https://forms.hubspot.com/uploads/form/v2/{portal_id}/{form_guid}

2. Adjust Webflow Form Settings

• In Webflow, select your form and go to the Element Settings panel (D key).
• Set your form’s Method to POST.
• In the Action field, paste the HubSpot endpoint URL you got from above.

3. Rename Webflow Form Fields to Match HubSpot

• HubSpot requires the field name attributes to exactly match their field internal names.
• In Webflow, select each form field and:
• Open the Settings Tab.
• In the Name field, input the exact internal field name from your HubSpot form (e.g., email, firstname, lastname).
• These are case-sensitive and must match exactly.

4. Host & Test the Form

• Publish your Webflow site and test the form by submitting a test entry.
• Confirm the data arrives in HubSpot under Contacts or in the form submission dashboard.

5. Optional: Add Hidden Fields for Tracking

• Want to track UTMs or lead sources? Add hidden input fields in Webflow.
• Set their names to match HubSpot fields like utm_campaign, utm_source, etc.

Summary

To connect your Webflow form to HubSpot without Zapier, use the HubSpot Form API endpoint, then set the Webflow form method to POST, set the appropriate action URL, and match the field names exactly. This allows submissions to go directly to HubSpot from Webflow.