Umbraco
Add Rybbit analytics to your Umbraco site
Umbraco renders pages with Razor templates stored as .cshtml files in the Views folder and edited in the backoffice under Settings > Templates. A fresh install has no templates until you create one, so the snippet goes into the master (layout) template that your page templates set as their Layout.
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 Umbraco
- In the backoffice, open the Settings section and expand Templates.
- Open the master template that the other templates use as their layout (named
Masterin Umbraco's own tutorial). If you have none yet, click ... next to Templates, choose Create, and move the shared<html>,<head>and<body>markup into it. - Add the tag before
</head>and click Save:
@using Umbraco.Cms.Web.Common.PublishedModels;
@inherits Umbraco.Cms.Web.Common.Views.UmbracoViewPage
@{
Layout = null;
}
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>@Model.Name</title>
<script src="https://app.rybbit.io/api/script.js?siteId=YOUR_SITE_ID" defer></script>
</head>
<body>
@RenderBody()
</body>
</html>- Check that each page template points at it, for example
Layout = "Master.cshtml";. Templates withLayout = null;render their own<head>and need the tag added directly.
Saving in the backoffice writes the same file to Views/Master.cshtml in the project, so you can also edit it in your IDE and commit it.
To keep the site ID out of the template, put it in appsettings.json and read it with @Configuration["Rybbit:SiteId"] after injecting IConfiguration.
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.jsreturns200and thatPOSTrequests 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
- Change not visible: Razor views are compiled on first request; if you edited the file outside the backoffice on a published site, restart the app or redeploy. Also clear any output cache or CDN in front of the site.
- Preview counts as visits: the backoffice Preview button renders your template with unpublished content, so editors' previews are tracked like any other visit. Wrap the tag in
@if (!UmbracoContext.InPreviewMode) { ... }to leave them out. - Backoffice is not tracked:
/umbracois a separate app that does not use your templates, so editing time never appears in Rybbit. - Several master templates: a multi-site install with one layout per site needs the tag in each, or in a partial view rendered from every layout with
@await Html.PartialAsync("Rybbit").
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.