Si te preguntas cómo añadir las notificaciones push a tu sitio, no te preocupes, porque le diré exactamente cómo hacerlo.
En caso de que ya te lo estés preguntando, una solución fácil es la herramienta OneSignal Push Notification.
Por lo tanto, en este artículo, te guiaré a través del proceso de añadir las notificaciones push a tu sitio web en WordPress a través de OneSignal.
Antes de comenzar, repasemos qué es exactamente una notificación push y por qué realmente la necesitas.
Resumen contenido
Tutorial configuración plugin WordPress OneSignal
En este tutorial paso a paso, te enseñaré a usar y configurar el plugin de WordPress OneSignal para crear notificaciones push en tu sitio web, ya que es un servicio impresionante que te permite recopilar una lista de suscriptores y luego enviar mensajes push desde tu teléfono móvil y escritorio.
OneSingal tiene un plan gratuito bastante sorprendente, pero si quieres ir más lejos con tu audiencia, puedes optar por sus planes de pago también.
Vamos a empezar.
Paso 1: Instalar el plugin OneSignal
Para integrar OneSignal en tu sitio web de WordPress, necesitas instalar el plugin.
Es gratis, así que puedes instalarlo fácilmente desde el repositorio de WordPress.
Una vez que hayas instalado y activado el plugin, verás OneSignal Push en la barra lateral de tu panel de administración.
Haz clic en OneSignal Push y accederás a la página de ajustes y configuración.
Paso 2: Configurar OneSignal
En la página de configuración verás 2 pestañas:
- Setup
- Configuración
Mientras que la pestaña Setup te guiará sobre cómo puedes configurar OneSignal push en tu WordPress, la pestaña Configuración es donde realmente configuras las notificaciones con OneSignal push en tu WordPress.
En primer lugar, notarás que necesitas una App ID y una Rest API Key para integrar OneSignal con tu sitio web. Recibirás esta información una vez que te registre en OneSignal.
2.1 Registro en OneSignal
Visita el sitio web de OneSignal, pasa el ratón por encima de las capacidades y haz clic en web push.
Ahora puedes crear tu cuenta gratuita en OneSignal introduciendo tu dirección de correo electrónico y el nombre de tu empresa.
Una vez que hayas creado una cuenta, recibirás un enlace de confirmación en su correo electrónico. El enlace de confirmación le llevará aquí…
Puedes leer el manual, o cerrarlo y empezar de inmediato.
Verás un botón en la parte superior izquierda que dice «ADD APP».
2.2 Añadir aplicación
Haz clic en el botón y se te pedirá nombrar tu aplicación. Dale un nombre a tu aplicación y haz clic en next para continuar con la configuración de OneSignal.
La siguiente ventana te pedirá que selecciones la plataforma en la que deseas ejecutar la aplicación. Para este tutorial, estamos usando Web Push.
Una vez que haz seleccionado tu plataforma, haz clic en Siguiente.
Serás redirigido a la página de configuración donde ahora estarás configurando la notificación push en tu sitio web de WordPress.
Paso 3: Configurar OneSigal
En primer lugar, tienes que elegir la integración que deseas.
Como este tutorial trata sobre la integración de las notificaciones push en WordPress, elegiríamos un plugin de WordPress o Website Builder > WordPress.
3.1: Configuración del sitio de WordPress
El siguiente paso en la configuración de OneSignal es introducir la información de Tu sitio web.
Debajo del espacio para la información del sitio, verás un botón de «Auto Resubscribe (HTTPS ONLY)» (Suscripción automática). Esto es sólo para sitios HTTPS que utilizan un certificado SSL.
Si activas esta opción, tus usuarios podrán volver a suscribirse cuando regresen a tu sitio web sin que se les pida que lo hagan.
La URL del Icono Predeterminado es donde puedes subir tu imagen de favicon. Esto aparecerá en las notificaciones, por lo que te recomendamos que cargues el logotipo de tu sitio con un tamaño de 80×80 píxeles, y debe estar en formato .png, jpg o gif.
Al final, hay otra opción que debes activar si tu sitio no utiliza un certificado SSL.
Una vez que actives la palanca, se te pedirá que elijas una etiqueta.
Si tu sitio web está usando WordPress como servicio de alojamiento o es un sitio autoalojado, entonces debes elegir una etiqueta única que se mostrará en sus notificaciones.
3.1 Configurar el plugin de WordPress
Una vez que hayas ingresado la información y la etiqueta de tu sitio (si la hay), haz clic en next para pasar al siguiente paso.
Te redirigirá a la página Configurar el plugin de WordPress.
¿Recuerdas el APP ID y las claves de API de las que hablamos? Aquí es donde las encontrarás. Ahora has generado con éxito tu ID y Clave.
El enlace GO TO MY WEBSITE (ir a mi sitio web) te llevará si has introducido la URL correcta en el último paso.
Haz clic en el botón para terminar la configuración restante.
Paso 4: Finalizar la configuración de OneSignal
Después de regresar a tu sitio web, ve al Escritorio de WordPress y abre la configuración de OneSignal desde la barra lateral.
Selecciona la pestaña de configuración e introduce el APP ID y las API keys.
Esto te permitirá enviar notificaciones push a través de Google Chrome y Mozilla Firefox.
Sin embargo, para enviar notificaciones a través de Safari, tendrás que volver a la configuración de tu cuenta OneSignal.
Aquí, verás una pestaña separada para Apple Safari.
Una vez que hagas clic en la pestaña, se te pedirá que introduzcas el nombre de tu sitio y la URL. Al entrar en la información de tu sitio web se te dará una identificación de la web.
Copia esta Web ID y péguela aquí…
Haz clic en Guardar, y OneSignal se instalará y configurará en tu sitio web de WordPress.
Cómo personalizar las notificaciones push en WordPress
Si no personalizas tus notificaciones push, OneSignal enviará un mensaje genérico a tus usuarios que no reflejará la voz de tu marca.
Así que, para hacer cambios en tus notificaciones push, simplemente ve a la configuración del plugin OneSignal desde tu Escritorio de WordPress y selecciona Configuración.
Desplázate hacia abajo hasta «Prompt Settings & Subscription Bell«.
Aquí podrás personalizar la forma en que tus visitantes pueden suscribirse a tus notificaciones push.
OneSignal ofrece una manera fácil de personalizar el aviso a través de varios botones y tu activas o desactivas estos botones de acuerdo a tu gusto.
También puedes cambiar el tamaño, la posición y el tema de la notificación.
El aspecto más importante de tu notificación push y sus avisos, es la mensajería. Debes asegurarte de que se alinea con tu marca para que tus visitantes se sientan inclinados a suscribirse a tus notificaciones push.
También puedes personalizar la configuración de notificación de bienvenida.
Cómo enviar tus mensajes a las notificaciones push
Ahora que has configurado OneSignal y personalizado tu mensajería, es el momento de enviar tu primera notificación push a tus suscriptores.
Para enviar tu notificación push, ingresa a tu cuenta OneSignal y ve a Mensajes.
Haz clic en Nuevo Push. Se te dirigirá a la configuración de Nuevo Mensaje, donde podrás diseñar y enviar tu mensaje a los suscriptores.
Primero, selecciona tu audiencia.
Dado que OneSignal crea diferentes segmentos de tu audiencia, puedes enviar un mensaje a un segmento en particular o puede enviarlo a toda la audiencia.
O bien, puedes enviar un mensaje a un dispositivo de prueba.
De tu audiencia, puedes seleccionar un suscriptor para que sea el dispositivo de prueba, que puedes ser tu mismo o alguien del equipo.
Además, siempre es una buena idea enviar un mensaje a un dispositivo de prueba antes de enviarlo a tu lista de suscriptores.
El siguiente paso es diseñar su mensaje.
Asegúrate de que el título de tu mensaje sea atractivo y de que tu mensaje tenga una descripción clara de lo que significa la notificación push.
A la derecha, puedes ver la vista previa de cómo aparecerá tu mensaje en macOS, Windows y dispositivos móviles.
Una vez que hayas configurado el título y el mensaje, el siguiente paso es configurar las imágenes para tu notificación push.
- El icono es la pequeña imagen que aparece en la notificación push junto con el mensaje.
- La imagen es una imagen grande que se muestra debajo del título de la notificación.
- La insignia es un pequeño icono que se muestra en la pantalla de un móvil junto a su mensaje
Una vez que hayas configurado tus imágenes, deberás introducir la URL del artículo o la página a la que dirigirás a tus suscriptores.
También puedes establecer la prioridad de tu mensaje según tus preferencias.
Tu notificación caducará si el dispositivo de tu suscriptor permanece desconectado durante 259.200 segundos (3 días). Puedes definir tu propio período de tiempo en el campo «Time to live».
El último paso es programar tu notificación push.
Puedes elegir entre enviar el mensaje inmediatamente, o programarlo para más tarde haciendo clic en Comenzar a enviar en un momento determinado.
Para una mayor optimización de la entrega, tienes tres opciones más.
- Puedes elegir enviar el mensaje inmediatamente y será enviado a todos los usuarios al mismo tiempo.
- La entrega inteligente entrega tu mensaje durante un período de 24 horas en el momento en que cada usuario tiene más probabilidades de estar activo. Esto aumenta tus posibilidades de obtener un mejor porcentaje de clics.
- Optimizar por zona horaria de usuario, lo que te permite enviar mensajes al mismo tiempo sin importar dónde se encuentre el usuario en ese momento.
Una vez que hayas terminado de diseñar y programar tu notificación push, simplemente haz clic en Confirmar y tu mensaje será enviado.
También puedes guardarlo en borrador, si deseas realizar más modificaciones más adelante.