¿Buscas una forma de agregar notificaciones push a la versión AMP de tu sitio? Agregar notificaciones push AMP puede ser un poco técnico. Pero te ayudaremos a hacerlo de la manera fácil.
AMP o Accelerated Mobile Pages son esencialmente una versión móvil de tu sitio. Por lo tanto, si no estás configurando web push en tu sitio AMP, perderás un montón de suscriptores porque una gran parte de tu audiencia usará dispositivos móviles para visitar tu sitio.
En este artículo, usaremos PushEngage para instalar notificaciones push AMP porque es mucho más fácil que hacerlo manualmente.
Vamos a ello.
Cómo Instalar Notificaciones Push AMP
Instalar notificaciones push AMP es un proceso muy rápido y fácil. Simplemente sigue estos pasos y al final de este artículo, deberías poder enviar campañas push desde tu sitio como esta:
¿Se ve bien, ¿verdad? 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, o elegir un plan de pago si te tomas en serio el crecimiento de tu negocio. Los planes de pago vienen con más opciones de campaña y la capacidad de crear listas de suscriptores aún más grandes.
Una vez que te hayas registrado en tu cuenta de PushEngage, dirígete a tu panel de control de PushEngage y ve a Configuración del sitio » Detalles del sitio:
Puedes configurar tu logo, nombre del sitio y URL del sitio aquí. Es muy importante organizar estas cosas ahora mismo para que puedas probar toda tu configuración más tarde.
Paso #2: Obtener el Código de Instalación de Notificaciones Push AMP
Para instalar web push en tu sitio AMP, necesitarás obtener un código de instalación. En tu pantalla de Configuración del sitio, desplázate hacia abajo y haz clic en el botón Haz clic aquí para obtener instrucciones de configuración:
Dirígete a la pestaña AMP para obtener la configuración de instalación.
Copia este código. Necesitarás pegar este código en el <head> HTML de tu sitio. Si tienes un sitio de WordPress con una versión AMP, la forma más sencilla de hacerlo es usar el plugin Insert Headers and Footers. Es un plugin gratuito donde puedes pegar el código de instalación AMP sin tener que acceder al HTML real de tu sitio:
Paso #3: Instalar el Service Worker en tu Sitio AMP
A continuación, descarga el archivo del paquete que incluye el service worker.
Esto incluye:
- service-worker.js
- amp-helper-frame.html
- amp-permission-dialog.html
Descomprime el paquete y coloca estos archivos en la carpeta raíz de tu servidor. Esta parte es súper importante. Si omites este paso, tu sitio no podrá recopilar suscriptores de push.
Consejo profesional: Si no estás seguro de cuál es la carpeta raíz y cómo puedes subir archivos allí, deberías consultar este artículo sobre la Estructura de Archivos y Directorios de WordPress. Es una guía muy sencilla para principiantes y obtendrás mucha información sobre cómo funciona WordPress.
Paso #4: Agregar el Código HTML AMP Push a tu Sitio
A continuación, agrega el código HTML para habilitar un botón de suscripción al hacer clic y un botón para darse de baja de las campañas push.
Este código habilita el archivo del service worker que subiste y permite que tu sitio muestre los botones de suscripción y cancelación de suscripción. Para recopilar suscriptores, necesitas dar a tus visitantes una forma sencilla de suscribirse a tus campañas push. El botón de cancelación de suscripción dará a tus suscriptores activos una forma de darse de baja si no están interesados en tu contenido. Ambos son bastante importantes.
Agrega el botón 'Suscribirse a actualizaciones' donde quieras que aparezca en tu sitio:
Y agrega un botón de 'Darse de baja de las actualizaciones':
El botón de "No suscribirse" será un simple botón de 'tocar para no suscribirse'. Obtienes muchas más opciones de personalización para la versión no AMP de tu sitio en dispositivos móviles y de escritorio. Por lo tanto, te recomendamos que agregues CSS AMP a tu sección <body>.
Este fragmento de código está diseñado para personalizar la apariencia de los botones de suscripción y no suscripción. Si deseas experimentar con estos estilos, adelante. Solo asegúrate de no cambiar las etiquetas HTML AMP que el código está estilizando.
Y eso es todo. Has terminado.
Paso n.º 5: Configuración de la suscripción de PushEngage
Ahora, vuelve a tu panel de control de PushEngage. Ve a Diseño » Modales emergentes y selecciona la opción de suscripción que prefieras:
La idea aquí es darle a tus visitantes una buena razón para suscribirse. Si necesitas ayuda con eso, consulta nuestro artículo sobre cómo crear una opción de suscripción a notificaciones push personalizadas.
Y si deseas algunas plantillas para empezar, deberías consultar este artículo sobre suscripciones a notificaciones push de alta conversión.
Paso EXTRA: Crear una campaña 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 campañas de notificaciones push están funcionando correctamente?
Te recomendamos que crees una notificación push de bienvenida para probar si tu configuración se realizó sin problemas. Una notificación de bienvenida es una notificación push web que envías a un nuevo suscriptor para confirmar su suscripción y darle la bienvenida.
Ve al panel de control de PushEngage y dirígete a Campaign » Drip Autoresponders y haz clic en Create New Drip Autoresponder:
Luego, ponle un nombre a tu campaña (sugerimos algo como "Drip de Bienvenida"), y en Content, selecciona la opción que dice: "Send notification immediately after user subscribes“):
En este punto, puedes hacer clic en la flecha junto a la notificación para editar el contenido de tu notificación. Si tienes un plan Premium o Enterprise con PushEngage, podrás añadir más de una notificación para crear una secuencia de mensajes de bienvenida automatizados. Simplemente haz clic en Añadir Nueva Notificación y edita el contenido.
Una vez que hayas terminado, haz clic en Configuración de goteo y selecciona la opción para enviar tu campaña de bienvenida a todos los suscriptores:
Luego, desplázate hacia abajo para configurar tus propios parámetros UTM y rastrear las campañas de notificaciones push:
Y cuando hayas terminado, desplázate hacia arriba y haz clic en el botón Activate Autoresponder:
¡Y eso es todo!
Has configurado correctamente las notificaciones push web AMP en tu sitio web. Es hora de volver a tu panel de PushEngage y comenzar a crear tus campañas de notificaciones push.
Qué hacer después de agregar notificaciones push AMP a tu sitio
¡Eso es todo por ahora, amigos!
Si eres nuevo en las campañas de notificaciones push, deberías seguir un proceso completo de prueba de notificaciones push antes de publicarlo. Te ayudará a solucionar problemas comunes antes de que tus visitantes los vean y comiencen a quejarse de una experiencia de usuario rota.
También deberías consultar algunas campañas de notificaciones push automatizadas más, como:
Te recomendamos que te pongas en contacto con nuestros Gerentes de Éxito del Cliente si te atascas en algo. Estaremos encantados de ayudarte con cualquier problema.
Y 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.
Gracias por estos consejos e información. Es muy fácil de entender.
buena explicación