Temas de este artículo
- Introducción
- Antes de empezar
- Paso a paso
- Preguntas frecuentes
Con E-goi, puedes enviar notificaciones instantáneas a los visitantes de tu sitio web, capturando y fidelizando a esas personas.
Qué es una notificación web push?
Enviar notificaciones instantáneas, o "web push", a través de la plataforma de E-goi es una estrategia efectiva para capturar y fidelizar visitantes en tu web. Esta funcionalidad te permite comunicarte directamente con las personas que utilizan navegadores como Chrome, Firefox u Opera, incluso si tienen tu sitio cerrado en ese momento.
A continuación, detallaremos cómo puedes incluir fácilmente la invitación en tu web y enviar tu primer mensaje web push.
Antes de empezar
Requisitos previos
- Asegúrate de que tu sitio está conectado a E-goi a través de nuestro Connected Sites. Este es un paso crucial para permitir la integración y el funcionamiento de las notificaciones web push.
- Asegúrate de tener una lista de contactos en E-goi para gestionar a los visitantes que aceptan las invitaciones.
Paso a paso
Asociar tu sitio al Connected Sites
1) Activa el Connected Sites en tu web. Este paso te permitirá conectar E-goi al sitio web donde deseas mostrar la invitación.
Si tienes tu web ya integrada a E-goi con uno de nuestros plugins (por ejemplo, WordPress), simplemente activa la opción de Connected Sites en el plugin.
Crear la invitación
1) Ve al menú "Capturar/Capturar", coloca el puntero en "Web Push Apps" y haz clic en "Crear".
2) Elige la opción de "Dominio E-goi" y la lista de contactos de E-goi donde se guardarán los visitantes que acepten la invitación.
3) En la ventana que aparece, escribe el nombre de tu invitación para personalizar la URL de la invitación. Normalmente es el mismo nombre de tu sitio web o marca, pero puedes cambiarlo (el texto aparecerá en lugar de "ejemplo" a continuación).
4) Diseña la invitación y define su comportamiento.
- Selecciona el tipo de invitación y personaliza la imagen, título, mensaje, colores y posición.
- Escribe lo que mostrará la invitación al momento de la suscripción y la eliminación, y ofrece la opción de suscripción por correo electrónico.
- Define en qué condiciones quieres mostrar la invitación y asocia una etiqueta a los visitantes que se suscriban.
5) Personaliza el mensaje que confirma la suscripción.
6) Finaliza eligiendo el sitio web en el que se mostrará la invitación.
7) Ve a tu web con Chrome, Firefox u Opera y ya deberá aparecer la invitación, como en este ejemplo.
.
Crear y enviar la notificación web push
1) Ve al menú "Comunicar", posiciona el puntero en "Web Push" y haz clic en "Crear".
2) En la ventana que aparezca, selecciona el sitio web que mostrará el mensaje, selecciona el tipo de envío que deseas y haz clic en "Avanzar".
3) Escribe el título del mensaje y haz clic en "Avanzar", luego selecciona la forma en que enviarás el mensaje.
4) Selecciona cómo quieres incluir el enlace de tu mensaje web push, ya sea una página creada en E-goi o una URL.
5) Ahora solo tienes que escribir el texto del mensaje (verás una vista previa a la derecha). En "Enlace del mensaje", estará la dirección del sitio web o la página a la que las personas serán redirigidas al hacer clic en el mensaje. También podes elegir la imagen que se mostrará junto al mensaje.
6) Haz clic en "Avanzar" y sigue el proceso de envío normal.
Crear invitaciones y notificaciones web push con dominio propio
Si prefieres que la invitación y las notificaciones web push muestren el dominio de tu web en lugar del dominio de E-goi, deberás configurar la invitación y las notificaciones de manera diferente a través de un proceso que requiere conocimientos técnicos:
Deberás crear una aplicación web con tu dominio. Este paso se realiza fuera de E-goi. Puedes seguir las indicaciones a continuación o pedir ayuda a un programador.
Debes acceder a Firebase, una funcionalidad de Google, para crear la aplicación web con el dominio de tu sitio. A través de ella, obtendrás un código JSON y un documento de la clave privada que deberás luego agregar al añadir la aplicación web en E-goi.
1) Accede a https://firebase.google.com/ y luego haz clic en Go to console, en la esquina superior derecha.
2) A continuación, haz clic en Create a project. Escribe el nombre del proyecto y avanza seleccionando las opciones que tengan sentido según tu caso.
3) Estarás dentro del proyecto que acabas de crear. En esa página, haz clic en el símbolo < / > para crear una aplicación web dentro del proyecto.
4) Escribe el nombre y haz clic en Register app. Desplázate hacia abajo hasta el final de la página y haz clic en Continue to the console.
5) Volverás a la página del proyecto. Allí tendrás acceso a la aplicación web que acabas de crear, haz clic en la rueda dentada de la misma.
6) Desplázate hasta el final de la página para ver la aplicación web creada. Cuando llegues al área de SDK setup and configuration, haz clic en Config. Necesitarás copiar y pegar ese código en E-goi más adelante en este artículo.
7) En la misma página del punto 6, desplázate hacia arriba y abre la pestaña Service accounts. Luego haz clic en Generate new private key. Generará un documento que deberás agregar en E-goi más adelante en este artículo.
Si es necesario, siempre puedes acceder a tus proyectos de Firebase ingresando a esta página: https://console.firebase.google.com/.
8) Ahora que ya tienes tu app web, tendrás que agregarla a E-goi. Haz clic en el menú Captar y después en Web push apps.
9) A continuación, haz clic en Dominio propio y elige la lista de contactos donde quedarán las personas que acepten la invitación.
10) Escribe la URL de tu web, pega el código JSON, e inserta el archivo de clave privada que generaste en el paso 7. Debes colocar únicamente la parte del código que está entre las llaves { }. Además, añade comillas " " a las palabras que preceden a los dos puntos, como puedes ver en la imagen.
11) A continuación, elige una imagen para tu invitación.
12) Antes de terminar esta parte, puedes añadir el Certificado para Safari, si quieres que las notificaciones web push estén disponibles también en ese navegador.
13) Avanza para la creación de la invitación web push. En el paso de insertar el código de la invitación en tu web, ten en cuenta estes puntos:
- Archivo de Service Worker: Debe insertarse en la raíz del sitio web accediendo a tu servicio de hosting/alojamiento.
- Código: Colócalo en el mismo lugar donde insertas los códigos de rastreo, como Google Analytics, por ejemplo. Suele colocarse en el HTML del pie de página del sitio web.
- Código para el icono: Si has optado por la invitación personalizada, también dispondrás de este código. Solo tienes que elegir dónde quieres colocar el icono y pegar el código en un elemento ID o etiqueta de la web.
Preguntas frecuentes
¿Mi invitación puede ser un icono siempre presente en una esquina de mi web en vez de una ventana?
Sí.
Lo bueno de esta opción es que la invitación se mantendrá fija y visible incluso cuando tus visitantes se desplacen hacia arriba y abajo:
Para activarlo, tan solo hay que escoger la opción "En un icono flotante" cuando configures tu invitación. La vista previa te mostrará inmediatamente la diferencia de aspecto:
¿La invitación y mi mensaje web push saldrán en los principales navegadores?
Sí. La invitación se mostrará en todos los navegadores de escritorio que acepten web push (es decir, Chrome, Firefox, Opera y Safari) y naveguen sin modo privado o anónimo. Cuando envíes un mensaje web push, saldrá cualquier que sea el sitio web en el que navegue el usuario e incluso si el navegador haya sido cerrado.
En los dispositivos móviles (smartphones y tabletas), la compatibilidad con web push es menor y depende del navegador y del tipo de smartphone o tableta.
¿La invitación y mi mensaje web push se mostrarán en el iPhone y iPad?
Si el iPhone o iPad tiene la versión más reciente, es posible mostrar web push en estos dispositivos, aunque, por limitación de Apple, solo en estas condiciones:
Para ti en E-goi
- Tu app web push en E-goi necesitará tener dominio própio configurada con Firebase.
- En la raíz de tu web debes tener un archivo manifest.json, generado en la configuración Firebase.
Para el visitante
- Su iPhone o iPad necesita al menos la versión 16.4 de iOS o iPadOS.
- El visitante tendrá que agregar tu web a la Pantalla de Inicio de su iPhone o iPad antes de aceptar la invitación web push (¡asegúrate de que animas a las personas a hacerlo en la versión de tu web para iPhone y iPad!)
- El visitante necesita tener Safari como navegador principal (es donde le saldrán la invitación y los mensajes web push) y siempre mostrar la versión móvil de los sitios web.
¿Cómo mejorar mis resultados de web push?
- Preséntate en el momento adecuado: Es importante para la invitación (cuando la gente se suscribe) y también para los mensajes que envías.
- Define qué activará la invitación y en qué condiciones. Por ejemplo: que aparezca al cabo de cierto tiempo y una vez al día. Si lo prefieres, puedes elegir una invitación con un icono interactivo para dar más libertad a tus visitantes para suscribirse.
- Limita la visualización del mensaje a un tiempo determinado. Por ejemplo: si el objetivo es promocionar descuentos flash durante 2 días, es importante que el mensaje solo esté disponible durante ese tiempo para que siga siendo claro y relevante.
- Aumenta tus posibilidades de ser visto: La invitación aparece en los navegadores que aceptan web push (Chrome, Firefox y Opera). Para llegar también a quienes utilizan Safari, basta con crear un certificado e introducirlo al configurar la invitación que aparecerá en tu sitio web.
- Aprovecha los períodos de máximo tráfico: ¿Tus contactos suelen estar conectados en horario laboral? ¿Quizá los domingos al caer la tarde? ¿Tienes destinatarios con comportamientos diferentes? Conoce tu base de contactos, segméntala y envía los mensajes web push en el momento en que puedas generar mayor impacto.
- Permite las suscripciones por correo electrónico: De esta forma, tendrás una segunda oportunidad de obtener los contactos en caso de que la gente no quiera recibir notificaciones web push. Recuerda poner una etiqueta para poder segmentar más fácilmente estos contactos en el futuro.
- Personaliza tus mensajes: ¿Qué te parece empezar el mensaje con un “Hola María (...)” o utilizar otra información específica y relevante? Solo tienes que disponer de los datos en campos de tu lista de contactos y utilizar nuestros códigos de personalización en el mensaje. Además, también puedes captar la atención de tus suscriptores utilizando imágenes que realcen el mensaje, en lugar de usar solo el logotipo de tu marca.
- Anima a la acción: Intenta enviar mensajes directos, relevantes y limitados en el tiempo. Utilizar una sola “llamada a la acción” suele tener mejores resultados. Asegúrate también de que la página de destino tiene los elementos clave para lograr tu objetivo.
- Recupera carritos abandonados: Ideal para quien necesita una solución de sencilla implementación y más eficaz a la hora de convertir. Sigue el paso a paso.