How to add analytics to any website

You don't need to be a developer to add analytics to your website. The Pieowl script tag works on any site, whether you use WordPress, Webflow, Squarespace or plain HTML. In about five minutes, you'll have analytics running on your site.

The tracker never sets a cookie, so in many cases you don't need a consent banner for your analytics. See when you still do.

Prerequisites

• A website on any platform
• A Pieowl account (start a 14-day free trial)
• Access to your website's HTML header, or a place to add custom code

Get your Client ID

Create a Pieowl account at app.pieowl.com. It starts a 14-day free trial, and no card is needed. Add your website as a site. The setup screen shows your Client ID and a ready-made snippet.

Your Client ID is a long ID made of letters, numbers and dashes, like 2f1c8e4a-0b7d-4c55-9e1a-3d6f0a9b2c17 (example). Keep it handy for the next step.

Add the script tag

The Pieowl script must be on every page of your site. Where you add it depends on your platform, but the snippet is always the same.

Here is the snippet. Replace YOUR_CLIENT_ID with your own Client ID.

<script src="https://pieowl.com/pieowl.js" data-client-id="YOUR_CLIENT_ID" defer></script>

Pieowl tracks page views for you, so you don't need to track each page. By default it also records clicks on links to other sites, which shows you where people leave, and clicks on elements with data-track attributes (see below). You can change this in Settings → Site → What Pieowl counts, with no code to edit.

Platform-specific instructions

On WordPress, the easiest way is a plugin such as "Insert Headers and Footers" or "Code Snippets". Install it and paste the snippet into the header section. If you prefer code, add the snippet to your theme's header.php file, just before </head>.

You can also add it from functions.php instead.

function add_pieowl_script() {
    ?>
    <script src="https://pieowl.com/pieowl.js" data-client-id="YOUR_CLIENT_ID" defer></script>
    <?php
}
add_action('wp_head', 'add_pieowl_script');

On Webflow, open your project settings and go to Custom Code. Paste the snippet into the Head Code box and publish your site.

On Squarespace, go to Settings > Advanced > Code Injection. Paste the snippet into the Header box and save.

With Google Tag Manager, create a new Custom HTML tag and paste the snippet. Set the trigger to All Pages and publish your container.

Track custom events

Page views are tracked for you. You'll probably also want to track actions like button clicks, form submits or video plays. Pieowl gives you two ways to do this.

The simplest way is a data-track attribute in your HTML. When someone clicks a button or link with this attribute, Pieowl sends an event.

<button data-track="button_clicked" data-button-name="signup">
  Sign Up
</button>

Every other data- attribute on the element becomes an event property. Names are turned into camelCase, so data-button-name arrives as buttonName. You get extra context without writing JavaScript. This needs Clicks you marked in your code to be on in Settings → Site (it is by default).

For more control, call the window.pieowl function yourself. You decide exactly when and what to track.

<script>
  document.querySelector('.signup-button').addEventListener('click', function() {
    window.pieowl('track', 'button_clicked', {
      button_name: 'signup',
      button_location: 'hero'
    });
  });
</script>

Form submits are a common thing to track. You can track them inline with the onsubmit attribute.

<form onsubmit="window.pieowl('track', 'form_submitted', {form_name: 'contact'}); return true;">
  <input type="email" name="email" placeholder="Your email">
  <button type="submit">Submit</button>
</form>

Identifying users

When users log in, you can link their activity to a profile with the identify method.

<script>
  window.pieowl('identify', {
    profileId: 'user_123',
    email: 'user@example.com',
    firstName: 'John',
    lastName: 'Doe'
  });
</script>

profileId is required. Use the user's ID from your own system. After this call, the events on that page are linked to the user. Pieowl keeps the ID in memory only, not in a cookie, so add this snippet to every page where the user is logged in.

Verify your setup

Open your website and visit a few pages. Click the buttons or links you set up tracking for. Then go to the Pieowl dashboard and check the realtime view.

Events should show up within a few seconds. No data? Open your browser's developer console (F12) and look for errors. The most common causes are a wrong Client ID or an ad blocker that stops the script from loading.

Ad blockers can block analytics scripts. If that matters for your audience, you can serve the Pieowl script from your own domain. The ad blocker documentation explains how.

Next steps

The script tag covers most needs for classic websites. For all the options, see the Script Tag SDK reference. To understand user journeys, the article on how to create a funnel walks you through conversion funnels.

If your site also has backend logic, you can add server-side events. The Node.js guide and the Python guide show how.

Using a framework? These guides go further:

• Next.js analytics guide for Next.js apps
• React analytics guide for React apps
• Astro analytics guide for Astro sites
• Vue analytics guide for Vue apps