Blog - Vaulted

HubSpot and Squarespace: Our Easy-To-Follow Guide

Written by Matthew Deal | Sep 1, 2021 1:38:33 AM

HubSpot and Squarespace work together well.

The popularity of easy web design content management systems like with Squarespace combined with the power of HubSpot has become a popular combination in many business circles. That said, without working knowledge of both platforms, it can be hard to know how to best take advantage of using both systems.

With that in mind, I’ve assembled this quick guide on using HubSpot and Squarespace.

How to Integrate HubSpot and Squarespace Video

In case you don’t feel like reading through a diatribe of HubSpot and Squarespace instruction, I’ve added the video above to walk you through it above.

Advantages of Choosing HubSpot and Squarespace

Together, HubSpot and Squarespace offer a range of advantages for many organizations with limited resources and that need to do most of the work themselves:

  1. Ease of Change. One of the biggest advantages of Squarespace is that you don’t need to hire a developer to do most of the changes to your website. You can use the themes right out-of-the-box to create a workable web presence for your business. As a part of that, adding content and making changes is as easy as logging into the platform.
  2. Lower Staff Requirements (and Spend). Having any website or digital property means one thing: maintenance. You’ll need to have someone on staff to make changes, update service offerings, write blog posts, and more. Choosing Squarespace means you don’t really need to hire a developer, worry about themes, or any of the system maintenance custom websites can require.
  3. Easy Integration. We’ll dive into this further below, but there’s no special requirements for HubSpot and Squarespace integration. Like many build-your-own websites, adding custom code for widgets or other integrations is made easy in the Squarespace system— no additional tools required.

Disadvantages of Squarespace and HubSpot

While both systems lean towards the less technical side, there are some potential drawbacks of choosing Squarespace and HubSpot.

  1. No Native integration. There’s technically no native integration between HubSpot and Squarespace. In other words, they don’t really speak to each other without doing a little technical work.
  2. Duplicate Form Functionality. This isn’t so much a problem as it is annoying. In HubSpot and Squarespace, you’ll need to choose whether you want to use HubSpot forms or Squarespace forms. Each involve their own limitations, but ultimately you’ll lose some functionality from either Squarespace or HubSpot. So, you’ll have to make an informed choice about which form system you would rather use.
  3. Code Injection. Again, because there’s no native integration between Squarespace and HubSpot, you’ll need to installed your HubSpot tracking code through code injection. This is largely a copy-and-paste thing, but it can be a little daunting for some users.

Prerequisites for the Integration

There are a few prerequisites you’ll need to have access to setup Squarespace and HubSpot:

  1. Access to Code Injection. As of this writing, the lowest tier of Squarespace (Basic) doesn’t allow code injection, so you’ll need access to one of the more premium plans.
  2. Admin Permissions in HubSpot. You’ll need the correct level of access in your HubSpot account to access your tracking code.
  3. Use of Squarespace Forms. You can technically embed HubSpot forms in Squarespace, but it’s important to be able to have access to both systems to get the most out of the platform.

Once you have all of these in place, you’re ready to set-up adding HubSpot into your Squarespace website.

How to setup Squarespace and HubSpot

Even if the idea of mucking around in code makes you nervous — I’m going to say that this is a pretty safe think to try on your own (even if you’ve never done it before).

Because it’s as simple as copying from HubSpot and pasting into Squarespace, it’s definitely a task anyone can do, as long as you take it step-by-step.

1. Find your HubSpot Tracking Code

First thing is first: you’ll need to grab your HubSpot tracking code. This code is found in the Tracking and Analytics tab under settings under Tracking Code.

HubSpot’s tracking code is easy to install on Squarespace.

Once you find your code—copy it.

The HubSpot tracking code is an essential tool that enables the collection of valuable contact data from your Squarespace forms and feeds it directly into your HubSpot account. This data includes essential information such as form submissions, contact behavior, and session details, which can be used to optimize your inbound marketing strategy and improve lead generation.

2. Log Into Squarespace and Find “Code Injection”

Code injection will allow you to install the HubSpot code.

Under the advanced section of Squarespace settings, you’ll find Advanced which, if you’re on the correct plan, should show Code Injection, which you can then select.

Code injection refers to the ability to insert custom code, such as HTML, CSS, or JavaScript, into the template or specific pages of a Squarespace website. Squarespace provides this functionality to allow users to customize their website's design and functionality beyond the options available through the built-in editor.

You absolutely want to be careful using this, but it's pretty much the only method of getting Squarespace and HubSpot to work together.

Code injection can be useful for adding custom elements, modifying the appearance of specific pages, integrating third-party tools or services, or implementing advanced features not natively supported by Squarespace. It provides a way to extend the capabilities of a Squarespace website and tailor it to specific requirements.

3. Paste your HubSpot Tracking Code in Code Injection

If you can copy and paste, you can perform this task.

Once you’re there, copy and paste your code into the first block Header.

Placing this code in this header section automatically executes that code on every page on the site. This is important because you want this for the purposes of tracking data in HubSpot.

This HubSpot tracking code provides valuable insights into website traffic, user behavior, and engagement. The collected data is then sent to the HubSpot platform for analysis, enabling businesses to personalize user experiences, automate marketing workflows, and optimize lead generation efforts.

Advanced Configuration: Google Tag Manager

What I've presented here is one of the most basic configuration options for Squarespace and HubSpot (one that's likely accessible to a vast majority of users of both systems).

However if you are technically savvy, I do recommend that the majority of users leverage a tag manager system for marketing codes (which in most cases is going to be Google Tag Manager).

The End Result

Once you’ve pasted that in and make sure it is saved, the result is that HubSpot should work correctly with Squarespace. You should see analytics data on:

  • Sessions
  • Contact Behavior
  • Form Submissions

The only, extremely minor, caveat is that, unlike pages that are in HubSpot, HubSpot won’t be able to tell you what pages the forms are on.

Need Help with HubSpot and Squarespace?

Setting up HubSpot and Squarespace is often the starting point in a longer journey towards growth. Being able to leverage both systems is critical for leveraging the flexibility of Squarespace with the robust marketing and sales tools in HubSpot.

Still have more HubSpot strategy questions? We can help.