Install Tracking Script

Now that you've added your website, it's time to install the tracking script. This lightweight script (under 2KB) will start collecting privacy-friendly analytics data immediately.

Get Your Tracking Script

Go to your website's settings in the dashboard
Click on the "Installation" tab
Copy your unique tracking script

Your script will look something like this:

<script src="https://www.hectoranalytics.com/script.js" defer></script>

Installation

Before Closing Body Tag

Place the script just before the closing </body> tag:

<!DOCTYPE html>
<html>
  <head>
    <title>Your Website</title>
  </head>
  <body>
    <!-- Your content -->

    <!-- Hector Analytics -->
    <script src="https://www.hectoranalytics.com/script.js" defer></script>
  </body>
</html>

Platform-Specific Guides

WordPress

Plugin

Puglin for WordPress coming soon.

React/Next.js

Add to your main layout or _app.js:

import Head from "next/head";

export default function MyApp({ Component, pageProps }) {
  return (
    <>
      <Head>
        <script
          async
          src="https://analytics.hectoranalytics.com/script.js"
          data-website-id="your-unique-id"
        />
      </Head>
      <Component {...pageProps} />
    </>
  );
}

Vue.js

Add to your main index.html or in the app component:

<!-- In public/index.html -->
<head>
  <script
    async
    src="https://analytics.hectoranalytics.com/script.js"
    data-website-id="your-unique-id"
  ></script>
</head>

Gatsby

Add to gatsby-ssr.js or gatsby-browser.js:

export const onRenderBody = ({ setHeadComponents }) => {
  setHeadComponents([
    <script
      key="hector-analytics"
      async
      src="https://analytics.hectoranalytics.com/script.js"
      data-website-id="your-unique-id"
    />,
  ]);
};

Shopify

Go to Online Store → Themes
Click "Actions" → "Edit code"
Open theme.liquid
Add the script before </head>

Webflow

Go to Project Settings → Custom Code
Paste the script in "Head Code"
Publish your site

Advanced Configuration

Custom Domain (Self-hosted)

If you're self-hosting Hector Analytics:

<script
  async
  src="https://your-domain.com/script.js"
  data-website-id="your-unique-id"
></script>

Environment-Specific Tracking

For different environments (dev, staging, prod):

<!-- Development -->
<script
  async
  src="https://analytics.hectoranalytics.com/script.js"
  data-website-id="dev-site-id"
></script>

<!-- Production -->
<script
  async
  src="https://analytics.hectoranalytics.com/script.js"
  data-website-id="prod-site-id"
></script>

✅ Tracks page views automatically ✅ Collects visitor metrics (location, device, browser) ✅ Records referral sources ✅ Measures session duration ✅ Detects and filters bot traffic ✅ Works without cookies ✅ Respects Do Not Track headers ✅ Anonymizes IP addresses

❌ Does NOT collect personal data ❌ Does NOT use cookies by default ❌ Does NOT track across websites ❌ Does NOT slow down your site

Performance Impact

File size: Under 2KB gzipped
Load time: Asynchronous, non-blocking
Bandwidth: Minimal data transmission
Privacy: No cookies, no personal data

Troubleshooting

Script not loading?

Check that the URL is correct
Verify your website ID
Ensure there are no ad blockers interfering

No data appearing?

Wait a few minutes for data to process
Check that you're visiting the correct domain
Verify the script is in the <head> section

Ready to Verify?

Great! Now let's verify your installation to make sure everything is working correctly.

🔒 Privacy Note: The script automatically anonymizes all data and respects user privacy preferences. No personal information is collected or stored.