Installing the Tracker
The askbowtie tracker is a lightweight script you add to your website. One line of code, works everywhere.
Recommended: install with Zaraz or a tag manager
The fastest way in. You paste one line into a dashboard, hit publish, and you're done. No code deploy, no theme files, no waiting on a release.
Cloudflare Zaraz (best if your site is on Cloudflare)
- Cloudflare dashboard, your domain, Zaraz, then Tools.
- Add a tool, choose Custom HTML, and paste:
<script src="https://askbowtie.com/bowtie.js" async></script> - Set the trigger to fire on all page views, then save and publish.
Zaraz manages the tag for you and loads third-party scripts efficiently, off your main thread, so it stays out of your page's critical path. On a Cloudflare site it's the cleanest install there is: nothing to deploy, and you can change or remove it from the dashboard.
Google Tag Manager (works anywhere)
- New tag, choose Custom HTML.
- Paste
<script src="https://askbowtie.com/bowtie.js" async></script>. - Trigger: All Pages. Set the firing priority high so it loads early.
- Submit and publish the container.
Direct install (script tag)
Prefer to edit your HTML? Add this to your site's <head> tag:
<script src="https://askbowtie.com/bowtie.js" async></script>
That's it. The script loads asynchronously (zero render blocking), captures errors, performance, sessions, and events. It updates automatically, so you never need to touch it again.
Editing the <head> directly catches errors a fraction earlier than a tag manager does. For most sites that difference is negligible, so pick whichever is easier for you.
Advanced Install (Inline Loader)
For sites where capturing ultra-fast bounces matters (high-traffic landing pages, paid ad destinations), the inline loader fires a beacon immediately on page load before the full script loads.
Add both scripts inside your <head> tag:
<script>
(()=>{if(document.cookie.match(/wordpress_logged_in_/))return;
const T=18e5,l=+localStorage.getItem('askbowtie_last_activity')||0,n=Date.now(),o=localStorage.getItem('bowtie_session');
const s=(o&&l&&(n-l)<T)?o:Math.random().toString(36).slice(2,15);
localStorage.setItem('bowtie_session',s);localStorage.setItem('askbowtie_last_activity',n);
window._bowtie_session=s;window._askbowtie_queue=window._askbowtie_queue||[];window._askbowtie_pl=1;
navigator.sendBeacon('https://askbowtie.com/api/ingest',JSON.stringify({
domain:location.hostname,session_id:s,events:[{event_type:'page_load',page:location.pathname,ts:n/1000,referrer:document.referrer||null}]
}));})();
</script>
<script src="https://askbowtie.com/bowtie.js" async></script>
What it does:
- First pageview is captured immediately via
sendBeacon— no waiting for the full script to load - Sessions respect a 30-minute inactivity timeout
- WordPress admin users are automatically excluded
- The full tracker loads async without blocking rendering
Trade-off: The inline snippet is frozen at install time. If we update the beacon format in the future, you'd need to update the snippet. The recommended one-liner updates automatically.
You can copy either version from your dashboard settings.
Where to Place the Script
Inside <head> (recommended)
<head>
<meta charset="UTF-8">
<title>Your Site</title>
<script src="https://askbowtie.com/bowtie.js" async></script>
</head>
Why <head> is ideal:
- Catches errors that happen during page load
- Tracks user interactions from the very first moment
- Ensures no early events are missed
Before </body> (also works)
If you can't add scripts to the <head>, placing it before the closing </body> tag works too. The only difference: errors during initial page rendering won't be captured. For most sites, this is negligible.
Install on Every Page
Add the tracker to your entire website, not just specific pages.
Why site-wide matters:
-
Full user journeys — Users rarely land on one page and convert. They browse, compare, and return. Site-wide tracking captures the complete path.
-
Error context — An error on
/pricingmight cause a user to abandon on/checkout. Without tracking both, you'd never connect the two. -
Accurate conversion attribution — Conversions are tied to sessions, not pages. If the tracker only runs on landing pages, you lose visibility into what happens next.
-
Funnel analysis — Goals track multi-step flows across pages. Missing pages create gaps in the data.
Most platforms make site-wide installation easy through templates, themes, or global scripts.
Installation by Platform
Direct HTML / Custom Sites
Edit your site's main template or layout file. Look for the file that contains your <head> tag — often called header.php, base.html, layout.html, or similar.
Add the script inside <head>.
If your site uses a static site generator (Jekyll, Hugo, Eleventy, Astro, etc.), add it to your base layout template.
WordPress
Using a code snippets plugin (easiest):
- Install a plugin like "Insert Headers and Footers" or "Code Snippets"
- Find the setting to add code to the header/head section
- Paste the script
- Save
The script will load on every page automatically.
Using your theme:
Add the script directly to your theme's header.php file inside the <head> tag. Use a child theme so updates don't overwrite it.
Admin filtering: The tracker automatically detects WordPress logged-in users and excludes them from tracking. Your own browsing won't pollute your data — no configuration needed.
Shopify
- Go to your Shopify admin
- Navigate to Online Store → Themes → Edit code
- Find the main layout file (typically
theme.liquid) - Locate the
<head>section - Add the script before
</head> - Save
The script will load on all pages including checkout (if your plan allows theme modifications there).
Cloudflare Zaraz & Google Tag Manager
The quickest path on any platform, and the recommended one. See Install with Zaraz or a tag manager at the top of this page for both.
Single-Page Applications (React, Vue, Next.js, etc.)
Add the script to your main HTML template (index.html, _document.js, app.html, etc.):
<head>
<script src="https://askbowtie.com/bowtie.js" async></script>
</head>
The tracker automatically detects client-side navigation and tracks page changes within your SPA. No additional configuration is needed for React Router, Vue Router, Next.js, or similar frameworks.
For custom event tracking (conversions, goals), see the JavaScript API guide.
Verifying Installation
After adding the script:
- Visit your website in a browser
- Open your askbowtie dashboard
- You should see your session appear within seconds
You can also verify from Settings → Install Tracker, which shows a live status indicator.
If data isn't showing:
- Check that the script tag is present (View Source or DevTools → Network tab)
- Ensure your domain matches what you registered
- Confirm your email has been verified
Script Details
| Property | Value |
|---|---|
| Size | Under 5KB total |
| Loading | Async — zero render blocking |
| Cookies | None — fully cookieless |
| Dependencies | None |
| Privacy | No PII collected, no cookies, GDPR-friendly |
Need Help?
If you're stuck or have an unusual setup, reach out to [email protected].