Skip to main content
Puntego ships as one boot script that loads the runtime and mounts the guide inside its own shadow root. This page is the complete install reference — every script attribute, route rule, and verification step.
Want the fastest path to a working guide? Start with the Quickstart. Come back here when you need the full attribute reference.

​
Set up your install

1

Create your app and copy the app ID

Sign in to the Puntego dashboard and create or select your workspace. Open Dashboard → Install and copy your app ID — the gp_ token that links the boot script to your workspace. You will paste it into the script tag in step 3.
2

Add and verify your domain

Add every production hostname in Dashboard → Settings → Domains, publish the DNS TXT record the dashboard generates, and run verification before launch. Boot calls from an unverified origin are rejected, so the guide will not appear until verification passes. See domains and allowlisting for the full process.
3

Paste the boot script

Add the script near the end of your <head> or immediately before </body>, and replace gp_your_app_id with the app ID you copied in step 1. Use the Standard snippet unless your site enforces a strict Content Security Policy.
Copy the canonical snippet from Dashboard → Install so the app ID and worker URL always match your workspace.
4

Set behavior attributes (optional)

The defaults boot a floating launcher in the bottom-right corner with no extra setup. To change the launcher, automate proactive behavior, or scope the guide to specific routes, add the data attributes documented in script attributes below — no code and no redeploy of your app.
5

Verify the guide appears

Load a page on a verified domain. The guide mounts inside its own shadow root, isolated from your styles. Desktop visitors see the launcher you configured; if nothing appears, check troubleshooting.
The cursor launcher (data-launcher-mode="cursor") falls back to a bubble experience on touch-primary or narrow (under 768px) screens. The default floating launcher keeps its button at every screen size.

​
Script attributes

Everything below is set on the install <script> tag — no code, no redeploy. Boolean attributes accept true/false (also 1/0, yes/no, on/off); a bare attribute with no value means true.

​
Required

​
Strict CSP

​
Launcher appearance

​
Behavior

​
Route targeting

Scope the guide to (or away from) specific routes without code. data-routes is a comma-separated list of path globs matched against the page pathname (query and hash are ignored, matching is case-insensitive):
  • * matches within a single path segment; ** (or a trailing /**) spans segments.
  • A leading ! makes a rule a deny, and a deny always wins.
  • If any allow rule is present, the path must match one of them to mount.
  • A deny-only list mounts everywhere except the denied paths.
On a non-matching route the runtime chunk is never downloaded, so there is no cost on pages where the guide should not appear. Rules are evaluated at initial load; single-page apps re-check on client-side route changes — see the framework guides. Consent mode, voice, and other workspace behavior are set in the dashboard, not on the script tag. Configure them in Configuration, and see how Puntego handles consent and PII redaction in privacy and PII.

​
Next steps

Quickstart

The shortest path from app ID to a live guide.

Framework guides

Next.js, the React provider and hooks, SPA route changes, and Google Tag Manager.

Strict CSP

Run Puntego under a strict Content Security Policy with nonce propagation.

Configuration

Tune appearance, consent, voice, and rollout from workspace settings.