Trackingsnippetet er et lite async-skript — noen få kilobyte servert fra en edge-cached førstepartsbane — som identifiserer organisasjonen bak hver sesjon. Riktig installert bør du aldri merke det. Feil installert vil du bruke en uke på å feilsøke hvorfor identifiserte selskaper mangler, før du finner ut at loaderen lå inne i en lazy-loaded partial. Denne guiden hjelper deg å unngå den uken.
Tre prinsipper før du limer inn noe som helst
- Loaderen hører hjemme i HTML-head for hele nettstedet. Ikke footer, ikke en spesifikk sidemal, ikke en komponent som bare rendres på marketingsider. I head, på hver side.
- Loaderen er async som standard. Ikke legg til en defer/async-overstyring som endrer når den kjøres; de medfølgende attributtene er de vi har testet.
- Installer nøyaktig én gang. To kopier av loaderen på samme side gir ikke dobbelt så mye data — de dobler forespørslene og forvirrer feilsøkingen.
WordPress
Den reneste installasjonen på WordPress unngår redigering av temaet. Bruk en plugin for header-skript (hvilken som helst av de kjente fungerer), lim inn loaderen i feltet "scripts in head", lagre, og tøm alle side-cacher. Hvis du ikke vil bruke en plugin, legg til en liten mu-plugin-fil som kobler seg til wp_head med prioritet 5, slik at loaderen lander før analytics-tagger. Ikke lim den inn i selve side- eller innleggsteksten — WordPress vil da fjerne script-taggen.
En WordPress-spesifikk sjekk: hvis du kjører en full-side-cache (LiteSpeed, WP Rocket, W3 Total Cache), må du tømme cachen etter installasjon. Cachet HTML som ble generert før installasjonen vil ikke inneholde loaderen.
Shopify
Shopify legger tema-HTML-en i theme.liquid. I Shopify-admin, åpne Online Store → Themes → Actions → Edit code → theme.liquid, og lim inn loaderen umiddelbart før den lukkende </head>-taggen. Lagre. Det er alt — ingen app kreves, ingen checkout-skript (checkout er uansett utenfor omfanget for identifikasjon på selskapsnivå).
Dupliser temaet først
Før du redigerer theme.liquid, bruk Actions → Duplicate. Hvis noe går galt, kan du rulle tilbake med ett klikk. Dette er en fem sekunders vane som har reddet alle Shopify-team den har blitt foreslått for.
Webflow
Webflow → Site Settings → Custom Code → Head Code. Lim inn loaderen. Lagre. Publiser nettstedet. Head-koden gjelder globalt for alle sider, noe som er nøyaktig det du ønsker. Ikke lim inn loaderen i en embed på sidenivå — da sporer du bare den ene siden.
Google Tag Manager
GTM fungerer, med to forbehold. For det første, bruk en Custom HTML-tag med trigger satt til "All Pages" slik at loaderen kjører på hver sidevisning. For det andre, sett tag-prioriteten høyt nok til at den fyrer før andre analytics-tagger som kan forsinke den første payloaden. GTM-brukere har ofte fire eller fem tagger i head; loaderen er liten, men rekkefølgen på tag-fyring er viktig hvis du vil ha identifikasjon på første forespørsel.
Forbehold om consent-mode: hvis du kjører GTM bak et samtykkebanner som bare fyrer analytics-tagger etter opt-in, bør du ikke legge identifikasjon på selskapsnivå bak den samme sperren — den bruker ikke cookies eller lagrer data på besøkerens enhet, så den krever ikke samme samtykkeoverflate. Konfigurer taggen til å fyre umiddelbart, sammen med dine strengt nødvendige tagger.
Ren HTML / tilpassede stacks
For et håndkodet nettsted eller et rammeverk vi ikke har nevnt, lim inn loaderen i <head>-elementet i basemalen din — filen som rendres på hver side. Bygg og deploy på nytt. For statiske sideturbiner hører loaderen hjemme i den globale layout-filen (i Next.js er det en <Script> i layout på app-nivå med strategy="afterInteractive"; i Astro, <BaseHead>-komponenten; i 11ty, basemal-partialen). Hvis du la den til som et skript på komponentnivå, vil bare sider som inkluderer den komponenten rapportere data.
Single-page applications — den ene fellen
I en SPA fanges den første sidevisningen opp av loaderen når siden lastes første gang. Påfølgende navigering på klientsiden er ikke automatiske sidevisninger fra nettleserens synspunkt. Loaderen vår lytter til History API som standard, så navigering via tilbake/frem og pushState registreres som nye sidevisninger uten ekstra kode fra deg. Hvis din SPA bruker en ikke-standard router som går utenom History API (sjeldent, men forekommer), kall den lille dokumenterte pageview-funksjonen ved ruteendring — tre linjer, referert i dokumentasjonen.
Verifiser installasjonen på to minutter
Verifisering er ikke valgfritt. Gjør det før du lukker fanen der du installerte loaderen; å oppdage en ødelagt installasjon fem minutter etter innliming er enkelt, å oppdage det fem dager senere er ikke det.
- Åpne nettstedet ditt i et privat/inkognito-vindu (slik at ingen cachede ressurser forvirrer deg).
- Åpne DevTools → Network-fanen, filtrer etter "l5e" eller banen til loaderen.
- Last siden på nytt. Du skal se én forespørsel til loaderen, og deretter én liten identify-beacon. Begge skal ha status 200. Loaderens response-headers bør inkludere cache-control med s-maxage og stale-while-revalidate.
- Naviger til en side nummer to. Du skal se at enda en identify-beacon fyrer, uten at loaderen lastes ned på nytt (den vil gi 304).
- Gå tilbake til lead.box-dashbordet, åpne live-feeden, og bekreft at ditt testbesøk vises. Hvis det gjør det, er installasjonen fullført.
Vanlige feil — tabellen du bør sjekke først
| Symptom | Sannsynlig årsak | Løsning |
|---|---|---|
| Ingen live-besøk i det hele tatt | Loader mangler i head, eller er på feil mal | Flytt loader til global head-mal |
| Live-besøk kun fra én seksjon | Loader er i en embed på sidenivå, ikke global | Flytt til global head / theme-header |
| Loader laster, men ingen identify-beacon | Samtykkebanner blokkerer tredjepartsskript for aggressivt | Konfigurer banner til å tillate strengt nødvendige; loader trenger ikke samtykke |
| Doble beacons per sidevisning | Loader installert to ganger (tema + plugin/tag) | Fjern den ene |
| Treg first paint etter installasjon | Loader plassert før kritisk CSS | Bekreft at async-attributten er til stede; plasser etter preload av kritisk CSS |
| SPA rapporterer bare første side | Egendefinert router går utenom History API | Kall dokumentert pageview() ved ruteendring |
| Gammel HTML serveres uten loader | Full-side-cache ikke tømt etter installasjon | Tøm cache; verifiser i inkognito |
Ytelsesnotat — edge-cachet loader
Loaderen serveres fra en førstepartsbane som er proxied til vår edge-cache med s-maxage=300 og stale-while-revalidate. I praksis betyr dette at loaderen hentes én gang hvert femte minutt per edge PoP, og deretter serveres fra cache til alle påfølgende besøkende. Byte-vekt og blokkerende innvirkning er så liten at vi ikke anbefaler å legge ekstra lastelogikk på toppen av den.
Når du bør be om hjelp
Hvis du har fulgt verifiseringstrinnene og noe fortsatt ikke stemmer, vil vi heller høre fra deg etter ti minutter enn etter ti dager. Ta med tre ting: nettstedets URL, et skjermbilde av DevTools Network-fanen filtrert etter loader-banen, og navnet på plattformen du installerte på. Det er nok til å diagnostisere nesten alle installasjonsproblemer på første svar.
Publisert av
lead.box Team
Flere artikler
Se lead.box på din egen trafikk
Start gratis — ingen kort, ingen salgssamtale kreves. Eller book en 20-minutters gjennomgang hvis du vil ha en guidet tur.
