Hugo

Hugo builds every page from templates under layouts/, so the cleanest place for the snippet is a partial template that your base template includes on every page.

Get your tracking snippet

In your Rybbit dashboard, open Site Settings → Tracking Script and copy your snippet. It looks like this:

<script src="https://app.rybbit.io/api/script.js?siteId=YOUR_SITE_ID" defer></script>

YOUR_SITE_ID is the numeric ID of your site. If you self-host Rybbit, app.rybbit.io is the domain of your own instance.

Add the snippet to Hugo

Add your site ID under params in your Hugo config (hugo.toml, or config.toml in older Hugo versions). rybbitInstanceURL is only needed if you self-host:
hugo.toml
```
[params]
  rybbitSiteID = "YOUR_SITE_ID"
  rybbitInstanceURL = "https://app.rybbit.io"
```
Create layouts/partials/rybbit-analytics.html (create the layouts/partials/ directory if it does not exist):
layouts/partials/rybbit-analytics.html
```
{{ if and (not hugo.IsServer) .Site.Params.rybbitSiteID }}
  <script src="{{ .Site.Params.rybbitInstanceURL | default "https://app.rybbit.io" }}/api/script.js?siteId={{ .Site.Params.rybbitSiteID }}" defer></script>
{{ end }}
```
not hugo.IsServer skips the script during hugo server, so local development is not tracked. The rybbitSiteID check keeps the tag out of builds that have no ID configured.
Include the partial from your base template, typically layouts/_default/baseof.html, inside <head>. If your theme owns baseof.html, copy it into your project's layouts/_default/ first so the theme can be updated without losing the change; a theme footer partial such as layouts/partials/footer.html also works.
layouts/_default/baseof.html
```
<head>
  ...
  {{ partial "rybbit-analytics.html" . }}
</head>
```
Build with hugo and deploy the generated public/ directory.

Verify installation

Open your live site in a new tab and click through a few pages. Within a few seconds the pageviews appear in the Rybbit dashboard.

If nothing shows up:

View the page source and search for script.js?siteId= to confirm the snippet is on the page.
Open the browser Network tab and check that script.js returns 200 and that POST requests go to /api/track.
Disable ad blockers, or set up a proxy so the script loads from your own domain.
See the script troubleshooting guide for other common causes.

Troubleshooting

Snippet missing from the page source: hugo server never emits it because of the hugo.IsServer guard. Check the output of a production hugo build instead.
Theme overrides: a file at layouts/_default/baseof.html in your project takes precedence over the theme's copy, so make sure you edited the one Hugo actually renders.

Next steps

Track custom events such as signups, purchases and button clicks.
Identify users to connect sessions to accounts.
Proxy the script through your own domain to bypass ad blockers.
Script attributes let you skip or mask URLs and tag events.

Get your tracking snippet

Add the snippet to Hugo

Verify installation

Troubleshooting

Next steps

On this page