Cómo insertar el píxel de seguimiento de Facebook

Si has llegado hasta aquí ya sabrás que Facebook Ads te permite crear un píxel de seguimiento de tus campañas de anuncios para tu ecommerce.

En esta entrada veremos cómo insertar el píxel de seguimiento de Facebook para Opencart ya que no he visto como hacerlo en ninguna web de habla hispana, pero valdría para cualquier ecommerce. Creo que puede ser interesante orientar a la personas que utilicen Opencart a poner el código de seguimiento en su tienda.

Para lograrlo vamos a hacerlo en dos partes que te resumo a continuación, primero configuraremos una campaña de Facebook Ads en la que veremos tanto el editor del pixel, cómo la segmentación de anuncios, y el pixel de facebook, después obtendremos el código de seguimiento y como insertarlo en tu ecommerce, que en este caso será tienda online tipo Opencart

Configurar campaña de Facebook Ads

Primero, antes de ponernos con el código de seguimiento tenemos que conseguir el código de la página de Facebook Ads.

Para esto tienes que configurar una campaña en el administrador de anuncios de Facebook.

Sería aquí.

Como ya habrás visto Facebook nos da la opción de crear diferentes tipos de anuncios, pero en esta caso solo nos interesa el tipo anuncio para atraer personas a tu web y que realicen una compra, por lo que vamos a seleccionar el botón de comprar.

Después crearemos el anunció con su titulo y datos, y por último cogeremos el pixel de seguimiento de conversión que hemos hecho en el editor de píxel que nos da Facebook, dónde le pondremos un nombre.

El pixel de facebook

Cómo es una tienda online es obvio que necesitamos elegir el tipo de píxel pago, ya que será el que nos interesa para poder realizar el seguimiento de las personas que vienen de este anuncio y realizan el pago.

Segmentación de los anuncios en Facebook

Facebook Ads nos permite segmentar el público al que quieres que llegue tu anuncio, eso reducirá considerablemente el alcance del anuncio pero mejorará considerablemente el público destino.
Al igual que Adwords tambien te permite segmentar los anuncios para las distintos target:

• Puedes seleccionar la edad, idioma y sexo de segmentación.
• Puedes seleccionar la ubicación.
• Puedes seleccionar a los usuarios destino, eligiendo el/ los usuarios que verán los anuncios
• Puedes seleccionar de una lista de email, como puede ser mail chimp o benchmark los emails de las personas que verán tu anuncio

Insertar el código de seguimiento en Opencart

Cómo ya habrás sospechado necesitamos insertar el código de seguimiento píxel de Facebook justo cuando se realiza la compra, cuando la compra se ha realizado correctamente, así estaremos seguros cuales son los usuarios que han comprado en nuestra web viniendo de Facebooks Ads, y saber si la campaña está saliendo correctamente.

Para esto tendrás que insertar el código de seguimiento en el archivo success.tpl de tu ecommerce.

El código es el siguiente, que en tu caso te lo dará la página de Facebook, así que tendrá otro código de seguimiento:

 
<!-- Facebook Conversion Code for clientes desde el face a web -->
<script>(function() {
var _fbq = window._fbq || (window._fbq = []);
if (!_fbq.loaded) {
var fbds = document.createElement('script');
fbds.async = true;
fbds.src = '//connect.facebook.net/en_US/fbds.js';
var s = document.getElementsByTagName('script')[0];
s.parentNode.insertBefore(fbds, s);
_fbq.loaded = true;
}
})();
window._fbq = window._fbq || [];
window._fbq.push(['track', 'XXXXXXXX', {'value':'0.01','currency':'EUR'}]);
</script>
<noscript><img height="1" width="1" alt="" style="display:none" src="https://www.facebook.com/tr?ev=XXXXXXXXXX&amp;cd[value]=0.01&amp;cd[currency]=EUR&amp;noscript=1" /></noscript>

El tuyo será similar a este:

Ops!, pues no me quiero liar que yo de código no entiendo, pues fácil te lo doy gratis hecho. Solo tienes que ayudarme a promocionar un poco este post, con una acción social y yo te hago el trabajo sucio 🙂

<?php echo $header; ?>
<?php if (isset($this->request->get['route']) && $this->request->get['route'] == 'checkout/success') { ?>
 
<!-- Facebook Conversion Code for clientes desde el face a web -->
<script>(function() {
var _fbq = window._fbq || (window._fbq = []);
if (!_fbq.loaded) {
var fbds = document.createElement('script');
fbds.async = true;
fbds.src = '//connect.facebook.net/en_US/fbds.js';
var s = document.getElementsByTagName('script')[0];
s.parentNode.insertBefore(fbds, s);
_fbq.loaded = true;
}
})();
window._fbq = window._fbq || [];
window._fbq.push(['track', '6011533719452', {'value':'0.01','currency':'EUR'}]);
</script>
<noscript><img height="1" width="1" alt="" style="display:none" src="https://www.facebook.com/tr?ev=6011533719452&amp;cd[value]=0.01&amp;cd[currency]=EUR&amp;noscript=1" /></noscript>
 
<?php } ?>
 
<?php echo $column_left; ?><?php echo $column_right; ?>
<div id="content"><?php echo $content_top; ?>
  <div class="breadcrumb">
    <?php foreach ($breadcrumbs as $breadcrumb) { ?>
    <?php echo $breadcrumb['separator']; ?><a href="<?php echo $breadcrumb['href']; ?>"><?php echo $breadcrumb['text']; ?></a>
    <?php } ?>
  </div>
  <h1><?php echo $heading_title; ?></h1>
  <?php echo $text_message; ?>
  <div class="buttons">
    <div class="right"><a href="<?php echo $continue; ?>" class="button"><?php echo $button_continue; ?></a></div>
  </div>
  <?php echo $content_bottom; ?></div>
 
<?php echo $footer; ?>

Perfecto, hecho esto, ahora podrás realizar un análisis mucho más completo del resultado de tus anuncios, conocer que personas se interesan y saber si finalmente convierten tus anuncios en este medio, o empezar a valorar otros medios de inversión.

Ahora me toca a mi, si te he sido útil esta entrada me gustaría que me dejases un +1 en Google plus, o bien un comentario! Gracias!

Miguel Ber Software Developer

Ingeniero informático y desarrollador de aplicaciones web. Experto en desarrollo web, Webmaster, e-commerce y SEO.

Code is {poetry}

¿Necesitas un desarrollador? Contáctame!
¿Tienes alguna pregunta? Te respondemos ya!!