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

To connect Webflow forms (from the Saasplex X template) to HubSpot without using Webflow’s native integration, you’ll need to use HubSpot’s Forms API or the HubSpot Form Embed code.

1. Use HubSpot's Form Embed Code (No Native Integration Needed)

• In HubSpot, go to Marketing > Lead Capture > Forms.
• Create a new form, or choose an existing one.
• In the form settings, click Embed and copy the embed script.
• In Webflow, locate the form section in your page (from Saasplex X).
• Delete the existing Webflow form element if you don’t need it.
• Drag an Embed element into the desired section of the page.
• Paste the HubSpot form embed code into the Embed element.

2. Keep Webflow’s Form and Use HubSpot’s Forms API (More Complex)

If you want to use the existing Webflow-designed form and just send its data to HubSpot:

• You’ll need:

• HubSpot Form GUID and Portal ID.

• A custom JavaScript function to send form data to HubSpot’s Forms API via AJAX.

• In Webflow:

• Keep the Saasplex X form structure.

• Add custom attributes or IDs to match your fields with HubSpot field names.

• Go to Page Settings > Footer Custom Code and write a script that:

  • Intercepts form submit
  • Packages the input data
  • Posts to HubSpot’s endpoint: https://forms.hubspot.com/uploads/form/v2/[portal_id]/[form_guid]
  • Ensures content-type is application/x-www-form-urlencoded.

Note: This method requires a good understanding of JavaScript, the browser’s same-origin policies, and error handling. You may also need to handle CORS.

3. Use a Middleware Like Make (Integromat) or Zapier

• Create a scenario (Make) or Zap (Zapier) that:

• Triggers on a new Webflow form submission.

• Pushes the data to HubSpot using a HubSpot “Create Contact” or “Submit form” action.

• Steps involve:

• Creating a Webflow trigger for form submission.

• Connecting it to your HubSpot account.

• Mapping values from Webflow to HubSpot fields.

This avoids coding but requires a free (or paid) integration platform like Make or Zapier.

Summary

To connect Saasplex X Webflow forms to HubSpot without native support, your best no-code option is to embed a HubSpot form using their script. For more control and design freedom, use the HubSpot Forms API with custom JavaScript. Middleware platforms like Zapier or Make offer a balanced middle ground without coding.