How to Connect Webflow with HubSpot Without Extra Tools

Connect Webflow to HubSpot and explain why this direct integration is perfect for small teams, startups, and businesses looking for a streamlined workflow.

‍

Why connect Webflow to HubSpot?

‍

Webflow gives you complete control over your website design, while HubSpot is a powerful CRM and marketing automation platform. Connecting the two allows you to:

• Track visitor behavior and performance in HubSpot Analytics
• Capture leads directly from your Webflow page into your HubSpot CRM
• Launch email workflows and campaigns from submitted forms
• Manage all your marketing and sales data in one place
• And the best part? You can do it without paying for additional integration tools.

‍

Add HubSpot Tracking Code to Webflow

‍

The first step to connecting Webflow to HubSpot is to install the HubSpot tracking code. This allows HubSpot to track your website traffic and user behavior.

How to do it:

• Log in to your HubSpot account.
• Go to Settings > Tracking & Analytics > Tracking Code.
• Copy the tracking code you received.
• In your Webflow dashboard, open your project and go to Project Settings > Custom Code > Header Code.
• Paste the HubSpot tracking code and save.
• Publish your website.

HubSpot will now automatically start collecting data from your Webflow website.

‍

Embed HubSpot forms directly into Webflow

‍

If your goal is to capture leads, embedding HubSpot forms into Webflow is the most efficient approach. This way, all submitted requests go directly into your HubSpot CRM.

Steps to embed HubSpot forms:

• In HubSpot, go to Marketing > Lead Generation > Forms and create a new form.
• Once your form is ready, click Share > Embed Code.
• Copy the provided code.
• In Webflow Designer, drag the Embed element onto the page where you want the form.
• Paste the HubSpot form code inside the Embed element.
• Publish your page.

Every time a visitor fills out a form, their data is automatically saved in HubSpot, making lead management seamless.

‍

Add HubSpot calls to action and popups

‍

In addition to forms, you can also integrate HubSpot calls to action and popups into Webflow to increase engagement and conversions.

Here's how:

• Create a call to action or popup in HubSpot.
• Copy the embed code.
• Place it in Webflow using the Embed element or custom code section.

This ensures that all interactions are tracked in HubSpot without relying on third-party connectors.

‍

Benefits of Direct Integration

By connecting Webflow directly to HubSpot, you:

• Avoid the additional costs of tools like Zapier or Make
• Keep your workflow simple and efficient
• Ensure faster site performance without additional scripts
• Have more control over how your data flows between Webflow and HubSpot

‍

Limitations to keep in mind

‍

• While direct integration is perfect for most use cases, it does have some limitations:
• Advanced automations may still require HubSpot's API or third-party tools
• Some custom workflows may be more difficult to manage manually
• However, for most agencies, startups, and small businesses, this method is more than sufficient.

‍

Connecting Webflow to HubSpot doesn't have to be complicated or expensive. By adding HubSpot tracking code, embedding forms, and integrating calls to action, you can manage your marketing and sales directly in HubSpot without using any additional tools.