Single-page apps and client-side routing
The tag handles client-side navigation by itself (spa: "auto", the default).
What counts as a new page
Section titled “What counts as a new page”history.pushStateor back/forward to another path or query starts a new page view. The tag waits for the new route to render: once your page’s DOM has changed, until it has been quiet for 250 ms. If nothing changes within a second, it assumes the route rendered before the URL changed. It never waits more than 3 seconds.history.replaceState(infinite scroll, UTM clean-up) and hash-only changes never start a page view, so ads on screen stay.- A new page view removes the previous page’s ads, finds your article again and decides every
placement on the new page. The floating banner stays unless you set
floating: "per-pageview".
Placements mounted later
Section titled “Placements mounted later”A <div data-tgm-unit="…"> added after load (a component mounting, “load more”) is decided
automatically in the current page view. When it is removed, its ad is removed too. Units that were
not filled are tried again on the next page view.
Manual mode
Section titled “Manual mode”If your router renders the new page more than about a second after the URL changes (slow loaders), or you want exact control, set manual mode and tell the tag when the new page is ready:
<script async src="https://tgmads.example.com/tag.js" data-tgm-spa="manual"></script>(or spa: "manual" in window.tgmConfig, or the spa option of the packages), then:
// after each navigation has rendered:window.tgm?.pageview();Calling tgm.pageview() yourself also switches the tag to manual mode. A call right after the tag’s
own page view for the same URL is merged into it, so you never count a page twice.
The API
Section titled “The API”| Call | Does |
|---|---|
tgm.pageview() |
Starts a new page view (manual mode). |
tgm.refresh(["id"]) |
Decides the given placements again in this page view. |
tgm.destroy() |
Removes every ad and stops the tag. Loading tag.js again starts a fresh one. |
tgm.on(event, cb) |
render, unfilled, viewable, close, decide, pageview, remove. Returns an unsubscribe function. |
tgm.status() |
Configuration, state and every slot, for checking an install. |
