How Do I Add HubSpot Code to Webflow?

by

Adding HubSpot code to your Webflow website is a straightforward process that can greatly enhance your marketing efforts. Whether you want to track conversions, integrate forms, or implement other HubSpot features, this tutorial will guide you through the steps required.

Step 1: Accessing HubSpot Code

Before you can add any HubSpot code to your Webflow site, you need to access the relevant code from your HubSpot account. Here’s how:

  1. Login to your HubSpot account.
  2. Navigate to the “Settings” tab.
  3. Select “Tracking Code” from the left-hand menu.
  4. Copy the provided code snippet.

Step 2: Adding Code to Webflow

Now that you have the necessary HubSpot code, it’s time to integrate it into your Webflow site. Follow these steps:

  1. Login to your Webflow account and open your desired project.
  2. Select the page or template where you want to add the code.
  3. Navigate to the “Page Settings” panel on the right-hand side.
    • If you’re adding the code to a specific page:

      In the “Page Settings” panel, scroll down until you find “Custom Code”. Paste the copied HubSpot code into the “<head>” section.

      You’re almost there!

      Click on “Publish” to make the changes live.

    • If you’re adding the code to a template:

      In the “Page Settings” panel, select the “Custom Code” tab.

      Remember to click on “Update Template” to save your changes.

Step 3: Verifying HubSpot Integration

After adding the code, it’s essential to verify that HubSpot is properly integrated with your Webflow site. Follow these steps:

  1. Publish your website or page after making the above changes.
  2. Visit your live website or page in a new browser tab.
  3. Right-click on the page and select “View Page Source” or press “Ctrl+U” (Windows) or “Cmd+Option+U” (Mac).
  4. Search for “HubSpot” in the page source.
    • If you find instances of “HubSpot”, congratulations! Your integration was successful.
    • If you don’t see any instances of “HubSpot”, double-check that you correctly added the code and republish your site.

In Conclusion

Congratulations! You have successfully added HubSpot code to your Webflow website.

Now you can unlock numerous marketing features and track important metrics seamlessly. Remember, if you want to add additional HubSpot functionality in the future, simply repeat these steps for each desired feature. Happy marketing!