Skip to Content
InstallationTracking Code

Tracking Code Installation

Add the Ghost Metrics tracking code directly to your website’s HTML.

Getting Your Tracking Code

  1. Log in to your Ghost Metrics dashboard
  2. Click the gear icon in the top right to access Administration
  3. Navigate to Tag Manager
  4. Select your container
  5. Copy the tracking code provided

Basic Installation

Add the following code to your website, just before the closing </head> tag:

<!-- Ghost Metrics Tag Manager -->
<script>
  var _mtm = window._mtm = window._mtm || [];
  _mtm.push({'mtm.startTime': (new Date().getTime()), 'event': 'mtm.Start'});
  (function() {
    var d=document, g=d.createElement('script'), s=d.getElementsByTagName('script')[0];
    g.async=true; g.src='https://example.ghostmetrics.cloud/js/container_XXXXXXXX.js'; s.parentNode.insertBefore(g,s);
  })();
</script>
<!-- End Ghost Metrics Tag Manager -->

Replace example.ghostmetrics.cloud and container_XXXXXXXX.js with the values from your Ghost Metrics dashboard.

Where to Add the Code

The tracking code should be added to every page you want to track. Most websites use a shared header template or layout file, so you typically only need to add it in one place.

Common Locations by Platform

  • WordPress — See our WordPress installation guide
  • Static HTML — Add to each page’s <head> section, or use a shared header include
  • React/Vue/Angular — Add to your index.html or main layout component
  • Google Tag Manager — See our GTM installation guide

Placement Best Practices

Why the <head> Section?

Placing the code in the <head> ensures tracking loads early in the page lifecycle. This captures visitors even if they leave before the page fully loads.

Asynchronous Loading

The tracking code loads asynchronously (g.async=true), meaning it won’t block your page from rendering. Your website’s performance won’t be affected.

Single Page Applications (SPAs)

For React, Vue, Angular, and other single-page applications, the basic tracking code will capture the initial page load. However, you’ll need additional configuration to track navigation between views.

Ghost Metrics Tag Manager can be configured to automatically detect route changes in most SPA frameworks. Contact support if you need assistance setting this up.

Content Security Policy (CSP)

If your website uses a Content Security Policy, you’ll need to allow scripts from your Ghost Metrics domain:

script-src 'self' https://example.ghostmetrics.cloud;

Replace example.ghostmetrics.cloud with your actual Ghost Metrics domain.

Next Steps

Last updated on
Key Differences from GA4Google Tag Manager