Install guides

Every platform needs the same single tag in the head of every page. This page shows where it goes. Your own site id is already filled in under Settings, Tracking.

<script defer data-site="YOUR_SITE_ID" src="https://stats.shedi.app/script.js"></script>

HTML#

Paste the tag inside <head> on every page, or in the shared layout or include your pages use.

Next.js (App Router)#

Use next/script in the root layout. Route changes are tracked automatically, because Next's router uses history.pushState.

// app/layout.tsx
import Script from 'next/script';

export default function RootLayout({ children }: { children: React.ReactNode }) {
  return (
    <html lang="en">
      <body>
        {children}
        <Script defer strategy="afterInteractive" data-site="YOUR_SITE_ID" src="https://stats.shedi.app/script.js" />
      </body>
    </html>
  );
}

React and Vite#

Add it to index.html, not to a component. Client-side navigation is tracked on its own.

<!-- index.html -->
<head>
  <meta charset="UTF-8" />
  <title>My app</title>
  <script defer data-site="YOUR_SITE_ID" src="https://stats.shedi.app/script.js"></script>
</head>

Vue and Nuxt#

With Vue and Vite, put the tag in index.html as above. In Nuxt, add it to the app head:

// nuxt.config.ts
export default defineNuxtConfig({
  app: {
    head: {
      script: [{ src: 'https://stats.shedi.app/script.js', defer: true, 'data-site': 'YOUR_SITE_ID' }],
    },
  },
});

Svelte and SvelteKit#

Put the tag in src/app.html, inside <head>.

<!-- src/app.html -->
<head>
  %sveltekit.head%
  <script defer data-site="YOUR_SITE_ID" src="https://stats.shedi.app/script.js"></script>
</head>

Astro#

Add it to your base layout. is:inline stops Astro from bundling or rewriting the tag.

---
// src/layouts/Base.astro
---
<html lang="en">
  <head>
    <script is:inline defer data-site="YOUR_SITE_ID" src="https://stats.shedi.app/script.js"></script>
  </head>
  <body><slot /></body>
</html>

WordPress#

The simplest way is a header-and-footer plugin such as WPCode: add a new snippet of type HTML, paste the tag, set the location to Site Wide Header, and activate it. Without a plugin, paste the tag into your child theme's header.php just before </head>.

Webflow#

Open Site settings, Custom code, paste the tag into Head code, save, and publish. Custom code needs a paid Site plan.

Framer#

Open Site settings, General, Custom code and paste the tag into End of head tag. Publish the site.

Shopify#

Open Online Store, Themes, Edit code, open theme.liquid, and paste the tag just before </head>.

Wix#

Open Settings, Custom code, click Add custom code, paste the tag, choose Head and All pages, and apply. Custom code needs a Premium plan.

Squarespace#

Open Settings, Advanced, Code injection and paste the tag into Header. Code injection needs a Business plan or higher.

Ghost#

Open Settings, Code injection and paste the tag into Site header.

Carrd#

Carrd needs a Pro plan for custom code. Add an Embed element, set its type to Code and its style to Hidden, paste the tag, and publish.

Notion sites (Super, Potion)#

Notion's own public pages can't run custom code. Tools that publish a Notion page as a site, such as Super and Potion, have a code setting in the site's settings: paste the tag into its head (header) code field and publish. If you can't find it, search the tool's help for “custom code in head”.

Bubble#

Open Settings, SEO / metatags and paste the tag into Script/meta tags in header. Bubble apps are single-page, and the script follows their route changes through the history API.

Google Tag Manager#

Create a Custom HTML tag with the snippet below, fire it on All Pages, and publish the container. This version creates the script element itself, so the data-site attribute always reaches the script.

<script>
  (function () {
    var s = document.createElement('script');
    s.defer = true;
    s.src = 'https://stats.shedi.app/script.js';
    s.setAttribute('data-site', 'YOUR_SITE_ID');
    document.head.appendChild(s);
  })();
</script>

Common issues#

Nothing appears after installing

Check that the tag is on the live, published page (view source and search for script.js), then follow troubleshooting.

My builder strips the data-site attribute

Use the Google Tag Manager version above (it sets the attribute from JavaScript), or the builder's “custom script” field that keeps the tag as written.

Page views double-count on a single-page app

Install the script once, in the shell page. Installing it in a component that mounts on every route adds a second listener.