Konverteringsspårning med Trackboxx

Med konverteringsspårning från Trackboxx kan du mäta vilka åtgärder besökarna vidtar på din webbplats - t.ex. klick på viktiga länkar, formulär som skickas eller visningar av vissa sidor.
Dessa data hjälper dig att exakt analysera hur framgångsrik din marknadsföring och dina webbplatsåtgärder är.

Viktigt: På Trackboxx erbjuder vi även möjligheten att spåra konverteringar/mål via automatisk spårning. Denna metod är betydligt enklare och kräver ingen ytterligare kod på din webbplats. Klicka här för artikeln – Automatiska mål

Vilka konverteringstyper kan Trackboxx registrera?

Trackboxx stöder följande händelser:

• Klick på länkar, knappar eller menyalternativ
• Visning av vissa sidor (t.ex. en tacksida)
• Formulärinlämningar
• Egna JavaScript-evenemang

Varje konvertering visas i kontrollpanelen med följande uppgifter:

• Konverteringens namn
• Antal aktiveringar
• Värde (valfritt)
• Konverteringsgrad under den valda perioden

1. Skapa konvertering

Så här skapar du ett nytt mål:

1. Klicka på kugghjulet längst upp till höger
2. Välj Webbplatser
3. Välj webbplats och klicka på Mål
4. Klicka på Skapa mål
5. Tilldela namn & beskrivning
6. Du kommer att få en kod som denna:

Detta grundläggande ID integreras senare i lämpliga kodexempel.

2. Klickspårning

Du kan spåra klick på olika sätt.
Trackboxx rekommenderar JavaScript-varianten, eftersom den är stabilare, mer flexibel och mer GDPR-vänlig.

2.1 Klickspårning via JavaScript

a) Spårning via ett CSS-ID

<a href="/kontakt/" id="kontakt-link">Kontakt</a>
Kodspråk: HTML, XML (xml)

Spårningskod:

<script>
document.getElementById('kontakt-link').addEventListener('click', () => {
    trackboxx('trackGoal', 'DEINE-ID');
});
</script>
Kodspråk: HTML, XML (xml)

b) Spårning via en CSS-klass

<script>
document.querySelector('.kontakt-link').addEventListener('click', () => {
    trackboxx('trackGoal', 'DEINE-ID');
});
</script>Kodspråk: HTML, XML (xml)

⚠️ Notera:
querySelector() spår endast det första elementet med den här klassen.

För flera element på samma gång:

<script>
document.querySelectorAll('.kontakt-link').forEach(el => {
    el.addEventListener('click', () => {
        trackboxx('trackGoal', 'DEINE-ID');
    });
});
</script>
Kodspråk: HTML, XML (xml)

2.2 Klickspårning med omedelbar omdirigering (externa länkar, nedladdningar, mailto, tel)

Om en besökare lämnar sidan via en länk omedelbart, kanske webbläsaren inte hinner skicka spårningssignalen.

Lösning:
► Fördröj omdirigeringen kort och genomför den först när spårningssignalen har skickats.

Exempel:

<script>
document.querySelectorAll('.externer-link').forEach(el => {
  el.addEventListener('click', (e) => {
    e.preventDefault();
    trackboxx('trackGoal', 'DEINE-ID');
    setTimeout(() => {
      window.location = el.href;
    }, 150);
  });
});
</script>
Kodspråk: HTML, XML (xml)

Rekommenderas för:

• externa länkar
• PDF-nedladdningar
• Mailto-länkar
• Tel-länkar
• Affiliate-länkar

2.3 Klickspårning via inline-HTML (onclick)

Den här metoden fungerar, men är inte optimal:

<a href="/kontakt/" onclick="trackboxx('trackGoal', 'DEINE-ID');">Kontakt</a>
Kodspråk: HTML, XML (xml)

⚠️ Nackdelar:

• svårare att underhålla
• skrivs ofta över av sidbyggare
• tekniskt mindre tillförlitlig

Rekommendation: JavaScript istället för inline.

3. Sidvisningar (konverteringar baserade på sidvisningar)

För att mäta hur ofta en viss sida besöks:

<script>
document.addEventListener('DOMContentLoaded', () => {
    trackboxx('trackGoal', 'DEINE-ID');
});
</script>
Kodspråk: HTML, XML (xml)

Idealisk för:

• Tacksidor
• Orderbekräftelser
• Bekräftelsesidor efter skickat formulär

4. Formulärspårning

Det finns fyra sätt:

4.1 Övervaka formuläret via onsubmit (om åtkomst är möjlig)

<form onsubmit="trackboxx('trackGoal', 'DEINE-ID');">
Kodspråk: HTML, XML (xml)

Enkelt - fungerar överallt där HTML kan redigeras.

4.2 Spåra formulärutskick via JavaScript

Om eventListener krävs:

<script>
document.querySelector('#kontaktformular').addEventListener('submit', () => {
    trackboxx('trackGoal', 'DEINE-ID');
});
</script>
Kodspråk: HTML, XML (xml)

4.3 Formulärsystem med egen logik för lyckad inlämning (t.ex. smarta byggverktyg)

<script>
sk('form', 'init', {
  onSuccess: function() {
    trackboxx('trackGoal', 'DEINE-ID');
  }
});
</script>
Kodspråk: HTML, XML (xml)

→ Fungerar med verktyg som har en egen ”success”-hook.

4.4 Spårning via tacksida (alternativ lösning)

Om inget av detta fungerar:

1. Formuläret skickas utan fel
2. Omdirigera till en ny sida (t.ex. /tack/)
3. Lägg in spårningskoden för sidvisningar på den sidan

Detta är den mest universella lösningen.

5. WordPress-specifik spårning

5.1 Spårning av menyklick via CSS-klass

Tilldela till exempel den här CSS-klassen till ett menyalternativ i WordPress:

CSS-Klasse: neu-hier
Kodspråk: HTTP (http)

Spårning:

<script>
document.querySelector('.neu-hier').addEventListener('click', () => {
    trackboxx('trackGoal', 'DEINE-ID');
});
</script>
Kodspråk: HTML, XML (xml)

Automatisk generator för konverteringskod

// Ange ditt konverterings-ID först.

Relaterade artiklar:

Spåra Google Ads / Facebook Ads via UTM - I den här artikeln visar vi dig hur du kan spåra och analysera dina betalda kampanjer på Google eller Meta/Facebook med Trackboxx.