Per installare pixel facebook senza l’uso di plugin aggiuntivi ci sono alcuni requisiti indispensabili:
Come indicato sopra ppuoi recuperare o creare il codice del pixel facebook da inserire nel tuo sito direttamente seguendo la guida ufficiale ma i passaggi sono molto semplici
Una volta creato il vostro pixel selezioniamo “Aggiungi manualmente il codice pixel al sito web” e ci verrà chiesto di copiare e incollare un codice come questo che segue prima della chiusura dell <head> del nostro sito, per ora noi lo copiamo cosi nudo e crudo.
<!-- 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', 'XXXXXXXXXXXXXX');
fbq('track', 'PageView');
</script>
<noscript><img height="1" width="1" style="display:none"
src="https://www.facebook.com/tr?id=XXXXXXXXXXXXXX&ev=PageView&noscript=1"
/></noscript>
<!-- End Facebook Pixel Code -->
Ora esattamente come abbiamo fatto nella precedente guida per google analytics prendiamo il nostro codice e lo inseriamo nel function.php.
Vai in Aspetto > editor del tema > Selezioni il tema child in alto a destra (che deve essere attivo) > selezioni function.php > e copi lo snippet qui sotto ricordati di sostituire il codice del facebook pixel con quello che abbiamo recuperato prima.
function ns_fb_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', 'XXXXXXXXXXXXXX');
fbq('track', 'PageView');
</script>
<noscript><img height="1" width="1" style="display:none"
src="https://www.facebook.com/tr?id=XXXXXXXXXXXXXX&ev=PageView&noscript=1"
/></noscript>
<!-- End Facebook Pixel Code -->
<?php
}
add_action( 'wp_head', 'ns_fb_pixel', 10 );
clicca su aggiorna in basso ed il tu pixel sarà installato ed attivo su tutte le pagine del tuo sito.
Il pixel che abbiamo creato in precedenza è quello standard di facebook ma, a volte, può essere necessario installare anche un pixel di conversione o codici diversi in pagine specifiche come ad esempio nelle (thank you page o nelle pagine di checkout di un ecommerce) anche questo passaggio e semplice basta modificare il codice come segue aggiungendo un “if ( is_page(IDXX)”
function ns_codice_pagina() {
if ( is_page(IDXX) ) {
?>
<!-- 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', 'XXXXXXXXXXXXXX');
fbq('track', 'PageView');
</script>
<noscript><img height="1" width="1" style="display:none"
src="https://www.facebook.com/tr?id=XXXXXXXXXXXXXX&ev=PageView&noscript=1"
/></noscript>
<!-- End Facebook Pixel Code -->
<?php
}
}
add_action( 'wp_head', 'ns_codice_pagina', 10 );
Sostituendo “IDXX” con l’id della pagina dove vi interessa avere il codice
L’ID pagina lo potete recuperare facilmente da back end andando modifica in pagina e prendendo il valore numerico dopo “post=”
Come hai notato dal codice sopra abbiamo usato una function ‘ns_codice_pagina’ che viene attivata da un add_action sull’ hook ‘wp-head’:
add_action( 'wp_head', 'ns_codice_pagina', 10 );
Questo è uno dei grandi vantaggi di wordpress con la stessa funzione potremmo andare a richiamare molte altre cose all’interno del nostro wp_head come ad esempio google analytics, css, e molto altro e sceglierne anche il posizionamento cambiando l’ultimo valore ’10’ che vediamo nell’esempio.