Karta klikov je pokazala nekaj, česar nisem pričakoval. V trgovini z naročninami, kjer je bila možnost "naroči in prihrani" edina vnaprej izbrana, je zaprt zložljiv razdelek za enkratni nakup še vedno pritegnil veliko klikov.
Bil je skrit. Ljudje so ga kljub temu šli iskat, kar mi je povedalo, da obstaja prikrito povpraševanje po enkratnem nakupu, ki ga je stran aktivno dušila.
Za to je toplotna karta dobra: za vedenje, ki ga nisi načrtoval. Tu se začnejo tudi težave, ker pokaže, kaj so ljudje naredili, ne pa, koliko je bilo to vredno. Ta vodič pokriva, kako ta orodja na Shopifyju pravilno uporabljati in kako jih brati, ne da bi samega sebe prepričal v napačno spremembo.
Napisan je za tiste, ki vodijo Shopify trgovine z okvirno $500k do $5M+ letnega prihodka, ne za produktne ekipe v SaaS. Vsako priporočilo spodaj je presojeno po tem, kar šteje za trgovino: strani izdelkov, košarica, blagajna in cena zmote.
Ključne ugotovitve
- Toplotne karte pokažejo, kam gre pozornost. Posnetki pokažejo, zakaj se je seja ustavila. Za odločitev potrebuješ oboje, poleg tega pa še številke iz lijaka.
- Namesti prek ponudnikove Shopify aplikacije, ne z lepljenjem kode v temo, in poskrbi, da skripta spoštuje privolitev kupcev.
- Večina trgovin blagajne ne more snemati. Shopify dogodke, ki omogočajo posnetke blagajne, omejuje na Shopify Plus.
- Vsak pregled začni z eno stranjo in enim vprašanjem. Gledanje naključnih posnetkov je zabava, ne raziskava.
- Toplotne karte ti ne povedo življenjske vrednosti stranke, ne popravijo slabega sledenja in potrebujejo promet. Pri vseh treh sem v debati že potegnil kratko.
Kaj pokažejo toplotne karte in kaj posnetki sej
Toplotna karta tisoče obiskov združi v eno sliko tega, kam ljudje klikajo, kje tapkajo in kako daleč se pomaknejo. Posnetek seje predvaja en sam obisk, vključno z gibanjem kazalca. Prva ti pove, kje se pozornost zgošča. Drugi ti pove, kaj je posameznik poskušal narediti, ko je obupal.
Nobeden od njiju ti ne pove, koliko prihodka stran izgubi. Ta številka je v lijaku tvoje Shopify analitike. Vsi trije viri delujejo kot celota:
| Vir | Na kaj odgovori | Na kaj ne more odgovoriti |
|---|---|---|
| Podatki lijaka (Shopify analitika, GA4) | Kje ljudje odpadejo in koliko jih | Zakaj so odpadli |
| Toplotne karte (kliki, pomikanje, gibanje) | Kateri elementi na eni strani dobijo pozornost | Ali ta pozornost vodi v nakup |
| Posnetki sej | Kaj je en obiskovalec poskusil, kje je okleval ali kaj je narobe razumel | Ali je ta obiskovalec tipičen |
Lijak izbere stran. Toplotna karta izbere element. Posnetki razložijo vedenje. Če prvi korak preskočiš, na koncu optimiziraš stran, ki že na začetku ni kaj dosti puščala.
Namestitev orodja za toplotne karte na Shopify
Kjerkoli obstaja, uporabi ponudnikovo aplikacijo iz Shopify App Store. To je najčistejša namestitev, enostavno jo odstraniš in kode teme se nikoli ne dotakneš.
Možnost 1: ponudnikova Shopify aplikacija
Clarity, Lucky Orange in Contentsquare (Hotjarjev naslednik) se vsi namestijo tako. Microsoftova lastna navodila za Clarity so, da namestiš aplikacijo "Microsoft Clarity: AI Insights" in sledilno skripto vklopiš v nastavitvah aplikacije (Microsoft Learn, 2025). Hotjar je zdaj del podjetja Contentsquare, novih Hotjar računov pa ni več mogoče ustvariti (Contentsquare, 2026). Novi uporabniki namestijo uradno aplikacijo Contentsquare Analytics (Shopify App Store, 2026). Aplikacija 'Hotjar Install' je plačljiv namestitveni program tretje osebe, ki navaja, da ni povezan s Hotjarjem, in potrebuje obstoječo Hotjar sledilno kodo (Shopify App Store, 2026). Lucky Orange svojo povezavo opisuje kot namestitev z enim klikom, brez sledilne kode, ki bi jo moral dodati (Lucky Orange, 2026).
Možnost 2: lepljenje kode v theme.liquid
Starejša metoda je, da sledilno kodo prilepiš pred zaključno oznako </head> v theme.liquid. Še vedno deluje, a koda v temi preživi odstranitev aplikacij in podvajanje tem, poleg tega pa ostane zunaj Shopifyjevega upravljanja privolitev. Če je Clarity že nameščen na ta način, Microsoft navaja, da te aplikacija preseli brez sprememb kode.
Metoda, ki ne deluje več
Veliko vodičev za namestitev ti še vedno svetuje, da Hotjar kodo prilepiš v Settings > Checkout > Additional Scripts, da bi sledil strani s potrditvijo naročila. Na paketih brez Plus je Shopify to polje 28. avgusta 2025 spremenil v polje samo za branje, prilagoditve strani z zahvalo in statusom naročila pa zdaj potekajo prek blokov in pikslov (Shopify Help Center, 2026). Če ti vodič svetuje, da ga uporabiš, je vodič zastarel.
Privolitev in osebni podatki
Shopifyjeva pasica za piškotke upravlja Shopifyjeve lastne piksle. Za vse drugo je Shopifyjev center za pomoč nedvoumen. Piškotki ali piksli tretjih oseb, nameščeni ročno ali prek aplikacij, morda potrebujejo pasico tretje osebe ali lastno logiko, da upoštevajo privolitev (Shopify Help Center, 2026).
Orodje za to lastno logiko je Customer Privacy API, ki skripti omogoča, da preveri dovoljenja, kot je analyticsProcessingAllowed(), preden začne snemati (Shopify, 2026). Vprašaj ponudnika, ali ga njegova aplikacija upošteva. Če ne zna odgovoriti, predpostavi, da ga ne.
Nato preveri maskiranje. Posnetki zajamejo, kar je na zaslonu, stran s strankinim računom pa je polna imen in naslovov. Clarity v vseh načinih maskira vnosna polja, njegov privzeti način "Balanced" pa maskira tudi številke in e-poštne naslove (Microsoft Learn, 2025). Ne glede na orodje odpri pet posnetkov svojih strani računa in košarice in poglej, kaj je vidno, preden dostop deliš s komerkoli.
Ali lahko orodje za toplotne karte snema Shopify blagajno?
Na večini Shopify paketov ne. Na Shopify Plus nekatera orodja lahko. To je kratek odgovor na vsako iskanje "hotjar shopify checkout" in izhaja iz Shopifyjevih pravil, ne iz katerega koli posameznega ponudnika.
Mehanizem je takšen. Shopifyjevi piksli se naložijo v spletni trgovini, na blagajni ter na straneh z zahvalo in statusom naročila. Toda peskovnik za piksle ne more samodejno zaznati klikov in gibanja miške, iz katerih bi z branjem DOM sestavil toplotne karte (Shopify Help Center, 2026). Toplotne karte in posnetki delujejo tako, da berejo stran, zato skripta v peskovniku na blagajni nima s čim risati.
Shopifyjeva rešitev je Advanced DOM Events API. Namenjen je poustvarjanju uporabniških poti in interakcij za snemanje sej in toplotne karte, dostop do njega pa dobijo le aplikacije, ki te funkcije ponujajo. Na blagajni pa Shopify te dogodke izrecno omejuje na trgovine s paketom Shopify Plus (Shopify, 2026).
Kaj to pomeni za posamezno orodje, po njihovi lastni dokumentaciji:
- Microsoft Clarity: pri računih Shopify Plus se blagajna in strani po nakupu spremljajo prek Shopifyjevega piksla (Microsoft Learn, 2025).
- Lucky Orange: na standardnih paketih spremlja dogodke na blagajni, posnetkov ali toplotnih kart strani blagajne pa ne boš videl (Lucky Orange, 2026). Trdi tudi, da je edino orodje, ki snema blagajne na Plus. To je trditev ponudnika, Microsoftova dokumentacija pa pravi, da Clarity blagajne na Plus prav tako pokriva.
- Hotjar / Contentsquare: Hotjar ne sprejema več novih računov. Opis aplikacije Contentsquare navaja, da analizira strani Shopify trgovine in blagajne (Shopify App Store, 2026), ne pove pa, ali predvajanje posnetkov blagajne deluje tudi brez Plus, Shopify pa DOM dogodke na blagajni omejuje na Plus. Preden se na to zaneseš, vprašaj Contentsquare.
Če nisi na Plus, nehaj poskušati blagajno gledati in jo raje beri. Shopifyjeva analitika pokaže, koliko sej pride do blagajne in koliko jih nakup zaključi. Ta osip je številka, na kateri je treba delati, vodič po optimizaciji Shopify blagajne pa pokriva, kaj ga dejansko premakne.
Katero orodje namestiti
Izberi po modelu zaračunavanja in pokritosti blagajne, nato nehaj primerjati. Razlike med temi orodji so veliko manj pomembne od tega, ali jih odpreš vsak teden z vprašanjem.
| Orodje | Model zaračunavanja (preverjeno 16. 10. 2026) | Namestitev na Shopify | Posnetki blagajne | Celotna primerjava |
|---|---|---|---|---|
| Microsoft Clarity | Brezplačno; Microsoft navaja, da prometnih omejitev ni (Clarity, 2026) | Aplikacija iz App Store | Samo Plus, prek Shopifyjevega piksla | Microsoft Clarity ali Hotjar |
| Hotjar (zdaj Contentsquare) | Novih Hotjar registracij ni; brezplačni paket Contentsquare se meri po mesečnih sejah in del njih shrani kot posnetke (Contentsquare, 2026) | Aplikacija Contentsquare (uradna); Hotjar Install je aplikacija tretje osebe | Ni potrjeno | Alternative za Hotjar |
| Lucky Orange | Brezplačen paket v Shopify App Store; plačljivi paketi se zaračunajo po mesečnih sejah (Shopify App Store, 2026) | Aplikacija iz App Store | Samo Plus (dokumentacija ponudnika) | Lucky Orange za Shopify |
Hotjarjeva stran s cenami zdaj preusmeri na stran Contentsquare, zato podrobnosti paketov preberi tam. Cene sem namenoma izpustil, ker se spreminjajo hitreje kot primerjalne tabele. Če si neodločen, namesti brezplačni paket, ki odgovori na tvoje trenutno vprašanje, in kasneje zamenjaj.
Ponovljiv način branja toplotnih kart in posnetkov
Pet korakov, prvi pa opravi večino dela: ena stran, eno vprašanje. Brez vprašanja boš gledal posnetke, dokler se ti nekaj ne bo zdelo čudno, nato pa to popravil, ne glede na to, ali te stane denar ali ne.
1. Naj stran izbere lijak. Odpri Shopifyjevo analitiko in poišči največji osip med sejami, dodajanjem v košarico, blagajno in nakupom. Če strani izdelkov izgubijo največ ljudi, je to tvoja stran. Preden greš naprej, razdeli podatke po napravah, ker se puščanje na mobilnem skrije v mešanem povprečju. Članek o mobilni stopnji konverzije razloži, zakaj se obe napravi obnašata tako različno.
2. Zapiši vprašanje. "Zakaj mobilni obiskovalci na strani uspešnice ne dodajo v košarico?" je vprašanje. "Poglejmo, kaj ljudje počnejo" ni.
3. Preberi toplotno karto samo za to stran. Preveri, ali elementi, ki si jih oblikoval za dejanje, dejanje tudi dobijo. Nato poišči veliko klikov na stvareh, ki niso povezave, in pozornost na razdelkih, za katere si mislil, da jih nihče ne bere. Nepričakovani kliki so običajno prava ugotovitev.
4. Posnetke filtriraj po vedenju, ne po datumu. Ne glej zadnjih 50 sej. Glej tiste, ki ustrezajo vprašanju, na primer obiskovalce, ki so stran zapustili, ne da bi dodali v košarico. Kjer jih orodje ponuja, uporabi filtre za jezne klike (rage clicks) ali mrtve klike (dead clicks).
5. Spremeni to v hipotezo, nato se odloči, kako jo dokazati. Vzorec na toplotni karti govori v prid spremembi, ni pa dokaz, da bo sprememba delovala. Če ima stran dovolj prometa, jo testiraj. Moje delovno okvirno pravilo za zanesljiv rezultat A/B testa je nekaj sto konverzij na različico pri več tisoč sejah. Pod tem pragom obstaja tveganje, da so tudi veliki opaženi dvigi lažno pozitivni.
To je ista zanka, ki jo poganjam pri auditu, članek o procesu optimizacije konverzij pa pokriva, kako se ponavlja iz meseca v mesec.
Želiš to za svojo trgovino? Audit optimizacije konverzij tvoj lijak, toplotne karte in posnetke prebere ob 78 dokumentiranih vzorcih. Nazaj dobiš razvrščen seznam tega, kaj popraviti najprej.
Odločitve, ki sem jih sprejel na podlagi karte klikov
Štirje resnični primeri, anonimizirani do ravni niše.
Drsnik, ki ga oblikovalec ni hotel. Na strani izdelka za nego kože je bil drsnik pred/po najbolj kliknjen element na strani. Karta klikov je pokazala, da ljudje kliknejo skozi vse slike, ne le skozi prvo. To je upravičilo izdelavo vrtiljaka s puščicami, ki ga oblikovalec ni hotel, ker je vedenje povedalo, da ljudje želijo več natanko takšne vsebine.
Puščica na gumbu. Puščice na gumbih za poziv k dejanju pritegnejo lasten delež klikov. Kot sem rekel eni od strank: "Veliko ljudi klikne puščico, kadar je tam, drugi kliknejo besedilo, zato je to koristen element." Toplotna karta je edini način, da bi videl, da okrasna puščica opravlja svoje delo.
Stran, ki smo jo preuredili. Vedenjsko poročilo je preuredilo celotno stran. "Poročilo kaže, da uporabniki ta del uporabljajo, zato smo ga premaknili višje. Tudi dokaze zdaj postavljamo bolj naprej, ker besedilnih mnenj v resnici niso brali. Za pozornost potrebujejo fotografije." Mnenja samo z besedilom so bila v oblikovalski datoteki videti v redu, v podatkih pa so bila nevidna.
Funkcija, ki ni bila zgrajena. Predogled personalizacije je uporabljala le majhna manjšina obiskovalcev. Ti podatki o uporabi so bili moj argument proti dragi integraciji galerije, ker dodatnega razvoja za tako malo ljudi ni bilo mogoče upravičiti.
Opazi, da je zadnji primer denar prihranil, ne zaslužil. Toplotne karte so vsaj tako uporabne za to, da delo ustaviš, kot za to, da ga začneš.
Česa ti toplotne karte ne morejo povedati
Toplotna karta je slika vedenja. Ni slika vrednosti, da bi karkoli pomenila, potrebuje količino, in je samo tako poštena kot sledenje pod njo. Vsako od tega sem se naučil na lastni koži.
Pokažejo klike, ne življenjske vrednosti
Dokaze iz karte klikov, kot je tisti skriti zložljivi razdelek, sem prinesel v debato s stranko, ki je stavila predvsem na naročnine. Odločno sem se zavzemal za prikaz možnosti enkratnega nakupa. Izgubil sem. Stranka je na podlagi lastnega predhodnega dela na zadrževanju strank v celoti ostala pri naročninah.
Imeli so podatke, ki jih jaz nisem imel. Toplotna karta ti lahko pokaže, da ljudje iščejo možnost enkratnega nakupa. Ne more ti pokazati, koliko je naročnik vreden v enem letu v primerjavi s kupcem, ki kupi enkrat. Še vedno mislim, da je skrivanje možnosti enkratnega nakupa običajno napaka. Moj lasten pridržek k temu prepričanju je, da lahko močna strategija zadrževanja upraviči model, ki temelji izključno na naročninah. Odločaj s podatki, ne z dogmo, in vedi, katere podatke ti posamezno orodje lahko da in katerih ne.
Potrebujejo promet
Na B2B spletni strani za dogodke sem želel debato o pozivu k dejanju nad pregibom razrešiti s podatki toplotne karte. Stranka je raje obdržala glavni gumb zgoraj desno. Najprej je želela konkretne argumente, testiranje klikov pa je preložila na kampanjo z več prometa.
To je bila razumna odločitev. Toplotna karta iz nekaj sto sej je skica, ne meritev. Pri skromnem prometu toplotne karte uporabljaj za postavljanje vprašanj, ne za njihovo razreševanje.
Slabega sledenja ne morejo rešiti
Najjasnejši nauk je prišel od znamke morskega mahu, ki je postala viralna na TikToku. Prodaja je bila že v upadu, sledenje pa slabo. Prenova je šla v živo, prihodek pa je še naprej drsel. Šele kasneje so podatki pokazali, da so se kliki na dodajanje v košarico močno povečali, a čistega prometa je bilo premalo, da bi učinek pravilno izmerili.
Dvig je bil resničen, a ga nisem mogel dokazati. Trgovina v upadu lahko pogoltne pristno izboljšavo in je še vedno videti kot neuspeh. Kontekst in sledenje sta pred presojo. Preden zaupaš kateri koli toplotni karti, preveri, da se dogodki v lijaku pravilno sprožajo, in vedi, kakšen je bil trend, preden si karkoli spremenil.
Kdaj namestiti orodje
Toplotne karte niso izhodišče. V enačbi rasti, ki jo uporabljam s strankami Baseline, je rast zmnožek konverzij, hitrosti implementacije in stalne optimizacije. Toplotne karte, posnetki, ankete in A/B testiranje sodijo v tretji del: v fazo "lansirali smo, kaj pa zdaj?".
Če je tvoja stran izdelka strukturno pokvarjena, bo toplotna karta večinoma potrdila, da so ljudje zmedeni. Najprej popravi strukturo. Razčlenitev audita optimizacije konverzij pokriva ta strukturni pregled in to, kam vanj sodijo vedenjski podatki. Ko je stran trdna, postanejo toplotne karte način, kako jo izboljšuješ naprej.
Pogosta vprašanja
Ali lahko Hotjar ali Microsoft Clarity snemata Shopify blagajno?
Na večini paketov ne. Shopifyjev peskovnik za piksle iz strani ne more sestaviti toplotnih kart, dogodki, ki omogočajo posnetke blagajne, pa so omejeni na trgovine Shopify Plus. Microsoft navaja, da Clarity blagajno v trgovinah Plus spremlja prek Shopifyjevega piksla. Na drugih paketih namesto posnetkov uporabi poročilo o lijaku blagajne.
Kako namestim Hotjar ali Clarity na Shopify?
Namesti ponudnikovo aplikacijo iz Shopify App Store. Ta naloži sledilno kodo, ne da bi ti bilo treba urejati temo. Lepljenje kode v theme.liquid deluje, a ostane zunaj Shopifyjeve pasice za privolitev. Izjema je Hotjar: novi računi zdaj gredo prek lastne aplikacije Contentsquare, aplikacija 'Hotjar Install' pa služi le obstoječim Hotjar računom.
Ali orodja za toplotne karte na Shopifyju potrebujejo privolitev za piškotke?
Da, kjer zakon o zasebnosti, ki velja za tvoje kupce, zahteva privolitev. Shopifyjev center za pomoč navaja, da skripte, nameščene ročno ali prek aplikacij, morda potrebujejo pasico tretje osebe ali lastno logiko, da upoštevajo privolitev. Customer Privacy API skripti omogoča, da preveri, ali je analitična obdelava dovoljena, preden začne kogarkoli snemati.
Katero orodje za toplotne karte je najboljše za Shopify trgovino?
Začni s tistim brezplačnim paketom, ki odgovori na vprašanje, ki te trenutno zanima. Microsoft Clarity je brezplačen in nima navedene omejitve prometa. Hotjar ne sprejema več novih računov; njegov naslednik Contentsquare ima brezplačen paket, ki del sej shrani kot posnetke. Aplikacija Lucky Orange za Shopify ima majhen brezplačen paket. Orodje je veliko manj pomembno od vprašanja.
Koliko prometa potrebujem, da so toplotne karte uporabne?
Verodostojnega objavljenega spodnjega praga za toplotne karte ni, zato to, kar vidiš na strani z malo prometa, obravnavaj kot hipotezo. Za A/B test, ki jo potrdi, je moje delovno okvirno pravilo nekaj sto konverzij na različico pri več tisoč sejah. Pod tem pragom so lahko tudi veliki dvigi lažno pozitivni.
Kaj naj najprej pogledam na Shopify toplotni karti?
Začni s stranjo izdelka, ki dobi največ plačanega prometa, in to na mobilnem. Preveri, ali gumb za dodajanje v košarico, izbirnik različic in galerija slik dobijo klike, ki jih pričakuješ, nato poišči elemente, ki niso povezave, a vseeno dobijo veliko klikov. Nepričakovana pozornost je običajno najuporabnejša ugotovitev na karti.
Naj podatke pogleda še en par oči
Nobeno orodje ti ne pove, katero spremembo narediti. Toplotna karta pokaže vedenje, lijak pokaže strošek, nekdo pa mora še vedno odločiti, kaj to pomeni.
To je naloga audita optimizacije konverzij: tvoj lijak, toplotne karte in posnetki, prebrani skupaj in razvrščeni po učinku. Če bi se raje najprej pogovoril, rezerviraj klic in s seboj prinesi stran, zaradi katere te najbolj skrbi.

