Cómo agregar notificaciones push web a su sitio de WordPress

¿Desea agregar notificaciones push a su sitio de WordPress? Las notificaciones push le permiten enviar notificaciones a los usuarios incluso cuando no están visitando su sitio web.

En este artículo, le mostraremos cómo agregar fácilmente notificaciones push web a su sitio de WordPress. También hablaremos sobre los mejores complementos de notificaciones push de WordPress y cómo enviar notificaciones push de escritorio y móviles desde su sitio de WordPress.

Agregar notificaciones push web a un sitio de WordPress

¿Qué es la notificación push?

Las notificaciones push son mensajes en los que se puede hacer clic que se muestran en la parte superior del escritorio del usuario o en el área de notificaciones en su dispositivo móvil. Se pueden mostrar incluso cuando el navegador del usuario no está abierto.

notificaciones push web que se muestran en un escritorio

Además del escritorio, las notificaciones push web también funcionan en dispositivos móviles. Esto le permite llegar a sus usuarios a través de dispositivos con las últimas actualizaciones y ofertas. Las notificaciones push web han demostrado ser una forma muy efectiva de convertir a los visitantes del sitio web en clientes y seguidores leales.

¿Por qué agregar notificaciones push web a su sitio de WordPress?

Ya hemos comentado que el 70% de las personas que abandonan su sitio web nunca volverán. Es por eso que necesita convertir a esos usuarios del sitio web en suscriptores o clientes.

Puede hacer esto utilizando múltiples canales a la vez. Esto incluye marketing por correo electrónico, redes sociales, marketing móvil o SMS y notificaciones push web.

Si bien las listas de correo electrónico siguen siendo la herramienta de marketing más dominante y efectiva a su disposición, las notificaciones push para nosotros están demostrando ser bastante efectivas.

Aquí es por qué:

  • Los usuarios deben dar su permiso explícito para recibir notificaciones push. Esto significa que ya están interesados ​​en lo que tiene que ofrecer y es más probable que participen en las notificaciones.
  • Las notificaciones push son más cortas y requieren menos atención que las actualizaciones de correo electrónico o redes sociales.
  • No hay algoritmo, por lo que se entregan casi el 100% de los mensajes.
  • Los usuarios pueden controlar cómo sus dispositivos muestran notificaciones, pueden posponerlos o apagarlos por completo.
  • No tantas empresas lo están utilizando.

Sitios populares que incluyen Facebook, Pinterest, LinkedIn y muchos otros entienden la importancia y ya están utilizando notificaciones push web.

Estas notificaciones son más atractivas que los SMS, el marketing por correo electrónico y las plataformas de redes sociales. Según una encuesta, las notificaciones push tienen una tasa de apertura 50% más alta que el correo electrónico y el doble de tasa de clics.

Dicho esto, echemos un vistazo a cómo agregar notificaciones push web a un sitio de WordPress.

Configuración de notificaciones push web en WordPress con OneSignal

OneSignal es un servicio gratuito de notificaciones push para sitios web de WordPress. Le permite agregar fácilmente notificaciones push a cualquier sitio web.

Lo primero que debe hacer es instalar y activar el complemento OneSignal. ¿Necesita ayuda para instalar el complemento? Consulte nuestra guía paso a paso sobre cómo instalar un complemento de WordPress.

Tras la activación, el complemento agregará un nuevo elemento de menú etiquetado como OneSignal a su barra de administración de WordPress. Al hacer clic en él, accederá a la página de configuración del complemento.

Página de configuración de OneSignal

La página de configuración está dividida en pestañas de Configuración y Configuración. La pestaña de configuración es en realidad documentación detallada sobre cómo configurar las notificaciones push de OneSignal en WordPress. Tiene los mismos pasos que le mostraremos en este tutorial.

Para configurar OneSignal, deberá agregar la clave API y la ID de la aplicación en la configuración del complemento.

Empecemos.

Paso 1: Configuración de notificaciones push de OneSignal

Primero, debe visitar el sitio web de OneSignal y hacer clic en el botón de inicio junto a la opción Web Push.

OneSignal comienza

Se le pedirá que proporcione su correo electrónico y contraseña para crear una cuenta gratuita. Después de crear su cuenta, accederá al panel de OneSignal.

Agregar aplicación OneSignal

En el tablero, haga clic en el botón “Agregar aplicación” para crear su primera aplicación.

Se le pedirá que proporcione un nombre para su aplicación. Aquí puede usar cualquier cosa que lo ayude a identificarlo.

Ingrese un nombre para su aplicación

A continuación, deberá seleccionar una plataforma. Puede seleccionar múltiples plataformas para una aplicación. Por ahora, recomendamos seleccionar “Web Push” y hacer clic en el botón siguiente para continuar.

Elegir plataforma de aplicaciones

En el siguiente paso, se le pedirá que seleccione un método de integración. Siga adelante y haga clic en el cuadro “WordPress Plugin o Website Builder” y luego seleccione WordPress.

Seleccionar método de integración

Cuando se desplaza un poco hacia abajo, verá la sección “Configuración del sitio de WordPress”.

Debe ingresar el nombre de su sitio web, URL y cargar un logotipo. Este logotipo aparecerá en sus notificaciones, por lo que le recomendamos utilizar el icono de su sitio (favicon) o el logotipo del sitio web.

Configuración del sitio de WordPress

Debajo de eso, verá una palanca que puede activar si su sitio de WordPress no está utilizando SSL / HTTPS. Solo puede enviar notificaciones push web desde una URL HTTPS segura. Si su sitio de WordPress no está usando HTTPS, entonces necesita activar esta configuración e ingresar una etiqueta.

Una etiqueta es básicamente un subdominio alojado en servidores OneSignal que utiliza una URL HTTPS segura. Este subdominio se usará para enviar sus notificaciones push.

Si desea configurar HTTPS en su propio sitio de WordPress, consulte nuestro tutorial paso a paso sobre cómo mover WordPress de HTTP a HTTPS. Recomendamos encarecidamente utilizar su propio dominio con SSL que un subdominio en OneSignal, por lo que no estará bloqueado para siempre en su plataforma.

Una vez que haya terminado, haga clic en el botón Guardar para almacenar la configuración de OneSignal. Ahora verá las claves de API que necesita copiar.

Copie las claves de API

Ahora, puede volver a la configuración del complemento OneSignal en su sitio de WordPress y cambiar a la pestaña “Configuración”. Debe pegar la aplicación y las claves de API que copió anteriormente.

Pegar claves de API

Estas claves API solo le permitirán enviar notificaciones push a través de los navegadores web Chrome y Firefox.

También necesitará Safari Web ID para enviar notificaciones Push a través del navegador web Safari.

Para obtener la clave API de Safari, debe volver al sitio web de OneSignal e ir a la página de configuración de su aplicación. Una vez allí, debe hacer clic en el icono de edición junto a Apple Safari.

Configuración de notificaciones push para Safari

A continuación, se le pedirá que ingrese el título, la URL de su sitio web y, opcionalmente, cargue un icono de sitio.

Configuración de Safari para notificaciones push

Haga clic en el botón Guardar para guardar su configuración. Después de eso, verá su ID web de Safari en la pantalla que debe copiar.

ID web de Safari

Una vez más, vuelva a la página de configuración del complemento en su sitio de WordPress y pegue la ID de Safari Web en la pestaña de configuración.

Guardar la configuración del complemento OneSignal

No olvides hacer clic en el botón Guardar para almacenar la configuración de tu complemento.

Ahora puede visitar su sitio web en una nueva pestaña de navegador de incógnito. Verá una ventana emergente de notificación push en la parte superior y un icono de notificación de campana en la esquina inferior derecha de la pantalla.

Notificación push optin

La ventana emergente de notificaciones push también aparecerá en los navegadores móviles.

Notificación push optin en navegador móvil

Nota: La apariencia del aviso emergente de notificación push puede diferir según la configuración de http / https de su sitio.

Ahora, puede que se pregunte por qué este aviso de notificación push se ve diferente de lo que ve en otros sitios web.

Normalmente, los usuarios ven el aviso de notificación predeterminado del navegador, que se ve así:

Indicador predeterminado del navegador para notificaciones push

Ahora el problema es que, si un usuario hace clic en el botón “Bloquear”, nunca verá un mensaje para suscribirse a las notificaciones. Para solucionar esto, OneSignal viene con dos tipos de solicitud diferentes.

El primero es la ventana emergente de notificaciones push y el otro es el icono de la campana de suscripción. Ambos son totalmente personalizables, y puede cambiarlos para satisfacer sus necesidades.

Paso 2. Personalizar el mensaje emergente de notificación push

La ventana emergente básica de notificaciones push es bastante simple. Utiliza un lenguaje genérico y muestra el logotipo de su sitio. Es posible que desee personalizar eso para hacerlo más personal.

Simplemente cambie a la pestaña de configuración en la página de configuración del complemento OneSignal en su sitio de WordPress y desplácese hacia abajo a la sección “Configuración de ventana emergente HTTP”.

Personalizar ventana emergente de notificaciones push

Debe hacer clic en el botón de alternar junto a “Personalizar el texto del mensaje emergente HTTP” y luego comenzar a agregar su propio texto.

No olvides hacer clic en el botón Guardar para guardar tu configuración antes de probar el mensaje.

Paso 3. Personaliza el ícono de notificación de campana

Normalmente, el navegador solicita notificaciones y la ventana emergente desaparece cuando un usuario las descarta.

¿Qué sucede si los usuarios luego cambian de opinión y desean recibir notificaciones push?

La campana de suscripción en OneSignal le permite seguir mostrando a los usuarios un mensaje para suscribirse a las notificaciones push en su sitio.

El ícono de la campana también es totalmente personalizable desde la página de configuración del complemento. Simplemente desplácese hacia abajo hasta la sección “Configuración de aviso y campana de suscripción” y active las opciones de personalización que desea cambiar.

Configuración de campana de suscripción

Luego puede desplazarse hacia abajo y cambiar la configuración de cada opción que desee personalizar. Lo ideal sería cambiar los colores del ícono de la campana para que coincidan con los colores de su propio tema.

Personalización del icono de campana

Nota: No utilizamos el ícono de la campana porque creemos que es demasiado intrusivo.

Paso 4. Enviar notificaciones push desde su sitio de WordPress

Por defecto, el complemento OneSignal envía automáticamente notificaciones push para todas las publicaciones nuevas publicadas en su sitio web. Si lo desea, puede desactivar esta función desde la página de configuración del complemento en la sección “Configuración de notificaciones automáticas”.

Configuraciones de notificaciones automáticas

También puede enviar manualmente una notificación cuando publique o actualice una publicación. Simplemente edite una publicación o página de WordPress, y verá el cuadro de meta de OneSignal en la columna de configuración del documento a la derecha.

Cuadro de notificación OneSignal en Gutenberg

Si está utilizando el antiguo editor clásico, verá el cuadro meta como este:

Enviar cuadro de notificación push en el editor clásico

Marque la casilla junto a “Enviar notificación en la actualización / publicación posterior” y luego haga clic en el botón actualizar o publicar.

OneSignal ahora enviará su artículo como una notificación automática a todos sus suscriptores.

Enviar una notificación push de bienvenida a los nuevos suscriptores

También puede enviar una notificación push de bienvenida a sus nuevos suscriptores. Visite la página de configuración de OneSignal en su área de administración de WordPress y desplácese hacia abajo a la sección “Configuración de notificaciones de bienvenida”.

Notificación de bienvenida

Ahora, cuando un nuevo se suscribe para recibir notificaciones push, recibirá una notificación de bienvenida en su dispositivo. Dependiendo de su navegador y dispositivo, la notificación puede verse diferente.

Notificación de bienvenida que se muestra en Mac a través de Firefox

Eso es todo, ha agregado correctamente notificaciones push web a su sitio de WordPress.

También puede enviar notificaciones personalizadas desde el panel de la aplicación OneSignal. El proceso es bastante intuitivo y puede seguir las instrucciones en pantalla una vez que inicie sesión en OneSignal.

Otros buenos plugins de notificaciones push de WordPress

Es importante elegir el servicio de notificación push web adecuado desde el principio. Dado que la mayoría de los proveedores intentan encerrarlo en su plataforma, cambiar su servicio de notificación push puede provocar la pérdida de sus antiguos suscriptores. Lo que significa que si cambias, comenzarás desde cero.

Es por eso que le recomendamos que le pregunte al proveedor que elija todas las configuraciones que necesita configurar para que su lista de suscriptores sea portátil.

En WPBeginner, usamos OneSignal porque tiene las características que necesitamos a un precio razonable.

  • OneSignal ofrece un complemento gratuito de notificaciones push de WordPress con notificaciones push ilimitadas para dispositivos móviles y notificaciones web para hasta 30 mil suscriptores.
  • Incluso su plan gratuito incluye características como segmentación, localización, seguimiento con Google Analytics y una API robusta.
  • Puede usarlo con todos los principales servicios de marketing por correo electrónico para enviar sus correos electrónicos de boletines a través de notificaciones push web

WordPress tiene que ver con las elecciones. Aquí hay otros complementos de notificaciones push de WordPress que también puedes probar.

  • PushCrew: conecta su sitio web al servicio de notificaciones push de PushCrew. Ofrecen un plan gratuito limitado a 2000 suscriptores.

  • PushEngage Web Push Notificaciones: este es el complemento de conector para PushEngage, un proveedor de servicios de notificaciones push. Tienen un plan gratuito limitado a 2500 suscriptores, 120 notificaciones y 5000 clics.

  • PushAlert – Notificaciones web push – Le ayuda a conectarse al servicio de notificaciones push web PushAlert. También ofrecen un plan gratuito limitado a 3000 suscriptores.

  • PushAssist: complemento de conector para el servicio de notificación push Push web Assist. Su plan gratuito está limitado a 2000 suscriptores.

Esperamos que este artículo te haya ayudado a aprender cómo agregar notificaciones push web a tu sitio de WordPress. También puede consultar nuestra guía sobre cómo obtener una dirección de correo electrónico comercial gratuita para su sitio web.

Si te gustó este artículo, suscríbete a nuestro canal de YouTube para ver videos tutoriales de WordPress. También puedes encontrarnos en Twitter y Facebook.