How to Integrate Framer with HubSpot and Get Deep User Metrics

Integration with HubSpot

Hello! I’m new at Framer and so far it’s been amazing so we want to use it for the website of the company where I work since it will be very easy for us to maintain the content and update the page on a daily basis.

It’s a small site with nothing more complicated than just text, photos and a contact form. It will also have a third party chat widget that we want like to use too.

I would like to know if it’s possible to integrate it with HubSpot and other tools for keep a track of the metrics of the site.

We have a domain already that we could transfer to Framer with no issue but we want to make sure we could have a deep knowledge of how the user interacts with our site. Thanks in advance for your answer!

The short answer is:

Framer + HubSpot Integration for Contact Forms & CRM

Framer integrates directly with HubSpot forms, and you can achieve deep, reliable metrics tracking using a combination of Google Tag Manager (GTM) and a server-side tagging provider like Stape or Google Cloud Platform (GCP).

This setup is the most powerful and cost-effective solution for a small site, as it future-proofs your data collection against browser restrictions and ensures your form submissions and other user interactions are accurately sent to HubSpot and other marketing tools, giving you the in-depth knowledge of user behavior you’re looking for.

The long answer is:

It’s fantastic that you’re enjoying Framer; it’s a great tool for small, maintenance-friendly sites like yours, and transferring your domain is straightforward.

For your contact form, Framer has a dedicated HubSpot component where you can easily embed a form created in your HubSpot account simply by entering its portal ID and form ID.

This ensures your leads go straight into HubSpot, but to get a “deep knowledge of how the user interacts with your site,” especially around that form and your chat widget, you need a robust tracking strategy beyond Framer’s built-in analytics.

The best way to achieve this is by using a server-side tagging architecture with Framer APIs, the HubSpot API, Google Tag Manager, and a hosting service like Stape.

You’ll first install the GTM web container code into your Framer site’s custom code settings (in the and sections) which acts as a data layer.

Then, you’ll use GTM to capture all relevant user actions, such as page views, clicks, and, most importantly, form submissions.

For the HubSpot form, you can utilize the onFormSubmit callback in the form’s embed code to push an event like form_submission to the data layer when a lead is successfully captured.

You can use similar methods to fire a chat_initiated event when the third-party chat widget is used, leveraging Framer’s custom code capabilities to listen for events in the widget’s API.

From the GTM web container, you then send this rich first-party data to a GTM server container.

This is where a solution like Stape or your own GCP setup comes in; they host the server container, which is where your tracking really gets powerful.

Stape, for example, is a cost-effective, managed solution that hosts your GTM server on Google Cloud Platform for a fraction of the price of the three-server production environment Google usually recommends, and it includes a generous free tier that might be all you need for a small site.

In your GTM server container, you would configure a HubSpot API tag that takes the clean, rich data you sent from your website and sends it directly to the HubSpot API, creating a new contact or updating an existing one with all the associated tracking data like source, medium, and conversion events, completely bypassing any client-side browser restrictions or ad blockers that might otherwise prevent your data from reaching HubSpot.

You can also configure other tags in the server container to send the same conversion events to Google Analytics, Meta Conversions API, and any other tool, all from one reliable source.

This method of server-side tracking using Framer for event capture and a service like Stape for hosting is an excellent and affordable way to get a deep, privacy-compliant, and highly accurate view of your user journey, solving all your metrics and integration needs.

About The Author