Skip to content

Allt om WordPress, webbutveckling — och mer därtill

🚀 Så här ställer du in Google Tag Manager för WordPress

🚀 Så här ställer du in Google Tag Manager för WordPress

Du öppnar WordPress-adminpanelen, startar temaredigeraren och klistrar in ännu ett JavaScript-kodavsnitt i header.php. Låter det bekant? En månad senare har du ett dussin sådana kodavsnitt: analys, annonspixlar, chattwidgetar, heatmaps. Sajten blir tyngre, och att reda ut den trassliga koden blir allt svårare.

Google Tag Manager löser detta problem radikalt: istället för ett dussin taggar utspridda i temafiler får du en enda container och ett webbgränssnitt för att hantera allt från ett ställe. Inga kodändringar, inget behov av att ringa en utvecklare, ingen risk att förstöra layouten.

Nedan följer en steg-för-steg-guide för att installera GTM på WordPress: den manuella metoden, plugin-metoden och konfiguration av Google Analytics 4 utan en enda rad kod på din sajt.

💡 Snabb översikt:

  • Skapa ett kostnadsfritt Google Tag Manager-konto och få en container med två installationskoder
  • Lägg till koderna i WordPress: manuellt via header.php (2 minuter) eller via GTM4WP-pluginet (1 minut, inga temaredigeringar)
  • Anslut Google Analytics 4 inuti GTM: en "GA4-konfiguration"-tagg plus en "Alla sidor"-utlösare, inte en enda rad JS på din sajt
  • Testa via GTM:s förhandsgranskningsläge, publicera containern, så fungerar alla taggar

Vad är Google Tag Manager

Google Tag Manager är ett kostnadsfritt tagghanteringssystem från Google. Istället för att placera varje spårningskod direkt på din sajt lägger du till dem i GTM:s webbgränssnitt och installerar bara ett kodavsnitt på din sajt: GTM-containern.

En tagg i digital spårningskontext är ett JavaScript-kodavsnitt som aktiverar tredjepartsfunktioner: trafikanalys, annonskampanjer, chattwidgetar, heatmaps. De kallas också webb-beacons eller spårningspixlar. Ett klassiskt exempel är Google Analytics-koden du lägger till på din sajt för att spåra besök.

Tagg-leverantörer är plattformar som Google Analytics, Google Ads, Meta (Facebook), LinkedIn, Hotjar och dussintals andra. Var och en erbjuder sitt eget JS-kodavsnitt. Utan ett tagghanteringssystem lever alla dessa kodavsnitt direkt i din WordPress-temakod.

Varför du behöver Google Tag Manager

Den traditionella metoden att manuellt redigera header.php, functions.php och andra temafiler skapar tre problem.

För det första, sajthastighet. Varje tredjeparts JS-skript lägger till tyngd på sidan och ökar laddningstiden. Ett dussin taggar från olika leverantörer, och Sajthastighet i Google Search Console blir röd.

För det andra, säkerhet. Taggar från opålitliga källor utsätter din sajt för XSS-attacker och dataläckor. Och du vet inte alltid vad som faktiskt finns inuti nästa kopierade kodavsnitt.

För det tredje, underhåll. Leverantören uppdaterar sin spårningskod, och du måste gräva i temafiler och ersätta den manuellt. Ett felaktigt tecken och taggen slutar fungera, data går förlorad.

Google Tag Manager eliminerar alla tre problemen:

  • En container istället för ett dussin taggar. På din sajt finns bara ett par rader GTM-kod. All tagglogik finns i molngränssnittet.

  • Konfiguration utan utvecklare. GTM-gränssnittet är intuitivt: välj taggtyp, ange spårnings-ID, tilldela en utlösare, klart. Inte en enda rad kod på din sajt.

  • Inbyggda integrationer. GA4, Google Ads, Floodlight, dussintals tredjepartsmallar: du väljer från en lista istället för att kopiera kod.

  • Förhandsgranskningsläge och felsökning. Innan publicering ser du vilka taggar som avfyrades på sidan och vilken data de skickade. Konfigurationsfel syns omedelbart, inte en vecka senare i rapporter.

  • Versionshantering. GTM lagrar historiken för alla publicerade containerversioner. Att rulla tillbaka en misslyckad konfiguration tar två sekunder.

Den kostnadsfria versionen av GTM täcker behoven för de allra flesta sajter. Den betalda versionen (Google Tag Manager 360) lägger till utökad support och högre gränser för stora företagsprojekt, men för en WordPress-sajt av vilken skala som helst är gratisnivån mer än tillräcklig.

GTM har en inlärningskurva, och gränssnittet kan verka överväldigande till en början. Men grundläggande scenarier (GA4 plus ett par marknadsföringstaggar) kan bemästras på en timme. För djupare inlärning finns en rekommenderad YouTube-video i slutet av detta inlägg.

Så konfigurerar du Google Tag Manager för WordPress

Härnäst följer två installationsmetoder: manuell (via temafil) och via GTM4WP-pluginet. Båda fungerar; välj baserat på dina arbetsflödespreferenser.

Skapa ett Google Tag Manager-konto

Det första steget är ett kostnadsfritt GTM-konto. Det ger dig en container och ett ID som du behöver för WordPress-integrationen.

Gå till Google Tag Managers webbplats och logga in med ditt Google-konto.

Google Tag Manager startsida

Klicka på "Skapa konto" i GTM-administratörspanelen.

Knapp för att skapa konto i GTM

Ange kontonamnet (till exempel ditt företagsnamn), välj ditt land och klicka på "Fortsätt".

GTM-formulär för att skapa konto med landsval

Ange sedan containerns namn (vanligtvis din sajtdomän), välj "Webb" som målplattform och klicka på "Skapa".

Namninställning för container och webbval

Acceptera Google Tag Managers användarvillkor och databehandlingsvillkor.

Godkännande av GTM:s användarvillkor

Efter bekräftelse visas ett popup-fönster med två installationskoder. Stäng inte den här fliken; du behöver koderna i nästa steg.

Popup med GTM-containerns installationskoder

GTM visar instruktioner för hur du placerar koderna: den första så högt upp som möjligt i <head>, den andra direkt efter den inledande <body>-taggen. Låter enkelt, men för en WordPress-nybörjare är det kanske inte självklart. Nedan går vi igenom båda metoderna.

Viktigt innan du fortsätter:

Manuell GTM-installation via header.php

Gå till "Utseende → Temaredigerare" i WordPress adminpanel.

Utseende, Redigerarmeny i WordPress adminpanel

Skärmbilden visar ett child theme med filerna header.php (sidhuvud), footer.php (sidfot), rtl.css och 404.php. Vi lägger in GTM-koderna i header.php.

Klicka på "Theme Header (header.php)" i filnavigeringspanelen till höger.

header.php-fil öppnad i WordPress temaredigerare

Följ GTM-instruktionerna: den första koden så högt upp som möjligt i <head>, den andra direkt efter den inledande <body>-taggen. I WordPress ser <body>-taggen vanligtvis ut som <body <?php body_class(); ?>>.

Kopiera den första koden från GTM och klistra in den högt upp i <head>.

Infogning av den första GTM-koden i head-sektionen av header.php

Kopiera den andra koden och klistra in den direkt efter den inledande <body>-taggen.

Infogning av den andra GTM-koden efter öppnande body-tagg

Klicka på "Uppdatera fil" längst ner på skärmen. Klart, GTM är installerat på din webbplats manuellt. Hela processen tar ett par minuter.

Vill du inte röra temafiler? Härnäst kommer tilläggsmetoden, som gör samma sak utan en enda kodredigering.

Installation via tillägget GTM4WP

GTM4WP (Google Tag Manager for WordPress, skapare: DuracellTomi) är det populäraste pluginet för att integrera GTM i WordPress: över 700 000 aktiva installationer, uppdaterat sedan 2013. Det lägger inte bara in containerkoderna utan skapar också ett datalager för WooCommerce, kontaktspårning och andra scenarier.

I WordPress adminpanel går du till "Plugins → Lägg till nytt."

Tillägg, Lägg till nytt-meny i WordPress adminpanel

Skriv "Google Tag Manager for WordPress" i sökfältet och klicka på "Installera nu."

Sökning efter GTM4WP-tillägg i WordPress arkiv

Efter installationen klickar du på "Aktivera."

Aktiveringsknapp för GTM4WP-tillägg

Ett meddelande visas högst upp på skärmen där du uppmanas att ange ditt GTM-ID. Klicka på länken i meddelandet.

Notis om att ange GTM-ID efter tilläggsaktivering

Ditt GTM-ID hittar du i ditt Google Tag Manager-konto, i toppanelen bredvid containerns namn. Format: GTM-XXXXXXX.

GTM-container-ID i Google Tag Managers gränssnitt

Kopiera ID:t, gå tillbaka till WordPress adminpanel, klistra in det i motsvarande fält på pluginets inställningssida och klicka på "Spara ändringar."

Fält för att ange GTM-ID i GTM4WP-tilläggets inställningar

Klart. Pluginet placerade automatiskt båda GTM-koderna på rätt ställen; du behövde inte öppna en enda PHP-fil.

Nu när GTM-containern finns på din webbplats sätter vi upp datainsamling via Google Analytics 4.

Så här ansluter du Google Analytics 4 via Google Tag Manager

Tidigare använde GTM taggen "Universal Analytics"; den slutade samla in data i juli 2024. Det enda aktuella alternativet är Google Analytics 4 (GA4). Det ställs in i tre steg: skapa en tagg, ange mät-id och tilldela en utlösare.

Om din webbplats fortfarande har gammal Universal Analytics-kod (funktionen gtag('config', 'UA-XXXXX-Y') i header.php eller infogad via ett plugin), ta bort den först. Annars kommer GA4 och Universal Analytics att duplicera data, vilket förvränger dina rapporter.

Gå tillbaka till ditt GTM-konto och klicka på "Taggar" i menyn till vänster.

Taggsektion i Google Tag Managers sidomeny

Klicka på "Ny" (knappen Skapa).

Knapp för att skapa ny tagg i GTM-gränssnittet

Namnge taggen (till exempel "GA4, Sidvisningar") och klicka på fältet "Taggkonfiguration" för att välja taggtyp.

Konfigurationsfönster för ny tagg i GTM

I listan över taggtyper väljer du "Google Analytics: GA4-konfiguration." Specifikt GA4, inte Universal Analytics. GTM-gränssnittet uppdateras regelbundet, så placeringen av objekt kan skilja sig något från skärmbilderna, men logiken är densamma.

Val av Google Analytics-taggtyp i GTM

Du kommer tillbaka till taggkonfigurationen. I fältet "Mät-id" anger du ditt GA4-mät-id (format: G-XXXXXXXXXX). För att undvika att hårdkoda det i varje tagg, skapa en variabel: detta är GTM-best practice.

Val av Sidvisning som GA4-spårningstyp

Välj "Ny variabel" och i fönstret som öppnas anger du ditt mät-id från Google Analytics 4. Namnge variabeln något i stil med "GA4 Mät-id."

Skapa en ny variabel för GA4-identifierare

För att hitta ditt mät-id loggar du in på ditt Google Analytics-konto och väljer rätt egendom.

Välja en egendom i Google Analytics-konto

Gå till "Admin" → "Egenskapsinställningar" → "Dataströmmar" → välj webbströmmen. Mät-id:t börjar med G- och visas i det övre högra hörnet av strömkortet.

Spårningsidentifierare i Google Analytics-inställningar

Kopiera mät-id:t, klistra in det i variabelfältet och klicka på "Spara."

Spara variabeln med GA4-identifierare i GTM

Nu tilldelar vi en utlösare, villkoret för när taggen aktiveras. Klicka på sektionen "Utlösare."

Utlösarsektion i GTM-taggkonfiguration

För att spåra alla sidvisningar väljer du den inbyggda utlösaren "Alla sidor."

Välja utlösaren Alla sidor i GTM

Klicka på "Spara". GA4-taggen är klar men ännu inte publicerad.

Testa och publicera taggen

Innan du skickar containern till produktion, testa taggen i förhandsgranskningsläge. Klicka på knappen "Förhandsgranska" i det övre högra hörnet.

Förhandsgranskningsknapp i Google Tag Managers gränssnitt

GTM går in i felsökningsläge. Ladda om din webbplats; längst ner i webbläsarfönstret öppnas GTM-konsolen och visar att GA4-taggen avfyrades vid sidladdning.

GTM-felsökningskonsol med information om avfyrade taggar

För att bekräfta att data når GA4, öppna Google Analytics och gå till "Rapporter → Realtid". Du ser sidvisningen du just genererade genom att ladda om webbplatsen.

Google Analytics realtidsrapport med aktiv vy

Data flödar. Du har inte lagt till en enda rad JS på din webbplats; allt hanteras inuti GTM-containern.

Publicera nu containern så att taggen fungerar för alla besökare. Klicka på "Skicka" i det övre högra hörnet.

Publiceringsknapp för container i GTM

I fönstret som visas ger du versionen ett meningsfullt namn (till exempel "GA4 sidvisningstagg v1") och en beskrivning.

Namngivningsfönster för containerversion före publicering

Klicka på "Publicera". Efter publicering visas den aktiva containerversionen med en grön indikator.

Det var allt, GA4 samlar in data från din WordPress-webbplats via Google Tag Manager. Andra taggar läggs till med samma process: välj typ, ange parametrar, tilldela en utlösare, testa, publicera. GTM hanterar ordningen och laddningstiden för varje tagg automatiskt.

Om du vill fördjupa dig i GTM:s funktioner (från klickhändelser till YouTube-spelarspårning och Google Ads-integration) kan du titta på den här videohandledningen: den täcker hela installationscykeln för GA4 + GTM på WordPress.

⁉️🤔 Vanliga frågor

Hur skiljer sig Google Tag Manager från Google Analytics?

Google Analytics samlar in data om besökare: sidvisningar, trafikkällor, konverteringar. Google Tag Manager samlar inte in data själv; det är en kurir som levererar taggar till din webbplats. GTM förenklar installation och uppdatering av dussintals marknadsföringsverktyg från ett enda webbgränssnitt, medan GA4 bearbetar den insamlade datan i rapporter.

Måste jag använda GTM4WP-tillägget eller kan jag klara mig utan det?

Du kan klara dig utan ett tillägg genom att manuellt infoga de två GTM-koderna i header.php. GTM4WP-tillägget är bekvämare: det tappar inte inställningar när du byter tema, lägger till ett datalager för WooCommerce och kontaktformulär samt placerar automatiskt koder på rätt platser. Valet beror på hur ofta du byter tema och om du behöver ett färdigt datalager direkt.

Vad är ett datalager och varför behöver jag det?

Datalager är ett JavaScript-objekt, ett lager mellan din webbplats och GTM. Det skickar strukturerad data: produkt-ID, orderbelopp, händelsetyp. GTM läser datalagret och avgör vilken tagg som ska avfyras när. Utan ett datalager spårar du sidvisningar; med det spårar du varje användaråtgärd med exakta belopp och produktnamn.

Är Google Tag Manager gratis?

Ja, grundversionen är helt gratis utan begränsningar för taggar, utlösare eller trafikvolym. Den betalda Tag Manager 360 ($150 000 per år, enligt den officiella Google Marketing Platform-sidan) lägger till utökad support och SLA för företagsteam. För en WordPress-webbplats av vilken storlek som helst är gratisversionen mer än tillräcklig.

Behöver jag ta bort den gamla Universal Analytics-koden innan jag ställer in GA4?

Absolut. Universal Analytics slutade bearbeta data i juli 2024. Gammal UA-XXXXX-Y-kod som finns kvar i header.php eller ett tillägg duplicerar data med GA4 och förvränger rapporter. Efter att du ställt in GA4, kontrollera avsnittet "Admin → Datajämförelse" i Google Analytics: frånvaron av avvikelser mot förväntad trafik bekräftar att den gamla koden har tagits bort.

Hur kontrollerar jag att GTM fungerar efter installationen?

Tre metoder: öppna sidans källkod (Ctrl+U) och sök efter GTM- i <head>; containern ska finnas där. Installera Chrome-tillägget Google Tag Assistant Legacy; det visar alla aktiva taggar på sidan. Aktivera förhandsgranskningsläge i GTM, ladda om din webbplats och bekräfta att felsökningskonsolen visar en grön "Ansluten"-status.

Vad du bör installera på WordPress sammanfattningsvis

Google Tag Manager är ett verktyg som sparar timmar varje gång du ändrar en marknadsföringstagg. Istället för att "gå in i koden, hitta rätt fil, ersätta snippet, kontrollera att inget gick sönder", öppnar du ett webbgränssnitt, redigerar tagginställningarna och klickar på "Publicera". Ingen tillgång till webbhotell, ingen temaredigerare, ingen risk att krascha din webbplats med ett felplacerat kommatecken i PHP.

Det viktigaste scenariot för en WordPress-webbplats: installera GTM via GTM4WP-tillägget (en gång, två minuter), lägg till en GA4-tagg (en gång, fem minuter med testning), så fungerar analysen. Sedan lägger du till Hotjar, Google Ads, LinkedIn Insight Tag och andra pixlar vid behov utan att röra din webbplats kod.

Börja med GA4 och förhandsgranskningsläge för att bekräfta att data flödar. Utforska sedan GTM:s inbyggda taggmallar: det finns dussintals färdiga integrationer som tidigare krävde att man manuellt placerade JS på varje sida.