ūüíĽ Como instalar el pixel de Facebook en mi web, paso a paso

Si tienes un sitio web y utilizas Facebook Ads para promocionar tus productos o servicios, instalar el pixel de Facebook es algo que no puedes pasar por alto. El pixel de Facebook es una herramienta esencial que te permite realizar un seguimiento de las conversiones, optimizar tus anuncio, llegar a las personas adecuadas y aumentar tu visibilidad. En este art√≠culo, te explicamos paso a paso c√≥mo instalar el pixel de Facebook en tu sitio web. ¬ŅEmpezamos? ¬°Toma nota!

¬ŅQu√© es el pixel de Facebook?

Antes de entrar en detalles sobre cómo instalar el pixel de Facebook, nos interesa que comprendas qué es y para qué sirve. Así, seguramente, te sea mucho más sencillo seguir este tutorial.

El pixel de Facebook es un fragmento de código que se instala en tu sitio web y que te permite realizar un seguimiento de las conversiones que se producen en él.

Cuando hablamos de conversiones, nos referimos a una visita que se transforma en una compra o una visita que se transforma en un registro, por ejemplo.

¬ŅY para qu√© sirve esto?

Con el pixel de Facebook instalado, podr√°s saber cu√°ntas personas han realizado ese evento o conversi√≥n que te interesa medir a partir de una campa√Īa realizada en Facebook. Por ejemplo:

Un usuario ve tu anuncio en Instagram o Facebook (recuerda que las dos empresas pertenecen a la matriz de Meta) y hace clic para entrar en tu p√°gina. Sin el pixel instalado, esa es toda la informaci√≥n que recibir√°s: una persona ha hecho clic, ha entrado en tu sitio y Facebook te ha cobrado X‚ā¨ por esa acci√≥n. Ahora bien, con el pixel instalado, adem√°s, podr√°s saber si ese usuario una vez dentro de tu p√°gina ha realizado la acci√≥n que esperabas o no.

¬°Esto es especialmente √ļtil para medir el ROAS (retorno de la inversi√≥n publicitaria) de tus campa√Īas!

Adem√°s, el pixel de Facebook te permite crear audiencias personalizadas y realizar un seguimiento de tus conversiones:

  • Usuarios que han visitado una p√°gina web concreta dentro de tu sitio
  • Usuarios que te han comprado un producto o servicio
  • Usuarios que a√Īadieron un producto al carrito de compra o lo abandonaron
  • Usuarios que han completado un formulario de registro (leads)

Conocer estos datos es s√ļper importante porque, adem√°s de traducirse a medio largo plazo en una mayor rentabilidad de tus presupuestos de anuncios, te da la oportunidad de realizar campa√Īas de remarketing.

Paso a paso para instalar el pixel de Facebook en tu sitio web

Ahora que ya sabes qué es el famoso pixel de Facebook y todo lo que puede hacer por ti, es hora de meternos en harina.

Para este tutorial necesitar√°s:

  • Una web operativa
  • Una cuenta publicitaria de Meta/Facebook
  • Paciencia (algo de m√ļsica relajante y tu bebida favorita ayudan)

¬°Importante! Aseg√ļrate de tener un sitio web operativo y de poder actualizar el c√≥digo, ya sea a trav√©s de los archivos del sitio o del CMS (WordPress, por ejemplo) del mismo antes de empezar con este tutorial.

El tutorial est√° dividido en dos partes:

‚ě°ÔłŹ En esta primera secci√≥n, te ense√Īaremos a crear el pixel en Facebook y c√≥mo instalar su c√≥digo en tu p√°gina web.

‚ě°ÔłŹEn la segunda fase, te ense√Īaremos a configurar los eventos de conversi√≥n personalizados y est√°ndar (la conversi√≥n que se va a medir mediante el pixel). En esta fase trabajar√°s dentro de Facebook.

Ahora sí, ¡vamos al lío!

1. Accede a la pesta√Īa de eventos en Facebook Ads Manager

El primer paso para instalar el pixel de Facebook es acceder a la pesta√Īa de eventos en Facebook Ads Manager.

Para ello, inicia sesi√≥n en tu cuenta de Facebook Ads Manager y haz clic en el men√ļ de navegaci√≥n de la izquierda. A continuaci√≥n, selecciona ¬ęTodas las herramientas¬Ľ y ah√≠, ¬ęAdministrador de eventos¬Ľ.

2. Crea un nuevo pixel

Una vez que est√©s en la pesta√Īa de administrador eventos, haz clic en ¬ęConectar or√≠genes de datos¬Ľ, aqu√≠ debes seleccionar qu√© quieres conectar (una web, un CRM, etc.). Ahora, asigna un nombre a tu pixel y escribe la URL de tu sitio web para comprobar si puedes beneficiarte de las opciones de configuraci√≥n sencilla que, valga la redundancia, lo hacen todo m√°s sencillo ūüėČ

Sea como sea, a partir de aqu√≠ tienes dos opciones: instalar el c√≥digo de forma manual o instalarlo mediante un socio. A continuaci√≥n te ense√Īamos c√≥mo hacer ambas cosas.

3.A. Instalar el código de forma manual

Si decides instalar el pixel de Facebook manualmente, la plataforma te proporcionará el código que debes agregar a tu sitio web.

Una vez que tengas el código del pixel de Facebook, deberás agregarlo a tu sitio web. Si no tienes conocimientos técnicos, es posible que desees solicitar ayuda a un desarrollador web o utilizar un plugin de WordPress como el que te acabo de mencionar.

Recuerda agregar el código en todas las páginas de tu sitio web en las que desees realizar un seguimiento de las conversiones. Así podrás tener una visión más amplia para actuar en consecuencia.

<!-- Meta 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', 'XXXXXXXXXXXXXXX');
fbq('track', 'PageView');
</script>
<noscript><img height="1" width="1" style="display:none"
src="https://www.facebook.com/tr?id=XXXXXXXXXXXXXXX&ev=PageView&noscript=1"
/></noscript>
<!-- End Meta Pixel Code -->

3.B. Instalar el código mediante un socio

Una vez que hayas creado el pixel de Meta, podr√°s seleccionar la opci√≥n de ¬ęinstalar mediante un socio¬Ľ.

Si seleccionas esta opción, te aparecerá un desplegable en el que podrás elegir cómo instalar el pixel en tu web: mediante la integración con socios como WordPress, Shopify, Wix u otros.

Una vez selecciones el socio, te aparecerán los pasos a seguir para la instalación. En esta imagen puedes ver como ejemplo las instrucciones que aparecen cuando seleccionas instalar mediante plugin en WordPress.

Cómo crear eventos estándar para el pixel de Facebook

Cuando a√Īadas el c√≥digo base del p√≠xel en tu sitio web, podr√°s configurar eventos para medir las acciones que te interesen, como las compras o el n√ļmero de formularios enviados. Para ello, tienes de nuevo dos opciones: instalar manualmente el c√≥digo¬†o utilizar la¬†herramienta de configuraci√≥n de eventos que funciona de la forma m√°s sencilla que te puedas imaginar.

En este tutorial vamos a centrarnos en la opci√≥n manual que es, seguramente, con la que necesites ayuda. ¬ŅVamos a ello?

1. A√Īade un nuevo evento

En tu cuenta publicitaria, y habiendo seleccionado el pixel que ya has creado, haz clic en ¬ęA√Īadir eventos¬Ľ, justo debajo de la gr√°fica. Aqu√≠ puedes seleccionar si quieres usar la API de conversiones, los datos del pixel o desde un sitio web nuevo. Si est√°s empezando, lo suyo es que selecciones los datos del pixel.

Para a√Īadir el evento, primero tendr√°s que seleccionar el tipo. Estos pueden ser:

  • Informaci√≥n de pago a√Īadida
  • Art√≠culo a√Īadido al carrito
  • Art√≠culo a√Īadido a la lista de deseos
  • Registro completo
  • Contactar
  • Personalizar producto
  • Hacer donaci√≥n
  • Buscar ubicaci√≥n
  • Pago iniciado
  • Cliente potencial
  • Comprar
  • Programar
  • B√ļsqueda
  • Iniciar prueba
  • Enviar solicitud
  • Suscribirte
  • Contenido visualizado

La elección del evento dependerá de tus objetivos de negocio. Para asegurarte de que eliges el evento que más te conviene, te animamos a seguir estos pasos:

  1. Define tus objetivos empresariales.
  2. Ponte en el lugar de tus clientes objetivo y piensa en el recorrido que seguir√°n en tu sitio web para alcanzar estos objetivos.
  3. Determina los eventos de tu sitio web que se corresponderán a dicho recorrido (un clic en un botón y una página de gracias, por ejemplo).
  4. Trata de seleccionar eventos relevantes que pueden usarse para la segmentación, la optimización, la medición y las estadísticas.

2. Configura el evento

Una vez que hayas seleccionado el tipo de evento, deberás configurarlo. Para ello, revisa la tabla a continuación y selecciona el fragmento de código que se corresponda con tu objetivo.

Eventos est√°ndar del pixel de Facebook:

Acción en el sitio webDescripciónCódigo de evento estándar
A√Īadir informaci√≥n de pagoAdici√≥n de la informaci√≥n de pago de un cliente durante un proceso de finalizaci√≥n de compra (por ejemplo, una persona hace clic en un bot√≥n para guardar su informaci√≥n de facturaci√≥n)fbq(‘track’, ‘AddPaymentInfo’);
A√Īadir al carritoLa adici√≥n de un art√≠culo a un carrito o una cesta de compra (por ejemplo, se produce al hacer clic en el bot√≥n ‚ÄúA√Īadir al carrito‚ÄĚ de un sitio web)fbq(‘track’, ‘AddToCart’);
A√Īadir a la lista de deseosLa adici√≥n de art√≠culos a una lista de deseos (por ejemplo, tiene lugar al hacer clic en el bot√≥n ‚ÄúA√Īadir a la lista de deseos‚ÄĚ de un sitio web)fbq(‘track’, ‘AddToWishlist’);
Completar registroEl env√≠o de informaci√≥n por parte de un cliente a cambio de un servicio que proporciona tu negocio (por ejemplo, se produce al apuntarse a una suscripci√≥n por correo electr√≥nico)fbq(‘track’, ‘CompleteRegistration’);
ContactarLlamadas de tel√©fono, env√≠os de SMS, conversaciones por chat o cualquier otro tipo de contacto entre el cliente y tu empresafbq(‘track’, ‘Contact’);
Personalizar productoLa personalizaci√≥n de productos mediante una herramienta de configuraci√≥n u otra aplicaci√≥n que pertenezca a tu empresafbq(‘track’, ‘CustomizeProduct’);
Hacer donaci√≥nLa donaci√≥n de fondos realizada a tu organizaci√≥n o tu causafbq(‘track’, ‘Donate’);
Buscar ubicaci√≥nUna persona encuentra una de tus ubicaciones en la web con intenci√≥n de visitarla (por ejemplo, se busca un producto y se encuentra en una de tus tiendas locales)fbq(‘track’, ‘FindLocation’);
Finalizaci√≥n de compra iniciadaEl inicio de un proceso de finalizar compra (por ejemplo, se inicia al hacer clic en un bot√≥n de finalizaci√≥n de compra)fbq(‘track’, ‘InitiateCheckout’);
Cliente potencialEl env√≠o de informaci√≥n por parte de un cliente que es consciente de que tu negocio puede ponerse en contacto con √©l m√°s adelante (por ejemplo, tiene lugar al enviar un formulario o solicitar una versi√≥n de prueba)fbq(‘track’, ‘Lead’);
ComprarLa finalizaci√≥n de una compra, normalmente al recibir una confirmaci√≥n del pedido o la compra o un recibo de la transacci√≥n (por ejemplo, se produce cuando el cliente llega a la p√°gina de agradecimiento o confirmaci√≥n)fbq(‘track’, ‘Purchase’, {value: 0.00, currency: ‘USD’});
ProgramarLa programaci√≥n de una cita para visitar una de tus ubicacionesfbq(‘track’, ‘Schedule’);
BuscarUna b√ļsqueda realizada en tu sitio web, aplicaci√≥n u otra propiedad (por ejemplo, se produce al realizar una b√ļsqueda de productos o viajes)fbq(‘track’, ‘Search’);
Iniciar pruebaEl inicio de pruebas gratuitas de un producto o servicio que ofreces (por ejemplo, el comienzo de una suscripci√≥n de prueba)fbq(‘track’, ‘StartTrial’, {value: ‘0.00’, currency: ‘USD’, predicted_ltv: ‘0.00’});
Enviar solicitudEl env√≠o de una solicitud para acceder a un producto, servicio o programa que ofreces (por ejemplo, el env√≠o de una solicitud de una tarjeta de cr√©dito, un trabajo o un programa educativo)fbq(‘track’, ‘SubmitApplication’);
SuscribirteEl inicio de una suscripci√≥n de pago por un producto o un servicio que ofrecesfbq(‘track’, ‘Subscribe’, {value: ‘0.00’, currency: ‘USD’, predicted_ltv: ‘0.00’});
Ver contenidoUna visita a una p√°gina web que te interesa (por ejemplo, se visita un producto o una p√°gina de destino); indica si alguien accede a la URL de una p√°gina web, pero no lo que ve o hace en ellafbq(‘track’, ‘ViewContent’);
Fuente: facebook

¬ŅC√≥mo colocar el c√≥digo correctamente?

Para colocar el c√≥digo en condiciones en tu web, necesitar√°s contar con un c√≥digo de pixel ya instalado y tener en cuenta lo siguiente: para a√Īadir un evento, no vamos a necesitar un c√≥digo nuevo, solo a√Īadir una peque√Īa variaci√≥n o adici√≥n al c√≥digo que ya existe. (Don’t panic! En seguida te mostramos un ejemplo ūüėČ).

  1. Este paso, ya lo hemos realizado al instalar el código general en la primera parte del tutorial, pero por si acaso, te volvemos a explicar cómo colocar el código base de Facebook en tu sitio web: pega el código del píxel de Meta entre las etiquetas <head> y </head> de tu página web. Es posible que ya tengas código entre las etiquetas de encabezado, en cuyo caso tendrás que colocar el código del píxel debajo, pero recuerda hacerlo siempre, siempre, antes de </head>.
  2. Este código base del píxel tendrá el aspecto que se muestra a más abajo.
  3. Ahora, con el c√≥digo del evento est√°ndar seleccionado y copiado, nos dirigiremos al c√≥digo base.¬†En el c√≥digo del p√≠xel de Meta, pega el c√≥digo del evento est√°ndar pertinente para tu p√°gina sobre la etiqueta¬†</script>¬†(por ejemplo, el de art√≠culo a√Īadido al carrito: fbq(‘track’, ‘AddToCart’);). ¬°Tendr√°s que repetir esta operaci√≥n con cada p√°gina de la que quieras realizar un seguimiento!

Aquí tienes un ejemplo de cómo quedaría el código:

<!-- C√ďDIGO BASE DEL PIXEL DE META -->

<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', 'XXXXXXXXXXXXXXX'); <! -- Aquí va el ID de tu pixel -->
fbq('track', 'PageView');

fbq('track', 'AddToCart'); <! -- Aquí está el evento de conversión estandar -->

</script>

<noscript><img height="1" width="1" style="display:none"
src="https://www.facebook.com/tr?id=XXXXXXXXXXXXXXX&ev=PageView&noscript=1"
/></noscript>

<!-- Fin del código base del pixel -->

En este paso, tambi√©n podr√°s asignar un nombre al evento y personalizarlo para que se ajuste a tus necesidades. Por ejemplo, si est√°s realizando un seguimiento de las compras, puedes asignar un nombre como ¬ęCompra completada¬Ľ.

Cómo crear eventos de conversión personalizada para el pixel de Facebook

Si has llegado hasta aquí, puede que estés algo asustado con tanto código. En ese caso, quizá te interese probar con el seguimiento de conversiones personalizadas porque, sí, tranqui: ¡es mucho más fácil!

Para configurar esta conversi√≥n solo necesitas una regla del tipo ¬ęque la URL a medir sea igual https://tuweb.com/gracias¬Ľ.

Despu√©s, tienes que seleccionar la categor√≠a del evento, definir un nombre para esta conversi√≥n personalizada y, ¬°listo!

Cuando seleccionas esta opción, si ves que tu pixel está marcado en rojo, significa que todavía tienes que instalarlo en tu web o landing.

Verifica la instalación y el funcionamiento del evento

Y antes de abrir una botella de champán o un bote de Nocilla para celebrar, es momento de verificar que la instalación del código y la configuración de las conversiones es correcta.

Para ello, puedes apoyarte en la herramienta de prueba y verificación de eventos de Facebook Ads Manager. Si el evento se registra correctamente, significa que has instalado el pixel de Facebook correctamente.

También puedes utilizar una extensión para Chrome llamada Meta Pixel Helper que te va a permitir conocer si tienes el pixel instalado y que tipo de eventos tienes configurados, sin duda una herramienta muy buena para conocer si está todo correcto. ¡Te recomendamos encarecidamente que la utilices!

Y si ya tienes instalada en tu navegador la extensión de Tag Assistant de Google, no haría que instalaras nada más. También te ayudará a comprobar si el código de Meta está donde debe estar.

Si has seguido todos los pasos hasta aqu√≠, ¬°felicidades! Tu pixel deber√≠a estar perfectamente instalado y recibiendo informaci√≥n sobre los eventos seleccionados ‚úĆÔłŹ

Preguntas frecuentes sobre la instalación del pixel de Facebook

¬ŅNecesito conocimientos t√©cnicos para instalar el pixel de Facebook en mi sitio web?

Si bien no es necesario que tengas conocimientos técnicos para instalar el pixel de Facebook, es posible que desees solicitar ayuda a un desarrollador web o utilizar un plugin de WordPress como Meta Pixel for WordPress para facilitar el proceso.

¬ŅC√≥mo puedo utilizar los datos que recopile con el pixel de Facebook?

Una vez que hayas instalado el pixel de Facebook, deber√°s utilizar los datos que recopiles para optimizar tus campa√Īas y llegar a tu p√ļblico objetivo. Puedes hacerlo utilizando la herramienta de segmentaci√≥n de audiencia de Facebook Ads Manager, por ejemplo.

¬ŅPuedo instalar el pixel de Facebook en m√°s de un sitio web?

Sí, puedes instalar el pixel de Facebook en varios sitios web y realizar un seguimiento de las conversiones que se producen en cada uno de ellos. Deberás crear un nuevo evento para cada sitio web.

¬ŅPuedo instalar el pixel de Facebook en una tienda en l√≠nea?

Sí, puedes instalar el pixel de Facebook en una tienda en línea y realizar un seguimiento de las conversiones que se producen en ella. De esta forma, podrás saber cuántas personas han realizado una compra en tu tienda en línea después de haber hecho clic en uno de tus anuncios de Facebook.

¬ŅQu√© debo hacer si tengo problemas para instalar el pixel de Facebook en mi sitio web?

Si tienes problemas para instalar el pixel de Facebook en tu sitio web, puedes consultar la sección de ayuda de Facebook Ads Manager o ponerte en contacto con el equipo de soporte técnico de Facebook para obtener ayuda adicional.

Deja una respuesta

Your email address will not be published.