HubSpot
Add OnyxMetric analytics to your HubSpot site
HubSpot Content Hub has a Site header HTML setting that injects code into the <head> of every website page, landing page, blog post, and knowledge base article on a domain.
Copy your tracking snippet
In OnyxMetric, open your site's Site Settings and copy the tracking script. It looks like this:
<script src="https://app.onyxmetric.com/api/script.js?siteId=YOUR_SITE_ID" async></script>YOUR_SITE_ID is the numeric ID of your site.
Add the snippet to HubSpot
This covers all HubSpot-hosted content on a domain.
- Click the settings icon in HubSpot's top navigation bar.
- In the left sidebar, go to Content > Pages.
- Pick a domain from the dropdown, or stay on the default settings to apply the code to every domain.
- Paste the snippet into Site header HTML.
- Click Save.
If a domain has Override default settings turned on, the default header code no longer reaches it. Add the snippet to that domain's own settings too.
Use this to track one page, or when someone else controls the domain settings.
- Open Content > Website Pages (or Landing Pages, Blog, Knowledge Base) and open the page in the editor.
- Open the Settings menu and choose Advanced.
- Under Additional code snippets, paste the snippet into Head HTML.
- Click Update or Publish.
Per-page head HTML is added on top of the site header HTML. A page that uses both loads the script twice, so pick one.
Check that it works
Load your live site and click through a few pages. Pageviews show up in the OnyxMetric dashboard within seconds.
If nothing arrives:
- View the page source and search for
script.js?siteId=to confirm the tag is present. - In the browser's Network tab, check that
script.jsreturns200and that requests go to/api/track. - Turn off ad blockers, or proxy the script through your own domain.
- Read script troubleshooting for other causes.
Track form submissions
HubSpot forms submit without a full page reload, so record them as a custom event. Listen for HubSpot's form callback message:
<script>
window.addEventListener("message", function (event) {
if (event.data.type === "hsFormCallback" && event.data.eventName === "onFormSubmitted") {
window.onyx.event("form_submitted", { formId: event.data.id });
}
});
</script>See Track custom events for the full event API.
Troubleshooting
- Tag missing on one domain: header HTML is set per domain. Check whether that domain overrides the defaults.
- Duplicate pageviews: the same page has the snippet in both site header HTML and its own Head HTML. Remove one.
- Editor previews: previews load the script like any visit, so avoid browsing them with tracking on.
- Quotes: header HTML set at domain level also loads on HubSpot quotes hosted on that domain.
Next steps
- Track custom events such as signups, purchases, and clicks.
- Identify users to tie sessions to accounts.
- Proxy the script through your own domain to get past ad blockers.
- Script attributes let you skip or mask URLs and tag events.