More in Getting started
- Install TapCub on your website
- Migrate from Google Analytics 4 or Baidu Tongji
- Add a website, app or mini-program
- How do I add TapCub to WordPress?
- How do I add TapCub to Shopify?
- Where do I paste the TapCub tracking code?
- Can I install TapCub with Google Tag Manager?
- How do I check that TapCub is collecting data?
- Why does TapCub show no data after I installed it?
- What is a site, and how many can I add?
- Which time zone should I pick for a site?
- Which domains do I need to register?
- How do I keep my own visits out of the reports?
- Why does my visitor count differ from Google Analytics 4?
- Can I run TapCub alongside Google Analytics 4?
- How do I move my goals and events from GA4?
- Can I import my historical data from GA4?
- How do I add TapCub to Squarespace?
- How do I add TapCub to Wix?
- Which Content Security Policy rules does TapCub need?
- Do ad blockers block TapCub?
- How do I send events from my server?
- How do I install TapCub on React?
- How do I install TapCub on Nuxt?
- How do I install TapCub on Vue?
- How do I install TapCub on Next.js?
- How do I capture a HAR file for TapCub support?
- How do I create and manage API keys?
- How do I send events with the HTTP API?
- All guides in this category
Still have a question?
Could not find it? A person reads every message, usually within a few hours on business days.
Chat with usShort answer
Add the snippet once to the root HTML template or root layout. Route changes made with the History API are recorded automatically; hash-based routers need data-hash="true".
Where the tag goes
Copy your snippet from Web analyticsConfigurationSDK code. It already contains your site key and looks like this:
<script defer src="https://static.pathclue.com/client.js" data-site="YOUR_SITE_KEY"></script>Add it once, to the file that renders the document head for every route: index.html in a Vite or Create React App project, the root layout in Next.js or Nuxt. Do not load it inside a component that mounts per page.
How route changes are counted
The script listens to history.pushState, history.replaceState and the browser’s back and forward buttons, which is how React Router, Vue Router, Next.js and Nuxt change pages. Each new URL becomes a pageview, and the time spent on the previous route is recorded as it changes. A change that keeps the same URL is not counted twice.
| Router | What to do |
|---|---|
History mode (/pricing) | Nothing. This is the default for most frameworks. |
Hash mode (/#/pricing) | Add data-hash="true" to the tag so the part after # counts as the page. |
| Server-rendered pages without client routing | Nothing. Every navigation is a full page load. |
Calling tapcub.pageview() yourself after a route change is safe but unnecessary: the same URL is not sent twice.
Local development
On localhost the script sends nothing by default, so development traffic stays out of your reports. To test locally, see testing on localhost.
See also
Did this answer your question?
We use your answers to fix and expand this page.
Couldn’t send. Please try again in a minute.
Thanks for the feedback. We’ll use it to improve this page.You’ve already sent feedback on this page. Thanks.