Cómo personalizar los widgets de reseñas
Descubre cómo personalizar la apariencia de tus widgets de reseñas (p. ej., los bloques de tu tienda que muestran y aceptan reseñas de productos).
Widgets de reseñas disponibles
Klaviyo Reviews proporciona varios widgets que puedes añadir a tu tienda:
- Widget de valoración con estrellas
Muestra tu valoración con estrellas actual para un producto en particular y, por lo general, se añade debajo del nombre del producto.
- Widget de resumen de reseñas
Muestra un gráfico que desglosa todas las valoraciones que ha recibido un producto, las imágenes de usuarios enviadas con reseñas y los comentarios de clientes más comunes. Normalmente, se añade cerca de la parte inferior de una página de producto.
- Widget de lista de reseñas
Muestra una lista de todas las reseñas publicadas y las preguntas de clientes, junto con una barra de búsqueda, filtros, un botón Escribir una reseña y un botón Hacer una pregunta. A menudo se añade inmediatamente debajo del widget de resumen de reseñas.
- Widget de reseñas de productos
Una combinación de los widgets de resumen de reseñas y lista de reseñas anteriores. Si añades el widget de reseñas de productos a tu sitio, no necesitas añadir los widget de lista de reseñas y de resumen de reseñas por separado. - Widget de carrusel de reseñas destacadas
Muestra reseñas seleccionadas de cualquiera de tus productos. Se puede destacar en tu página de inicio, en una página de reseñas independiente o en cualquier otro lugar de tu sitio. Puedes seleccionar las reseñas que se destacan en este widget. Si están disponibles, las imágenes enviadas por los clientes acompañan a cada reseña; se utilizan las imágenes de tus productos si no se envió ninguna imagen junto con la reseña.
- El widget de SEO/todos los widgets de reseñas muestra todas tus reseñas de todos los productos en una sola página. Usa este widget para mejorar tu SEO y ofrecer un único lugar para que los clientes potenciales vean lo que les encanta a tus clientes actuales. Este widget se añade con mayor frecuencia a una página independiente de Reseñas en tu sitio.
Estos widget son totalmente personalizables, lo que significa que puedes elegir las fuentes y colores de tu marca, así como seleccionar manualmente las reseñas que quieres destacar en el carrusel de reseñas destacadas.
Selecciona un idioma para los widget de reseñas y las páginas de envío
De forma predeterminada, todo el contenido de Klaviyo Reviews está en inglés. Para seleccionar un idioma:
- Ve a la pestaña Reseñas en Klaviyo.
- Haz clic en Configuración de reseñas.
- Selecciona General.
- En el menú Seleccionar idioma, elige tu idioma.
La actualización de tu idioma para Klaviyo Reviews se aplica a:
- Página de envío de reseñas
- Widgets del sitio web
- Widget de valoración por estrellas
- Widget de resumen de revisión
- Widget de lista de reseñas
- Widget de reseñas de productos
- Widget de carrusel de reseñas destacadas
No puedes actualizar la configuración de idioma solo para un widget; todos los widgets deben usar el mismo idioma. Todos los widgets y la página de envío se actualizan de inmediato, incluidos los que ya están activos en tu sitio.
Actualizar el idioma para Klaviyo Reviews no se aplica a ninguna otra funciones de Klaviyo (p. ej., preguntas personalizadas, flujo, formulario de registro, páginas de preferencias, el contenido de las reseñas enviadas por clientes, etc.). Estos deben traducirse y editarse manualmente.
Ocultar los widget de reseñas hasta que un producto haya recibido reseñas
Estas instrucciones se aplican al widget de valoración por estrellas y al widget de lista de reseñas.
De forma predeterminada, un producto sin reseñas mostrará 0/5 estrellas y un mensaje que indica que aún no se ha enviado ninguna reseña. Si prefieres ocultar el widget hasta que recibas reseñas, sigue estos pasos:
- Abre la pestaña Reseñas en Klaviyo.
- Selecciona Configuración de reseñas.
- Haz clic en Widgets del sitio web.
- Selecciona Reseñas de productos o Valoración con estrellas.
- Abre el menú de Estado vacío.
- Desactiva el ajuste Mostrar con cero estrellas.
Cambiar el aspecto del widget
Sigue estos pasos para ajustar el estilo (por ejemplo, fuentes, colores y más) de cualquier widget de reseñas.
- Abre la pestaña Reseñas en Klaviyo.
- Selecciona Configuración de reseñas.
- Haz clic en Widgets del sitio web.
- Elige el widget que quieras editar.
- Haz clic en Diseño y estilo.
- Ajusta el aspecto del widget como quieras, incluidas las fuentes, los colores y el espaciado.
Cambiar un ajuste en un widget de reseñas (por ejemplo, el color del botón) no afecta a ese ajuste en otros widget, con la excepción del widget SEO / All reviews. Este widget hereda todos los ajustes del widget de reseñas de productos. Para personalizar la apariencia del widget SEO/Todas las reseñas, pero no la del widget de reseñas de productos, debes usar CSS personalizado.
Configuración de estilo de reseñas disponible
Abre cada menú desplegable para obtener más información sobre las opciones de estilo disponibles para esa categoría.
Widget de reseñas de productos
En la sección Diseño y estilo de la configuración de estilo de reseñas de productos, puedes ajustar la siguiente configuración:
- Margen
Ajusta el espacio en la parte superior, inferior, izquierda o derecha del widget. - Color de fondo principal
Activa esta configuración para añadir un color de fondo para toda el área del widget. - Color de fondo secundario
Edita el color de ciertos elementos del widget, como las barras del histograma. - Color de acento
Edita el color que se utiliza para varios acentos, incluida la selección en una pregunta de rango y las insignias de revisor verificado. - Radio de la esquina
Aplica esquinas redondeadas a toda el área del widget de reseñas de productos. Ten en cuenta que esto solo es visible si añades un color de fondo principal. - Líneas divisorias
Añade líneas opcionales entre cada reseña. - Fuente principal
Elige Heredar del sitio para usar la fuente existente de tu sitio o selecciona una fuente. La configuración de Fuente principal se aplica a todas las fuentes del widget, excepto:- La etiqueta #/5 en la sección Reseñas de clientes.
- La marca de tiempo de cada reseña.
- El texto de la etiqueta en el histograma de estrellas.
- El texto del marcador de posición en el campo de búsqueda.
- Fuente secundaria
Elige Heredar del sitio para usar la fuente existente de tu sitio o selecciona una fuente. La configuración de Fuente secundaria se aplica al histograma de estrellas, al campo de búsqueda, a la marca de tiempo de cada reseña y a la etiqueta #/5 de la sección Reseñas de clientes. - Tamaño, grosor y color de fuente
Ajusta el tamaño, el grosor y el color de las fuentes principal y secundaria, respectivamente. - Configuración de botones
- Color
Color del botón. - Radio de esquina
La redondez de las esquinas de los botones. Configúralo en 0 para que no haya redondeo. - Borde
Un borde de color alrededor del botón. - Especificar color al pasar el cursor
Si los botones deben cambiar de color al pasar el cursor, activa este ajuste. - Relleno
Relleno dentro de cada botón, alrededor del texto del botón. Añadir relleno hará que el botón parezca más grande. - Fuente, tamaño de fuente, grosor de fuente, color de fuente
La fuente que se utiliza para los botones del widget.
- Color
- Ajustes de calificación
- Color de relleno
El color de las estrellas seleccionadas (por ejemplo, si un producto tiene una valoración de 4/5 estrellas, las primeras 4 estrellas usan este color). - Color vacío
El color de las estrellas no seleccionadas (p. ej., si un producto se valora con 4/5 estrellas, la 5.ª estrella usa este color). - Borde
Un borde de color opcional que rodea todas las estrellas. - Espaciado
El espacio entre cada estrella. - Forma
Elige estilos de valoración alternativos, como estrellas puntiagudas, corazones redondeados y más. - Tamaño
- Resumen
El tamaño de las estrellas dentro del resumen de reseñas. - Revisar
El tamaño de las estrellas dentro de cada reseña de cliente.
- Resumen
- Color de relleno
- Configuración de filtros
La configuración deFiltros se aplica al campo de búsqueda y a los filtros de reseñas.- Color de fondo
El color de fondo de los botones de filtro y la barra de búsqueda. - Ancho y color del trazo activo
El ancho y el color del borde que indica una opción de filtro activa (es decir, seleccionada). (Mínimo 1.) - Radio de las esquinas
El redondeo de las esquinas del campo de búsqueda. Para que no haya redondeo, selecciona 0 px. - Icono de búsqueda
Activa o desactiva el icono de búsqueda de la lupa.
- Color de fondo
- Configuración de imagen
- Radio de las esquinas de las imágenes del resumen
Redondeo en la selección de imágenes del resumen en el resumen de reseñas. - Revisar el radio de la esquina de las imágenes
Redondeo en cada imagen dentro de reseñas individuales. - Revisar el tamaño de las imágenes
El tamaño de las imágenes incluidas con las reseñas individuales.
- Radio de las esquinas de las imágenes del resumen
Carrusel de reseñas destacadas
En la sección Diseño de la configuración de estilo del carrusel de reseñas destacadas, puedes ajustar la siguiente configuración:
- Titular de la sección
Añade una etiqueta, Reseñas de clientes, a este widget. - Tipo de carrusel
Elige si el carrusel debe mostrar imágenes o solo texto. - Número máximo de reseñas por página
Elige cuántas reseñas destacadas mostrar por página. - Límite de texto
Elige cuántas líneas de texto incluir en cada vista previa de la reseña. - Margen
Ajusta el espacio en la parte superior, inferior, izquierda o derecha del widget. - Alineación del texto
Si el texto debe estar alineado a la izquierda, a la derecha o centrado. - Elementos de la tarjeta
Activa o desactiva la opción de mostrar la fecha, el autor y la insignia de verificación de una reseña.
En la sección Style de los ajustes de estilo del carrusel de reseñas destacadas, puedes ajustar los siguientes ajustes:
- Ajustes de fuente del título de la sección
Fuente, color de la fuente y tamaño de la fuente del título de la sección. Ten en cuenta que Título de la sección debe estar habilitado en Diseño para que este ajuste se aplique a tu widget. - Altura de la imagen
Edita el tamaño de la imagen incluida con la vista previa de la reseña. - Radio de las esquinas
Modifica el redondeo de las esquinas de cada mosaico de reseña destacada. - Color de la tarjeta
Añade un color de fondo para cada mosaico de reseña. - Sombra
Añade o elimina una sombra de las tarjetas. - Borde
Añade o elimina un borde de las tarjetas. - Ajustes de estilo de la valoración
- Color de relleno
El color de las estrellas seleccionadas (por ejemplo, si un producto tiene una valoración de 4/5 estrellas, las primeras 4 estrellas usan este color). - Color vacío
El color de las estrellas no seleccionadas (p. ej., si un producto se valora con 4/5 estrellas, la 5.ª estrella usa este color). - Borde
Un borde de color opcional que rodea todas las estrellas. - Espaciado
El espacio entre cada estrella. - Tamaño
El tamaño de las estrellas dentro de cada reseña de cliente. - Forma
Elige estilos de valoración alternativos, como estrellas puntiagudas, corazones redondeados y más.
- Color de relleno
- Revisar la configuración de la fuente del titular
Elige Heredar del sitio para usar la fuente de tu sitio actual o selecciona una fuente y el tamaño, el grosor y el color. - Revisar la configuración de la fuente del cuerpo
Elige Heredar del sitio para usar la fuente actual de tu sitio o selecciona una fuente y su tamaño, grosor y color. - Configuración de fuente de las etiquetas de fecha y nombre
Elige Heredar del sitio para usar la fuente existente de tu sitio o selecciona una fuente y el tamaño, el grosor y el color de la fuente.
Valoración por estrellas
- Margen
Ajusta el espacio en la parte superior, inferior, izquierda o derecha del widget. - Ajustes de estilo de la valoración
- Color de relleno
El color de las estrellas seleccionadas (por ejemplo, si un producto tiene una valoración de 4/5 estrellas, las primeras 4 estrellas usan este color). - Color vacío
El color de las estrellas sin rellenar (es decir, no seleccionadas) (por ejemplo, si un producto tiene una valoración de 4/5 estrellas, la 5.ª estrella usa este color). - Borde
Un borde de color opcional que rodea todas las estrellas. - Espaciado
El espacio entre cada estrella. - Tamaño
El tamaño de las estrellas dentro de cada reseña de cliente. - Forma
Elige estilos de valoración alternativos, como estrellas puntiagudas, corazones redondeados y más.
- Color de relleno
- Primary font
Edita la fuente utilizada para el texto # ratings. Elige Heredar del sitio para usar la fuente de tu sitio existente o selecciona una fuente. - Tamaño, grosor y color de la fuente
Ajusta el tamaño, el grosor y el color del texto de # valoraciones.
Desactiva o activa los filtros y las acciones de reseñas
Permite que tus clientes filtren reseñas por calificación, contenido multimedia (es decir, si las reseñas contienen imágenes) o sus respuestas a preguntas personalizadas. Esto puede ayudar a los clientes potenciales a encontrar las reseñas más pertinentes para ellos.
- Ve a la pestaña Reseñas en Klaviyo.
- Haz clic en Configuración de reseñas.
- Selecciona Widgets del sitio web.
- Selecciona Widget de reseñas de productos.
- Selecciona Revisar lista.
- Para mostrar u ocultar el botón y la pestaña de preguntas y respuestas, o el botón Escribir una reseña, activa o desactiva esa selección en la tarjeta Acciones.
- Para eliminar o añadir la sección de filtros en el widget de tu lista de reseñas, desactiva o activa el conmutador Filtros.
- Marca o desmarca cualquiera de estos ajustes para determinar qué opciones de filtro aparecen: Barra de búsqueda, Ordenar (más reciente, más alto, más bajo), Valoración, Multimedia, Preguntas personalizadas.
Acerca del filtrado más relevante
El filtro Más relevante destaca las reseñas que es más probable que los usuarios consideren útiles. Al seleccionarlo, las reseñas aparecerán en este orden:
- Reseñas con texto, imágenes o preguntas personalizadas enviadas desde el país del visitante
- Reseñas sin ningún contenido (es decir, reseñas solo de valoración) enviadas desde el país del visitante
- Reseñas con texto, imágenes o preguntas personalizadas enviadas desde otros países
- Reseñas sin ningún contenido (es decir, reseñas solo de valoración) enviadas desde otros países
Dentro de cada categoría, las reseñas se ordenan por fecha de envío, y las más recientes aparecen primero.
Elige si quieres funciones las imágenes de producto en el resumen de tus reseñas
Los resúmenes de reseñas incluyen una galería opcional de imágenes de productos enviadas por clientes. Para activar o desactivar esta galería:
- Ve a la pestaña Reseñas en Klaviyo.
- Haz clic en Configuración de reseñas.
- Selecciona Widgets del sitio web.
- Selecciona el widget de reseñas de productos .
- Selecciona Resumen de reseñas y medios.
- Activa o desactiva la configuración de Galería de imágenes.
Oculta elementos de la lista de reseñas
Estas instrucciones se aplican al widget de lista de reseñas.
Puedes ocultar elementos de tu lista de reseñas (por ejemplo, el autor de la reseña, la respuesta de la tienda o la marca de tiempo) si lo deseas. Para ello, sigue estos pasos:
- Abre la pestaña Reseñas en Klaviyo.
- Selecciona Configuración de reseñas.
- Haz clic en Widgets del sitio web.
- Elige Reseñas de producto.
- Haz clic en Revisar lista.
- Desactiva los elementos que quieras ocultar.
Si desactivas la clasificación por estrellas, Contenido multimedia y Preguntas personalizadas en la lista de reseñas, desaparecerán las opciones de configuración de Filtros de reseñas. Para que una persona que visite tu sitio pueda filtrar su búsqueda, debe verse al menos un criterio de filtro (clasificación por estrellas, contenido multimedia o preguntas personalizadas) en la lista de reseñas.
Selecciona reseñas para mostrar en el carrusel de reseñas destacadas
Las reseñas destacadas aparecerán en el carrusel de reseñas destacadas. Para elegir qué reseñas destacar:
- Navega hasta la pestaña Reseñas.
- Selecciona Todas las reseñas.
- Junto a una reseña que quieras destacar, haz clic en Funciones.
- Repite según quieras. Recomendamos seleccionar al menos entre 3 y 5 reseñas para destacar.
Recursos adicionales
- How to install Klaviyo Reviews on Shopify 2.0 themes
Learn how to install Klaviyo Reviews on your Shopify 2.0 store by installing the app and adding reviews widgets.
- How to install Klaviyo Reviews on Shopify (vintage themes and headless)
Learn how to install Klaviyo Reviews with a vintage Shopify theme or headless architecture. This process involves copying several code snippets and pasting them into your site’s code.
- How to install Klaviyo Reviews for WooCommerce
Learn how to install Klaviyo Reviews on your WooCommerce store and add reviews widgets. To learn about all the steps required to get started, head to Getting started with Klaviyo Reviews.