HTML-fält: infoga Cookiebot, GTM och andra skript i din webbutik
Så här använder du Shoporama HTML-fält för att infoga Cookiebot, Google Tag Manager, Facebook Pixel, chattwidgets och annan anpassad HTML/JavaScript i din webbutik.
Behöver du en Cookiebot, Google Tag Manager, Facebook Pixel, en chattwidget eller en verifieringskod från Google Search Console i din webbshop? Det gör du via HTML-fält i Shoporama. Här kan du infoga koden som du har fått från en tredje part och välja om den automatiskt ska infogas i sidans <head> eller <body>.
Så här hittar du HTML-fält
- Klicka på kugghjulet i det övre högra hörnet för att öppna Inställningar
- Välj Online Shop från menyn
- Klicka på HTML-fält
Så här skapar du ett HTML-fält
- Klicka på Lägg till nytt HTML-fält
- Ge fältet ett beskrivande namn utan mellanslag, t.ex. cookiebot, chat_widget eller gsc_verify. Namnet används som taggnamn om du senare vill anropa fältet manuellt i ett tema
- Klistra in din kod i textfältet
- Välj plats:
- Infogai slutet av <head> för verifieringstaggar, Cookiebot och skript som måste laddas tidigt
- Lägg till sist i <body> för chattwidgets och skript som behöver vänta
- Lägg inte till automatiskt om du vill styra placeringen i ett privat tema
- Klicka på Spara
Tips: Du kan ta bort ett fält genom att tömma innehållet och klicka på Spara.
Typiska användningsområden
- Cookiebot - banner för samtycke till cookies. Om du infogar den först i <head> kan den blockera andra spårningsskript tills kunden har gett sitt samtycke
- Google Search Console / Bing Webmaster Tools - metataggar för verifiering som bekräftar att du äger domänen
- Hotjar, Microsoft Clarity, Mouseflow - värmekartor och sessionsinspelningar
- Chattwidgets - Tidio, Zendesk Chat, Intercom, Drift och liknande
- Anpassad HTML, CSS eller JavaScript - smarta extrafunktioner i din egen design
HTML-fält eller Tracking - vad ska jag använda?
Shoporama har även en sida under Inställningar → Webbshop → Spårning med färdiga fält för de vanligaste verktygen:
- Google Tag Manager (GTM-ID)
- Google Analytics 4 (Mätnings-ID)
- Google Ads konverterings-ID
- Google Merchant ID
- Facebook Pixel ID och Conversion API
Om du bara har ett ID för ett av dessa verktyg anger du det under Tracking. Shoporama kommer automatiskt att ta hand om korrekta inställningar och e-handelshändelser. Använd endast HTML-fält när du har en kod som inte passar in i något av de fasta fälten, till exempel Cookiebots fullständiga skript eller en verifieringstagg.
Inbyggd spårning på serversidan: Shoporama har sin egen spårningslösning på serversidan (sGTM via Stape). Du behöver inte konfigurera en Tag Manager själv - aktivera bara spårning på serversidan under Spårning, ange dina ID:n för GA4, Facebook och Google Ads, så skickar Shoporama e-handelshändelser på serversidan. Du får också cookie-less signalering i avsaknad av samtycke. Tillval från 89 kr/md ex. MOMS.
Egen GTM: Om du föredrar att hantera allt själv i din egen Google Tag Manager-container kan du infoga ditt GTM-ID under Tracking och hantera Cookiebot, Pixel, Hotjar etc. i GTM. De två lösningarna bör inte köras samtidigt.
Använda HTML-fält manuellt i ett tema
Om du har ett privat tema och vill placera ett HTML-fält på en specifik plats i din mall ställer du in fältet på Lägg inte till automatiskt och kallar taggnamnet i din Smarty-mall:
<{$webshop->getHtmlField('cookiebot')}>Innehållet återges i råformat, så <script>-taggar fungerar som förväntat. Kom ihåg att stänga av automatisk infogning, annars kommer fältet att inkluderas två gånger.
HTML-fält på andra ställen än i webbshoppen
Det HTML-fält som du skapar under Inställningar → Webbshop gäller för hela webbshopen. Om du bara vill ha ett skript på enskilda produkter, kategorier, sidor, blogginlägg eller landningssidor kan du skapa HTML-fält direkt på dessa objekt under deras respektive redigeringssidor. Detta är praktiskt för t.ex. schemamarkup eller en kampanjpixel som bara behöver avfyras på en landningssida.
Viktigt om säkerhet och hastighet
- Infoga endast kod från källor som du litar på. Dåligt eller felaktigt JavaScript kan påverka hela butiken, inklusive kassan
- Varje extra skript kostar i sidhastighet. Använd async eller defer om tredje part rekommenderar det
- Testa alltid på din shop i efterhand, till exempel genom att högerklicka i webbläsaren och välja Visa källkod för att se att koden finns med
Vanliga frågor och svar
Var hittar jag HTML-fält i admin?
Gå till Inställningar → Webbshop → HTML-fält. Om menyalternativet inte är synligt kan din användare sakna rättigheter - fråga den person som konfigurerade dig.
Kan jag förstöra min butik genom att mixtra med HTML-fält?
Du rör inte dina produkter, beställningar och kunder. I värsta fall kan en felaktig kodsnutt få sidor att se konstiga ut eller påverka prestandan. Rensa fältet och spara, så är det borta igen.
Hur testar jag om mitt HTML-fält fungerar?
Öppna butiken i en privat webbläsarflik, högerklicka och välj Visa källkod. Leta upp en del av din kod (t.ex. en kommentar eller ett tagg-ID). För spårningsskript kan du installera webbläsartillägg som Tag Assistant (GTM/GA4) eller Pixel Helper (Facebook).
Hur tar jag bort ett HTML-fält som jag inte längre använder?
Töm hela innehållet i fältet och klicka på Spara. Fältet kommer att försvinna. Kontrollera först att taggnamnet inte är manuellt kallat någonstans i ett privat tema, annars kan du få en tom ruta eller ett felmeddelande.
Vad är skillnaden mellan Inställningar → Spårning och HTML-fält?
Spårning har färdiga fält för de vanligaste verktygen (GA4, Facebook Pixel, Google Ads, Microsoft Ads etc.) där du helt enkelt infogar ditt ID. På samma ställe aktiverar du Shoporamas inbyggda spårning på serversidan så att du inte behöver underhålla en Tag Manager-container själv. HTML-fält är den kostnadsfria lösningen för allt annat - som Cookiebot, verifieringskoder och chattwidgets. Om du har valet, använd Tracking - Shoporama ansluter de officiella integrationerna korrekt.
Ska Cookiebot placeras i <head> eller <body>?
Cookiebot bör sättas in först i <head> för att blockera spårningsskript tills kunden har gett sitt samtycke. Välj därför Infoga sist i <head> i HTML-fältet. Följ sedan Cookiebots egna instruktioner för att märka andra skript med samtyckesattribut.
Påverkar HTML-fält sidhastigheten?
Ja - varje extra skript kostar i laddningstid och kan påverka Core Web Vitals. Håll nere antalet, använd async eller defer där det är möjligt, och överväg att samla flera skript i Google Tag Manager så att de laddas på ett ställe.
Måste jag ställa in det igen i var och en av mina e-handelsbutiker?
Ja - HTML-fälten är per onlinebutik. Om du vill hålla det konsekvent i flera butiker är det enklaste sättet att lägga allt i en GTM-container och bara infoga GTM-ID under Tracking i varje butik.
Om du har några frågor är du välkommen att kontakta oss på support@shoporama.dk.
Relaterade artiklar
Spårning på serversidan i Shoporama
Guide till hur du ställer in spårning på serversidan i din Shoporama-webbshop för bättre datakvalitet.
Samtycke till cookies och samtyckesläge v2
Guide till hur du ställer in cookie-samtycke med Google Consent Mode v2 i Shoporama för att följa GDPR och optimera din spårning.
Samtycke till cookies och GDPR
Guide till cookie-samtycke och GDPR i Shoporama, inklusive Google Consent Mode v2, cookie-kategorier och återkallande av samtycke.
Avtal om databehandling
Guide för att godkänna databehandlingsavtalet med Shoporama enligt GDPR.