Jälgimisskript on väike asünkroonne skript — mõni kilobait, mida serveeritakse äärevahemälust esimese osapoole teelt —, mis tuvastab iga seansi taga oleva organisatsiooni. Õigesti paigaldatuna sa ei märkagi seda kunagi. Valesti paigaldatuna kulutad terve nädala selle silumisele, miks tuvastatud ettevõtted puuduvad, enne kui avastad, et laadur oli laisalt laaditava osa sees. See juhend aitab sul sellest nädalast mööda saada.
Kolm põhimõtet enne kleepimist
- Laadur kuulub kogu saidi HTML-i päisesse. Mitte jaluses, mitte konkreetse lehe mallis, mitte komponendis, mis renderdub ainult turunduslehtedel. Päisesse, igale lehele.
- Laadur on vaikimisi asünkroonne. Ära lisa defer/async ülekirjutust, mis muudab selle käivitumisaega — kaasas olevad atribuudid on need, mida me testisime.
- Paigalda täpselt üks kord. Kaks koopiat laadurist samal lehel ei kahekordista sinu andmeid — need kahekordistavad päringud ja segavad silumist.
WordPress
Puhtaim paigaldus WordPressis väldib teema muutmist. Kasuta päiseskriptide pluginat (sobib iga tuntud variant), kleebi laadur väljale "scripts in head", salvesta ja tühjenda lehe vahemälu. Kui sa ei soovi pluginat, lisa väike mu-plugin fail, mis kinnitub wp_head külge prioriteediga 5, et laadur jõuaks kohale enne analüütikaskripte. Ära kleebi seda lehe või postituse sisusse — WordPress puhastab skriptimärgendi välja.
Üks WordPressi-spetsiifiline kontroll: kui kasutad kogu lehe vahemälu (LiteSpeed, WP Rocket, W3 Total Cache), tühjenda vahemälu pärast paigaldamist. Vahemällu jäänud HTML, mis eelnes paigaldusele, ei sisalda laadurit.
Shopify
Shopify hoiab teema HTML-i failis theme.liquid. Ava Shopify halduses Online Store → Themes → Actions → Edit code → theme.liquid ja kleebi laadur vahetult enne sulgevat </head> märgendit. Salvesta. See ongi kõik — rakendust pole vaja, väljumisel (checkout) skripti pole vaja (checkout jääb niikuinii ettevõtte-tasandi tuvastamisest välja).
Dubleeri teema kõigepealt
Enne theme.liquid muutmist kasuta Actions → Duplicate. Kui midagi läheb valesti, saad ühe klõpsuga tagasi pöörduda. See on viiesekundiline harjumus, mis on päästnud iga Shopify meeskonna, kellele seda on soovitatud.
Webflow
Webflow → Site Settings → Custom Code → Head Code. Kleebi laadur. Salvesta. Avalda sait. Päisekood kehtib globaalselt kõikidel lehtedel, mida sa täpselt tahadki. Ära kleebi laadurit lehetasandi manusesse — nii jälgid ainult seda ühte lehte.
Google Tag Manager
GTM töötab, kahe reservatsiooniga. Esiteks kasuta kohandatud HTML-siltiga, mille päästikuks on "All Pages", et laadur käivituks igal lehevaatel. Teiseks sea sildi prioriteet piisavalt kõrgeks, et see käivituks enne teisi analüütikasilte, mis võivad aeglustada esmast laadimist. GTM kasutajad kihistavad päisesse sageli neli-viis silti; laadur on väike, kuid siltide käivitumise järjekord on oluline, kui soovid tuvastust juba esimesest päringust.
Nõusoleku režiimi reservatsioon: kui kasutad GTM-i nõusolekubänneri taga, mis käivitab analüütikasildid alles pärast nõusolekut, ära pane ettevõtte-tasandi tuvastamist sama väravasse — see ei kasuta küpsiseid ega salvesta andmeid külastaja seadmesse, seega ei vaja see sama nõusolekupinda. Seadista silt käivituma kohe, koos rangelt vajalike siltidega.
Tavaline HTML / kohandatud tehnoloogiapinud
Käsitsi kirjutatud saidi või meie poolt nimetamata raamistiku puhul kleebi laadur oma baasmalli <head> elemendi sisse — faili, mis renderdub igal lehel. Ehita ja juuruta uuesti. Staatiliste saidigeneraatorite puhul kuulub laadur kogu saidi paigutusfaili (Next.js-is on see <Script> rakenduse tasandi paigutuses koos strategy="afterInteractive"; Astro's <BaseHead> komponent; 11ty's baasmalli osafail). Kui lisasid selle komponenditasandi skriptina, raporteerivad ainult lehed, mis sisaldavad seda komponenti.
Ühelehelised rakendused — üks konks
SPA-s tabab laadur esmase lehevaate lehe esmakordsel laadimisel. Järgnevad kliendipoolsed navigeerimised ei ole brauseri vaatepunktist automaatsed lehevaated. Meie laadur kuulab vaikimisi History API-t, seega tagasi/edasi ja pushState-põhised navigeerimised registreeruvad uute lehevaadetena ilma sinupoolse koodita. Kui sinu SPA kasutab mittestandardset ruuterit, mis mööda hiilib History API-st (harv, kuid mitte tundmatu), kutsu marsruudi muutumisel dokumenteeritud väike pageview funktsioon — kolm rida, viidatud dokumentatsioonis.
Kontrolli paigaldust kahe minutiga
Kontroll ei ole valikuline. Tee seda enne, kui suled vahekaardi, kus laadi paigaldasid; katkise paigalduse tabamine viis minutit pärast kleepimist on triviaalne, viis päeva hiljem mitte.
- Ava oma sait privaatses/incognito aknas (et vahemällu jäänud varad sind ei segaks).
- Ava DevTools → Network vahekaart, filtreeri "l5e" või laaduri tee järgi.
- Laadi leht uuesti. Sa peaksid nägema ühte päringut laadurile, seejärel ühte väikest tuvastusbeaconit. Mõlemad peaksid olema staatusega 200. Laaduri vastuse päised peaksid sisaldama cache-control koos s-maxage ja stale-while-revalidate väärtustega.
- Liigu teisele lehele. Peaksid nägema veel ühte tuvastusbeaconi käivitumist, laadurit uuesti alla ei laeta (see saab 304).
- Naase lead.box töölauale, ava reaalajas külastajate voog ja kinnita, et sinu testkülastus ilmub. Kui see ilmub, on paigaldus valmis.
Levinud vead — tabel, mida esimesena kontrollida
| Sümptom | Tõenäoline põhjus | Lahendus |
|---|---|---|
| Reaalajas külastusi üldse pole | Laadur puudub päisest või on vales mallis | Vii laadur kogu saidi päisemallile |
| Reaalajas külastusi ainult ühest osast | Laadur lehetasandi manuses, mitte globaalne | Vii globaalsesse päisesse / teema päisesse |
| Laadur laadib, aga tuvastusbeaconit pole | Nõusolekubänner blokeerib kolmandate osapoolte skripte liiga agressiivselt | Seadista bänner lubama rangelt vajalikud; laadur ei vaja nõusolekut |
| Topelt beaconid iga lehevaate kohta | Laadur paigaldatud kaks korda (teema + plugin/silt) | Eemalda üks |
| Aeglane esimene renderdus pärast paigaldust | Laadur paigutatud enne kriitilist CSS-i | Kinnita, et async atribuut on olemas; paiguta pärast kriitilise CSS-i eellaadimist |
| SPA raporteerib ainult esimest lehte | Kohandatud ruuter hiilib History API-st mööda | Kutsu dokumenteeritud pageview() marsruudi muutumisel |
| Serveeritakse aegunud HTML-i ilma laadurita | Kogu lehe vahemälu pole pärast paigaldust tühjendatud | Tühjenda vahemälu; kontrolli incognito režiimis |
Jõudluse märkus — äärevahemällu salvestatud laadur
Laadurit serveeritakse esimese osapoole teelt, mis on proksitud meie äärevahemällu koos s-maxage=300 ja stale-while-revalidate väärtustega. Praktikas tähendab see, et laadur tuuakse üks kord viie minuti kohta iga ääre-punkti kohta ja seejärel serveeritakse vahemälust igale järgnevale külastajale. Baitide kaal ja blokeeriv mõju on piisavalt väikesed, et me ei soovita sellele lisada täiendavat laadimisloogikat.
Millal küsida abi
Kui oled läbinud kontrolli sammud ja midagi ikka ei tööta, kuuleksime sinust meelsamini kümne minuti kui kümne päeva möödudes. Too kaasa kolm asja: saidi URL, ekraanipilt DevTools Network vahekaardist filtreerituna laaduri tee järgi ja platvormi nimi, kuhu paigaldasid. Sellest piisab, et diagnoosida peaaegu iga paigaldusprobleem juba esimese vastusega.
Published by
lead.box Team
Rohkem artikleid
Vaata, mida lead.box sinu enda liikluses näeb
Alusta tasuta — kaarti ega müügikõnet pole vaja. Või broneeri 20-minutiline läbivaatus, kui eelistad juhendatud tuuri.