Crear web push con dominio propio

Con E-goi, puedes enviar notificaciones instantáneas (llamadas "web push") utilizando el dominio de tu propio sitio web.

Esto es ideal para captar y fidelizar a las personas que visitan tu sitio web utilizando Chrome, Firefox, Safari u Opera.

Lo primero que hay que hacer es configurar y colocar la invitación en el sitio web. A continuación, solo tienes que crear el mensaje que quieras enviar. Los visitantes que hayan aceptado la invitación verán el mensaje en su propio navegador (incluso si ya lo han cerrado).


 

Cómo crear web push con dominio propio 

Paso 1: Crear la aplicación web con tu dominio

Este paso se realiza fuera de E-goi. Puedes seguir estas indicaciones o pedir la ayuda de un programador.

Se trata de acceder a Firebase, una funcionalidad de Google, para crear fácilmente la app web con tu dominio web.

A través de ella obtendrás un código y un documento de clave privada que deberás incluir cuando añadas la aplicación web a E-goi.

 

  • Configurar Firebase (código JSON)

1) Entra en https://firebase.google.com/ y 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 elige las opciones que tengan sentido en tu caso.

3) Quedará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. Baja hasta el final de la página y haz clic en Continue to the console.

5) Volverás a entrar en la página del proyecto. En ella tendrás acceso a la aplicación web que acabas de crear, pulsa sobre la rueda dentada de la misma.


 

6) Ve al final de la página para visualizar la aplicación web creada. Cuando llegues al área de SDK setup and configuration, haz clic en Config. Tendrás que copiar y pegar ese código en E-goi en el paso 2 de este artículo.

 

  • Generar clave privada de Firebase

7) En la misma página del punto 6, sube y abre la pestaña Service accounts. A continuación, haz clic en Generate new private key. Se generará un documento que tendrás que subir a E-goi en el paso 2 de este artículo.

 

Más tarde, si lo necesitas, podrás acceder a tus proyectos Firebase entrando en esta página: https://console.firebase.google.com/.

 

 

Paso 2: Añadir la documentación de la aplicación web a E-goi

Ahora que ya tienes tu app web, tendrás que agregarla a E-goi.

Aquí pondrás el código JSON y el documento de clave privada generado en el paso 1 de este artículo.

1) Haz clic en el menú Captar y después en Web push apps.

2) A continuación, haz clic en Dominio propio y elige la lista de contactos donde quedarán las personas que acepten la invitación.

4) Escribe la URL de tu web, pega el código JSON, e inserta el documento de clave privada que generaste en el paso 1 de este artículo.

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.

 

5) A continuación, elige una imagen para tu invitación.

6) 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.

¿Has terminado? Continúa con la creación de tu invitación.

 

 

Paso 3: Crear la invitación

Es hora de ser creativo ;)

1) Elige el tipo de invitación:

  • En un icono flotante: La invitación está disponible a través de un icono con una posición predefinida.
  • En una ventana: La invitación aparece directamente en una pequeña ventana.
  • Personalizada: La invitación estará disponible a través de un icono que podrás colocar en el lugar que prefieras de la web.

2) Dependiendo del tipo de invitación tienes diferentes opciones de personalización: iconos, colores, textos, posición y comportamiento. Además, también puedes activar la suscripción por correo electrónico.

Cuando hayas terminado, procede con el código que debes colocar en tu sitio web.

 

 

Paso 4: Colocar la invitación en tu sitio web

En este paso tendrás los códigos necesarios para colocar la invitación en tu sitio web.

  • Fichero 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.

¡Hecho! ;)

 

 

Paso 5: Crear y enviar las notificaciones web push

¿Ya tienes la invitación en tu sitio web? Envía notificaciones para comunicar y fidelizar a tus visitantes.

 

 

Tengo suscriptores vía web push. ¿Puedo importarlos a E-goi?

Si tienes Firebase, puedes realizar una migración directa de tokens. De esta manera, tus contactos no tienen que entrar en tu web para que se produzca esta migración.

Ponte en contacto con nosotros a través de la sección Ayuda de tu cuenta :)