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 web	Descripción	Código de evento estándar
Añadir información de pago	Adició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 carrito	La 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 deseos	La 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 registro	El 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’);
Contactar	Llamadas de teléfono, envíos de SMS, conversaciones por chat o cualquier otro tipo de contacto entre el cliente y tu empresa	fbq(‘track’, ‘Contact’);
Personalizar producto	La personalización de productos mediante una herramienta de configuración u otra aplicación que pertenezca a tu empresa	fbq(‘track’, ‘CustomizeProduct’);
Hacer donación	La donación de fondos realizada a tu organización o tu causa	fbq(‘track’, ‘Donate’);
Buscar ubicación	Una 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 iniciada	El 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 potencial	El 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’);
Comprar	La 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’});
Programar	La programación de una cita para visitar una de tus ubicaciones	fbq(‘track’, ‘Schedule’);
Buscar	Una 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 prueba	El 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 solicitud	El 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’);
Suscribirte	El inicio de una suscripción de pago por un producto o un servicio que ofreces	fbq(‘track’, ‘Subscribe’, {value: ‘0.00’, currency: ‘USD’, predicted_ltv: ‘0.00’});
Ver contenido	Una 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 ella	fbq(‘track’, ‘ViewContent’);

¿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