¿Buscas una guía rápida y fácil sobre cómo configurar notificaciones push web en tu sitio web?
Te tenemos cubierto.
En este artículo, te mostraremos cómo configurar notificaciones push web en tu sitio web, incluso si:
- Nunca lo has hecho antes
- No tienes un desarrollador que lo haga por ti
- Has intentado y fallado en añadir notificaciones push a tu sitio
¿La mejor parte? Lo haremos sin jerga técnica. Así que, incluso si no eres desarrollador, puedes instalar notificaciones push con bastante facilidad.
Para este artículo, vamos a usar PushEngage para configurar notificaciones push en tu sitio web. PushEngage es el software de notificaciones push número 1 del mundo. Así que tus campañas estarán en buenas manos.
Vamos a ello.
Cómo instalar notificaciones push en tu sitio
Antes de empezar, aquí tienes un vistazo rápido de lo que puedes esperar en tu sitio al final de este artículo. Si sigues los pasos de este tutorial, deberías poder enviar notificaciones push desde tu sitio como esta:

No importa en absoluto cómo hayas desarrollado tu sitio, qué tipo de negocio estés dirigiendo o cualquier otra especificación técnica. Podrás instalar notificaciones push en tu sitio de cualquier manera.
Vamos a ello.
Paso n.º 1: Configura tu cuenta de PushEngage
Ve a la página de inicio de PushEngage y haz clic en el botón Empezar:

Puedes seleccionar el plan gratuito para probar PushEngage, pero si te tomas en serio el crecimiento de tu negocio, elige un plan de pago. Los planes de pago incluyen mejores opciones de segmentación de audiencia y funciones de automatización de campañas.
Una vez que te hayas registrado para obtener una cuenta, dirígete al panel de control de PushEngage y ve a Configuración » Configuración del sitio » Configuración de instalación:

Puedes configurar la URL y la identidad de tu sitio en esta pantalla. Continúa y establece un logotipo y una URL del sitio para tus campañas y transmisiones de notificaciones push.
Todos tus suscriptores de notificaciones push verán el Nombre del sitio, la Imagen del sitio y la URL del sitio en tus notificaciones. Por lo tanto, deberías configurarlos ahora mismo para poder probar tus notificaciones push más adelante.
Paso n.º 2: Obtén el código de instalación de PushEngage
A continuación, deberás dirigirte al panel de PushEngage y obtener el código de instalación. Dirígete a Configuración » Configuración del sitio » Configuración de instalación:

Dentro de esta pestaña, verás que puedes obtener un código diferente para diferentes tipos de sitios web. Encuentra el correcto para tu sitio y cópialo. Si estás ejecutando un sitio en un CMS que no está listado en la pestaña, puedes dirigirte a las pestañas HTTP o HTTPS según si tu sitio tiene un certificado SSL instalado.
Esta siguiente parte es súper importante. Si no haces este paso, tu sitio no podrá recopilar suscriptores de notificaciones push.
Si estás utilizando un sitio HTTPS y tienes acceso a la carpeta raíz de tu servidor, deberás descargar el archivo service-worker.js de la misma pestaña. Luego, súbelo a tu carpeta raíz.
NOTA: Si no puedes subir el archivo service-worker a la carpeta raíz, aún puedes subir el archivo a otra carpeta. Ve a PushEngage Panel » Configuración » Configuración del sitio » Configuración avanzada.
Simplemente sigue las instrucciones en la configuración del Service Worker y listo:

Finalmente, querrás colocar el código de instalación de PushEngage en el <head> HTML de tu sitio web. Si eres un desarrollador acostumbrado a codificar en HTML, ya sabes cómo hacerlo.
Pero si eres nuevo en HTML y usas un CMS para tu sitio, no te preocupes. El proceso para editar el <head> HTML es diferente para cada plataforma. Por eso, hemos creado guías detalladas paso a paso para las plataformas más populares:
- Instalar notificaciones push en WordPress
- Instalar notificaciones push en WordPress (sin plugin)
- Instalar notificaciones push en WooCommerce
- Instalar notificaciones push en Wix
- Instalar notificaciones push en Blogger
- Instalar notificaciones push en Zoho
- Instalar notificaciones push en Volusion
- Instalar notificaciones push en Weebly
- Instalar notificaciones push en ClickFunnels
- Instalar notificaciones push en PrestaShop
- Instalar notificaciones push en OpenCart
- Instalar notificaciones push en CS-Cart
- Instalar notificaciones push en Drupal
- Instalar notificaciones push en Squarespace
- Instalar notificaciones push en X-Cart
- Instalar notificaciones push en BigCommerce
- Instalar notificaciones push en Jimdo
IMPORTANTE: Puedes insertar tu código de instalación directamente desde tu panel en algunos constructores de sitios web y CMS. En otros casos, como PrestaShop, necesitarás usar la Clave API de PushEngage en su lugar. Es por eso que recomendamos seguir tutoriales específicos de la plataforma para agregar el código de notificación push correctamente.
Paso n.º 3: Configuración de la suscripción a PushEngage
Finalmente, en tu panel de control de PushEngage, ve a Ajustes » Ajustes de suscripción » Cuadro de diálogo de suscripción » Editar:

Desde aquí, puedes personalizar tu opción de suscripción a notificaciones push. Si necesitas ayuda con eso, deberías consultar este artículo sobre cómo crear una opción de suscripción personalizada a notificaciones push.
Si necesitas algo de inspiración, puedes consultar este artículo sobre opciones de suscripción de notificaciones push de alta conversión.
Paso EXTRA: Crear una notificación de bienvenida
Una vez que hayas terminado de configurar la opción de suscripción, tu sitio podrá recopilar suscriptores.
¿Pero cómo sabes si tus notificaciones push están funcionando correctamente?
Te recomendamos que crees una notificación push de bienvenida para probar si tu configuración se realizó correctamente. Una notificación de bienvenida es una notificación push que envías a un nuevo suscriptor para confirmar su suscripción y darle la bienvenida.
Dirígete a Ajustes » Ajustes del sitio » Ajustes de instalación y configura tu mensaje de bienvenida:

Finalmente, vuelve a tu sitio y suscríbete a tus propias notificaciones push para probar si todo funciona correctamente.
¡Y eso es todo!
Has configurado correctamente las notificaciones push web en tu sitio web. Es hora de volver a tu panel de PushEngage y empezar a crear tus campañas de notificaciones push.
Conclusión
Si eres nuevo en las notificaciones push, deberías seguir un proceso completo de pruebas de notificaciones push antes de salir en vivo. Te ayudará a solucionar problemas comunes antes de que tus visitantes los vean y empiecen a quejarse de una experiencia de usuario rota.
Te recomendamos que te pongas en contacto con nuestros Customer Success Managers si te atascas en algo de esto. Estaremos encantados de ayudarte con cualquier problema. Las notificaciones push son una excelente manera de generar tráfico recurrente a tu sitio y aumentar las ventas directas y la participación.
¿No estás convencido? Echa un vistazo a estos recursos épicos:
- Campañas de goteo y respuestas automáticas para notificaciones push web
- 5 Beneficios de Usar una Campaña de Notificaciones Push de Abandono de Carrito
- Cómo Convertir Suscriptores en Compradores Usando Notificaciones Push Web
Si aún no lo has hecho, anímate a probar PushEngage. PushEngage es el servicio de notificaciones push número 1 del mundo. Por lo tanto, si te tomas en serio el crecimiento de tu negocio, PushEngage es la opción adecuada para ti.