How do I connect the forms on my Webflow website, based on the Saasplex X template, to Hubspot without a native integration?

You want to connect the forms on your Webflow website (Saasplex X template) to HubSpot without using a native integration. Here’s exactly how you can set it up:

1. Enable Webflow Form Notifications

• Publish your Webflow site and confirm forms are working normally (submissions are being collected in Webflow).
• Go to Project Settings > Forms and make sure notification emails work—this ensures the form infrastructure is properly configured before integration.

2. Create a HubSpot Form

• Log into HubSpot and navigate to Marketing > Lead Capture > Forms.
• Create a new "Standalone Form" (not embedded) that matches the fields you are using in your Webflow form (e.g., name, email, company, etc.).
• Copy the Portal ID and Form ID, which you'll find in the form's Embed section.

3. Add HubSpot Form's Endpoint to Webflow

Since Webflow’s native forms submit to Webflow servers, you need to override the default behavior:

• Select your form in Webflow Designer.

• Open Form Settings in the right-hand panel.

• Under Form Action, add the HubSpot Forms API endpoint:

• URL structure: https://forms.hubspot.com/uploads/form/v2/{PortalID}/{FormID}

• Example: https://forms.hubspot.com/uploads/form/v2/123456/abcdef12-3456-7890-abcd-1234abcd5678

• Set Method to POST.

4. Match Field Names to HubSpot Form

• Each input field in your Webflow form needs a Name attribute that matches exactly to HubSpot’s internal field names.
• In Webflow Designer, go to each input field, open Settings Panel, and assign the proper Name (not just the Placeholder or Label).
• Example:
• First Name field => Name: firstname
• Email field => Name: email
• Company field => Name: company

You can check HubSpot’s property names in your HubSpot account under Settings > Properties.

5. Optional: Add Hidden Fields for Tracking

If you want important HubSpot tracking (like UTM parameters or merging visitors with HubSpot cookies):

• Add Hidden Inputs for fields like hubspotutk (cookie tracking token), ipAddress, pageUrl, etc.
• Pull hubspotutk value from the hubspotutk cookie if you can with custom JavaScript.

6. Test the Form Thoroughly

• Publish your changes and fill out the form yourself.
• Check HubSpot under Marketing > Lead Capture > Forms > Submissions to confirm your submissions are arriving correctly.
• Check the field mappings to ensure all data is populating properly.

Summary

To connect Webflow forms (Saasplex X) to HubSpot without native integration, override the Webflow form action to post directly to HubSpot’s Forms API, ensure field names match HubSpot properties, and test submissions carefully. There’s no need for Zapier or third-party tools if done properly.