arrow_drop_up arrow_drop_down
Meerdere Facebook pixels op één website installeren - Zo doe je dat

Meerdere Facebook pixels op één website installeren - Zo doe je dat

Je installeert meerdere Facebook pixels op één website door de basiscode van beide pixels onder elkaar te zetten in de Head sectie van je website. Dat kun je doen op verschillende manieren:

  1. Zelf de code te programmeren aan de achterkant van je website, tussen de openingstag <head> en sluitingstag </head>.
  2. Een plugin gebruiken voor de Facebook pixel code. Veel mensen hebben een wordpress website en gebruiken de standaard Facebook plugin. Met deze standaard Facebook plugin voor WordPress, kun je maar één pixel installeren. Gebruik daarom een plugin die een naam heeft als ‘Insert Headers and Footers‘. Daarmee kun je meerdere pixelcodes onder elkaar programmeren in je website.
  3. Via Google Tag Manager de beide Facebook pixels toevoegen als 2 losse tags.

 

Hoe pas je de basiscode van de Facebook pixel aan zodat beide pixels goed werken?

Om te voorkomen dat er een pageView of Lead of Purchase dubbel wordt geteld, verander je in de basiscode track naar trackSingle.

Toen je de pixel voor het eerst op je website ging zetten, vond je de code ervan in Advertentiebeheer > Gebeurtenisbeheer > Gegevensbronnen. Als jouw pixel eenmaal goed op je website staat, vind je de basiscode niet meer in Gebeurtenisbeheer. De basiscode vind je op deze pagina en is voor iedereen hetzelfde. Het verschil zit hem in de pixel ID die er in staat.

Zo ziet dat er dan uit:

Normaal staat er voor de pixel ID ‘track’ :

<script>
...base code...
  fbq('init', '1234567890');
  fbq('track', '1234567890');
</script>

En nu verander je de code van fbq ‘track’ naar ‘trackSingle’:

<script>
...base code...
  fbq('init', '1234567890');
  fbq('trackSingle', '1234567890');
</script>

Hoe zet je die twee pixelcodes dan onder elkaar?

Hoe zet je die codes dan onder elkaar, voeg ik me af, nadat ik de uitleg van Yan had gelezen. Na wat testen bleek dit te werken:

Daarvoor heb je 2 opties:

1. In de head of plugin zet je beide stukken codes voor elke pixel gewoon onder elkaar.

Zo:

<!– Facebook Pixel Code –>
<script>alles van pixel 1</script>
<noscript> <img height=”pixel-ID-1″/> </noscript>
<!– End Facebook Pixel Code –>

<!– Facebook Pixel Code –>
<script>alles van pixel 2</script>
<noscript> <img height=”pixel-ID-2″/> </noscript>
<!– End Facebook Pixel Code –>

Je hebt dan wel veel dubbele code en dat is wat overbodig. Hoe je het ook korter kunt opschrijven en coderen, beschrijf ik hieronder.

2. Je voegt de ‘init’ code van de tweede pixel toe aan de basiscode van de eerste pixel

Zo zet je beide fbq ‘init’ codes onder elkaar in de basiscode. Je voegt dus de paars gekleurde code toe aan de basiscode van jouw pixel:


<!-- Facebook Pixel Code -->
<script>
!function(f,b,e,v,n,t,s)
{if(f.fbq)return;n=f.fbq=function(){n.callMethod?
n.callMethod.apply(n,arguments):n.queue.push(arguments)};
if(!f._fbq)f._fbq=n;n.push=n;n.loaded=!0;n.version='2.0';
n.queue=[];t=b.createElement(e);t.async=!0;
t.src=v;s=b.getElementsByTagName(e)[0];
s.parentNode.insertBefore(t,s)}(window, document,'script',
'https://connect.facebook.net/en_US/fbevents.js');
fbq('init', '{pixel-ID-1}');
fbq('init', '{pixel-ID-2}');
fbq('trackSingle', 'PageView');
</script>
<noscript>
<img height="1" width="1" style="display:none"
src="https://www.facebook.com/tr?id={pixel-ID-1}&ev=PageView&noscript=1"/>
<img height="1" width="1" style="display:none"
src="https://www.facebook.com/tr?id={pixel-ID-2}&ev=PageView&noscript=1"/>
</noscript>
<!-- End Facebook Pixel Code -->

Nog makkelijker: Google Tag Manager

Als je Google Tag Manager gebruikt, richt je daar 2 pixels in. Julian heeft helder beschreven hoe je dat doet:

Als je al een Facebook Pixel hebt ingericht, zet je daarin de extra code met de nieuwe pixel ID. Heb je nog niet eerder een Facebook Pixel op je website gezet? Ga dan zo te werk:

  • Maak dan een nieuwe tag aan.
  • Kies voor een Custom HTML Tag configuratie.
  • Kopieer de basiscode die je van Facebook in Gebeurtenisbeheer hebt gekregen en plak die in het lege veld.
  • Kies als Trigger voor All Pages.
  • Sla je tag op.

Omwille van het voorbeeld heb ik in plaats van de 15-cijferige id ‘PIXEL-ID-1’ en ‘PIXEL-ID-2’ geschreven op de plek van de pixel ID’s.

Meerdere Facebook pixels op 1 website inrichten met Google Tag Manager

 

Maak dan een tweede gebeurtenis tag om de pageviews te tracken:

  • Kies voor een Custom HTML Tag configuratie.
  • Plak in het lege veld de pageview tracking code:  fbq(‘trackSingle’, ‘PageView’);
  • Kies als Trigger voor All Pages.
  • Sla je tag op.

Facebook pixel installeren - track Pageview via Google Tag Manager

 

Je codes staat nu goed genoeg. Test of ze werken met de volgende stap.

 

Test de code voordat je hem implementeert

Voordat je een code op je website zet, wil je natuurlijk weten of hij goed werkt. Daarvoor heeft Google Tag Manager de preview modus.

  • Klik rechtsboven op de knop ‘Preview’ (staat naar ‘submit’).
  • Open in een andere tab van dezelfde browser je website.
  • Onderaan zie je nu een code balk (die ziet je klant niet) met daarin de tags die afgevuurd worden.

Als het goed is zie je daarin de basiscode van de pixel en de eventcode voor de trackSingle PageView:

Preview Google Tag Manager van de Facebook codes

 

Als je codes inderdaad goed staan, zie je ook dat Facebook data eruit terugkrijgt. Dat kun je de checken met de Chrome Extension Facebook Pixel Helper:

Check of de codes werken met Facebook Pixel Helper

Check, check, dubbelcheck. Alles staat goed, dus implementeer de code maar op je website! Tik in Google Tag Manager op ‘Submit’, zing je mooiste liedje en tadaa! je Facebook pixel en die van je partner worden nu beide afgevuurd op je website.

 

Hoe zorg je ervoor dat een conversie niet dubbel geteld wordt?

Door trackSingle voor de pixel ID te zetten, voorkom je een dubbele registratie van een event op je webpagina. Daarom pas je de code aan zoals ik hierboven beschreef.

 

Over de schrijver
Wilma Kaptein is marketingcoach voor duurzame ondernemers die meer klanten willen via hun website. Ze wil de wereld verbeteren, mooier en duurzamer maken. Door bedrijven te laten groeien die dááraan werken.  Deze doorpakkers met visie helpt ze 1-op-1 om makkelijker hun ideale klanten te bereiken, om campagnes winstgevend te maken en de website onweerstaanbaar. Zodat bezoekers klant worden.  Wilma werkt vanuit overtuigingspsychologie, neuromarketing en growth hacking met jou aan conversieoptimalisatie en meer klanten.

Makkelijker verkopen met je website?

Met de 10 punten uit deze checklist zet je de eerste stappen naar een overtuigende website. Veel ondernemers verhoogden zo hun conversie. Start direct met de tips en voorkom dat jij leads en klanten misloopt!

50%
Download de Checklist voor Overtuigingskracht
Vul je gegevens in om direct de Checklist in je mailbox te krijgen
Gratis download
Wil je cookies?