Skip to main content
The web snippet is the fastest way to track a website. It records page views and campaign context without requiring custom event code.

Before you start

You need permission to publish the site and your Datalyr workspace ID. In Datalyr, open Settings → Install. New workspaces also show the same snippet on the dashboard until the first event arrives.

Install the snippet

1

Copy your snippet

Open Settings → Install and copy the snippet shown for your workspace. The workspace ID is already filled in.
2

Paste it in the head

Add it inside the <head> of every page, before the closing </head> tag. Put it in the shared site template when possible.
3

Publish the site

A local or draft change cannot send production visits. Deploy or publish it before testing.
4

Visit the published page

Use a private window so the test starts with a clean visitor and session.
<!-- DATALYR — paste in <head> -->
<script defer src="https://track.datalyr.com/dl.js" data-workspace-id="YOUR_WORKSPACE_ID"></script>
Use the exact workspace ID shown in Datalyr. Do not reuse an ID from another workspace.

What starts automatically

The snippet records page views, sessions, anonymous visitors, URLs, referrers, UTM parameters, supported ad click IDs, and browser context. It also tracks route changes in single-page applications. Automatic tracking does not know who a visitor is or which product action matters to you. Add identify after sign-in and custom events for actions such as signup, lead submission, or checkout.

Install with npm

Use the package when your application owns its JavaScript lifecycle.
npm install @datalyr/web
import datalyr from '@datalyr/web'

datalyr.init({ workspaceId: 'YOUR_WORKSPACE_ID' })
await datalyr.ready()
Choose the snippet or npm package. Never initialize both on the same page.

Common framework placement

PlatformWhere to install
Next.jsRoot layout or a client-side analytics component loaded once
React or Vue SPAApplication entry point, initialized once
WordPressSite-wide header through the theme or a header-injection tool
Webflow or FramerGlobal custom code in the site head
Custom HTMLShared <head> template on every page
Do not place the snippet only on the confirmation page. Datalyr needs the landing visit to connect campaign context to the later conversion.

Verify the install

Open Events and look for a recent pageview with the URL you visited. If it is missing, confirm the published HTML contains dl.js, the workspace ID is correct, and an ad blocker or consent setting did not block analytics.
Seeing dl.js in page source only proves the tag was published. The setup is complete only when the event appears in Datalyr.
Next, run the full verification checklist.