Este artículo cubre la implementación de los mosaicos de Noticias y Reseñas.

Insertar los mosaicos

Cuando el negocio tiene alguno de los elementos del plan de producto anterior activados, aparece una pestaña adicional titulada «websites» en la plataforma a nivel de ubicación. Solo el nivel de ubicación muestra esta nueva pestaña, ya que los mosaicos son individuales para cada ubicación y están diseñados para pymes.

En la nueva pestaña el usuario puede copiar los fragmentos para el mosaico de Reseñas y el mosaico de Reseñas.

(nota: el usuario debe añadir su propia URL de política de privacidad en la configuración del mosaico de Reseñas.

Mosaico de Reseñas

• Las reseñas de primera parte son visibles en la bandeja de entrada, igual que las reseñas de otro canal.
• El mosaico de reseñas solo incluye reseñas de Google, Facebook y primera parte.

Implementar los mosaicos en una aplicación de una sola página (SPA)

Introducción

Los mosaicos funcionan automáticamente en páginas renderizadas en el servidor, pero para páginas que solo se renderizan una vez al inicio y luego el navegador no se vuelve a renderizar al hacer clic en una página diferente (= aplicaciones de una sola página), es necesaria alguna configuración manual para que los mosaicos funcionen. Esto es frecuente en sitios web que usan marcos populares como React, Vue.js o Angular.

Pasos a seguir

Paso 1

Añade el script inicial de mosaicos a tu HTML:

Paso 2

Añade el div contenedor a tu componente dentro de la SPA:

Los mosaicos no se inician automáticamente con una SPA, porque el script no puede encontrar el elemento «<ub-widget-review>», porque este solo se renderizará con la ejecución de javascript.

Paso 3

Cuando accedas a la ruta con los mosaicos en el HTML, necesitas llamar

Ahora los mosaicos deberían aparecer y funcionar correctamente.

Paso 4

Cuando accedas a una ruta diferente dentro de la SPA, necesitas llamar

al desmontar el componente del localizador de tiendas. Esto asegurará que todos los componentes se desmonten correctamente y se puedan iniciar nuevamente si el usuario regresa a la vista.

Ejemplo

Aquí hay un repositorio de ejemplo con una implementación en React con este componente de mosaicos que lleva la mayor parte de la lógica mencionada en los pasos anteriores.

Implementar el mosaico de Reseñas mediante API

Verifica si el widget ya existe (el fragmento debe ser distinto de nulo)

GET  https://uberall.com/api/locations/$locationId/widgets?v=20191203

Crear widget, p. ej. para tipo Reseña

POST https://uberall.com/api/locations/$locationId/widgets?v=20191203&type=REVIEW

Actualizar la configuración del widget

PATCH https://uberall.com/api/locations/$locationId/widgets?v=20191203