Get started

Installing the tag

Add one line to plain HTML, WordPress, Shopify, Next.js, single-page apps or a tag manager.

The tag is a single <script> with your site key. Add it once so it's on every page. It doesn't need to be first, it doesn't block rendering, and it doesn't need any other code.

<script async src="https://pubber.io/v1/sdk.js" data-site="YOUR_SITE_KEY"></script>

Plain HTML or a static site

Paste the tag inside <head> in your page template or shared header include. For a static site generator (Hugo, Jekyll, Eleventy, Astro), that's the base layout file, then rebuild and deploy.

WordPress

With a header plugin: any plugin that adds code to the site header works (for example "WPCode" or "Insert Headers and Footers"). Paste the tag into the header box and save.
Without a plugin: add it to your theme's header.php before </head>. Use a child theme, or the tag disappears when the theme updates.
Caching plugins: clear the cache after adding the tag, or our install check won't see it.

Ghost

Settings → Code injection → Site header. Paste the tag and save.

Shopify and other hosted themes

Online Store → Themes → ⋯ → Edit code → layout/theme.liquid. Paste the tag just before </head> and save. Squarespace, Wix and Webflow each have a "custom code" or "header code" setting that works the same way.

Next.js and React

Load the tag once for the whole app, with your site key in data-site:

import Script from "next/script";

// app/layout.tsx (App Router) or pages/_app.tsx (Pages Router)
<Script src="https://pubber.io/v1/sdk.js" data-site="YOUR_SITE_KEY" strategy="afterInteractive" />

The tag reads the article that's on the page when it loads. In a single-page app, call window.pubber.refill() after each client-side navigation to a new article: it removes the previous page's units and asks again for the new one. Server-rendered article pages, the default in Next.js, Nuxt and Astro, work without it.

Google Tag Manager and other tag managers

Create a Custom HTML tag with the snippet, trigger it on All Pages, and publish the container. Tag managers add the script after the page starts loading, which is fine.

If your tag manager waits for a consent banner before firing advertising tags, Pubber follows the same rule. See Privacy and consent.

Check it's working

In your portal, open your site and click Check installation. We load your home page and look for your key. Once your site is approved and live, the portal also shows the last time your tag asked for offers.

To see what the tag is doing in the browser, add data-debug="1" to it and open the console.