askbowtie

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)

  1. Cloudflare dashboard, your domain, Zaraz, then Tools.
  2. Add a tool, choose Custom HTML, and paste:
    <script src="https://askbowtie.com/bowtie.js" async></script>
  3. 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)

  1. New tag, choose Custom HTML.
  2. Paste <script src="https://askbowtie.com/bowtie.js" async></script>.
  3. Trigger: All Pages. Set the firing priority high so it loads early.
  4. 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:

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:

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:

  1. Full user journeys — Users rarely land on one page and convert. They browse, compare, and return. Site-wide tracking captures the complete path.

  2. Error context — An error on /pricing might cause a user to abandon on /checkout. Without tracking both, you'd never connect the two.

  3. 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.

  4. 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):

  1. Install a plugin like "Insert Headers and Footers" or "Code Snippets"
  2. Find the setting to add code to the header/head section
  3. Paste the script
  4. 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

  1. Go to your Shopify admin
  2. Navigate to Online Store → Themes → Edit code
  3. Find the main layout file (typically theme.liquid)
  4. Locate the <head> section
  5. Add the script before </head>
  6. 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:

  1. Visit your website in a browser
  2. Open your askbowtie dashboard
  3. 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:


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 support@askbowtie.com.