Mostrar tarjetas de producto y permitir añadir al carrito desde el chat
Cuando Olvio recomienda otros productos de tu catálogo, muestra tarjetas de producto debajo de su respuesta. De forma predeterminada, cada tarjeta enlaza a la página del producto. También puedes permitir que los compradores elijan una variante y la añadan a su carrito sin salir del chat. Ambas opciones están disponibles en todos los planes.
Cuándo aparecen las tarjetas de producto
Las tarjetas aparecen debajo de una respuesta que recomienda, ofrece o describe otros productos de tu catálogo. Se muestran en una fila que los compradores desplazan horizontalmente.
En el chat de la página de producto, una respuesta no suele mostrar más de 6 tarjetas.
En las conversaciones de Olvio Advisor, una respuesta muestra hasta 4 tarjetas. Olvio Advisor está disponible en los planes Growth y Scale. Consulta ¿Qué es Olvio Advisor?.
No hay ningún ajuste para desactivar las tarjetas de producto.
Qué muestra una tarjeta
De forma predeterminada, cada tarjeta muestra la imagen del producto (si el producto tiene una), el título y el precio. Al hacer clic en una tarjeta, la página del producto se abre en una pestaña nueva.
Precio: un producto con un solo precio muestra ese precio, con el formato del idioma de la página de la tienda online, por ejemplo €24.90 en inglés o 24,90 € en francés. Los precios de las tarjetas usan la moneda predeterminada de tu tienda y los precios sincronizados desde tu catálogo. No se convierten a la moneda en la que navega el comprador. Un producto con varios precios muestra Desde y su precio más bajo. Un producto cuyas variantes son todas gratuitas muestra Gratis.
Insignia de descuento: cuando un producto tiene un solo precio y un precio de comparación superior a ese precio, aparece sobre la imagen una insignia como -20%. El porcentaje se redondea hacia abajo.
Insignia Agotado: cuando ninguna de las variantes de un producto está disponible para la venta, aparece sobre la imagen una insignia Agotado en lugar de la insignia de descuento. Los productos con 50 variantes o más nunca muestran esta insignia.
Los productos sin imagen no muestran ninguna de las dos insignias.
Activar añadir al carrito en el chat
Abre Apariencia en el menú de la app de Olvio.
Haz clic en la pestaña Avanzado.
En la tarjeta Añadir al carrito en el chat, marca Activar añadir al carrito en el chat.
Haz clic en Guardar en la barra de guardado. El mensaje Cambios guardados lo confirma.
La opción está desactivada de forma predeterminada. Una vez que guardas, se aplica a las siguientes respuestas del chat de la página de producto y de las conversaciones de Olvio Advisor.
Qué ven los compradores con añadir al carrito activado
Las tarjetas cambian en los productos que tienen al menos una variante disponible que se puede mostrar en los desplegables:
Aparece un botón Añadir al carrito debajo del precio.
Debajo del botón hay un desplegable por cada opción que tiene más de un valor, como Color o Talla. Un producto sin opciones de ese tipo solo muestra el botón.
Los desplegables empiezan en la primera variante disponible. Los valores que no están disponibles con las demás opciones seleccionadas aparecen atenuados y tachados, y no se pueden elegir.
El precio sigue a la variante seleccionada. Una variante gratuita muestra Gratis.
Si ninguna variante disponible coincide con las opciones seleccionadas, el botón indica Agotado y no se puede pulsar.
La imagen, el título y el precio siguen abriendo la página del producto en una pestaña nueva. Estas tarjetas no muestran la insignia de descuento.
Los demás productos mantienen la tarjeta predeterminada descrita más arriba. Los desplegables incluyen como máximo 50 variantes de un producto.
Qué pasa cuando un comprador hace clic en Añadir al carrito
Olvio añade una unidad de la variante seleccionada al carrito de Shopify del comprador. Los compradores no pueden elegir la cantidad en el chat.
El botón muestra Añadiendo... con un indicador de carga y después Añadido al carrito con una marca de verificación.
Aproximadamente un segundo después, la página se recarga para que el carrito de tu tema muestre el nuevo artículo, y el panel de chat vuelve a abrirse.
Si el carrito no acepta el artículo, el botón muestra Error - reintentar y, al cabo de unos segundos, vuelve a Añadir al carrito para que el comprador pueda intentarlo de nuevo.
Ocultar variantes gratuitas
La tarjeta Añadir al carrito en el chat también tiene la casilla Ocultar variantes gratuitas (precio 0). Está marcada de forma predeterminada y afecta a los precios de las tarjetas aunque Activar añadir al carrito en el chat esté desmarcada.
Marcada: las variantes con precio 0 se ignoran cuando Olvio calcula el precio de la tarjeta y, con añadir al carrito activado, se ocultan en los desplegables. Esto solo ocurre cuando el producto también tiene variantes de pago. Un producto cuyas variantes son todas gratuitas se sigue mostrando, con el precio Gratis, y con añadir al carrito activado sus variantes siguen siendo seleccionables. Si las únicas variantes disponibles de un producto son gratuitas, su tarjeta mantiene el aspecto predeterminado, sin añadir al carrito.
Desmarcada: las variantes con precio 0 cuentan. En las tarjetas sin añadir al carrito, un producto que combina variantes gratuitas y de pago muestra Desde con un precio cero, por ejemplo Desde 0,00 €. Con añadir al carrito activado, sus variantes gratuitas aparecen en los desplegables.
Haz clic en Guardar en la barra de guardado para aplicar el cambio.
El botón Añadir al carrito del panel de chat
En las páginas de producto que muestran el widget de Olvio, el panel de chat muestra un botón Añadir al carrito encima del campo de pregunta, para el producto que el comprador está viendo. Este botón no depende de Activar añadir al carrito en el chat.
Muestra el precio y añade la variante seleccionada en ese momento en la página del producto.
Si esa variante no está disponible, indica Agotado y no se puede pulsar.
Un clic funciona como en el botón de una tarjeta: se añade una unidad, aparece Añadido al carrito y la página se recarga con el panel de chat abierto.
Se oculta mientras el panel de chat muestra una conversación de Olvio Advisor.
Adaptar las tarjetas y los botones a tu marca
Colores: los botones de añadir al carrito usan tu Color de acento y tu Primer plano de acento. Los nombres de producto de las tarjetas usan Texto, y los precios, Texto atenuado. Si la casilla "Use custom colors for this block" está marcada en el bloque Olvio — Product page del editor de temas, los colores del bloque sustituyen a estos en las páginas de producto que muestran ese bloque. Consulta Personalizar los colores del widget.
Radio de las esquinas: el control deslizante Botón de añadir al carrito, en la tarjeta Forma de la pestaña Panel de chat, define las esquinas tanto de los botones de las tarjetas como del botón del panel de chat. Los desplegables de variantes siguen el control Campo de entrada, y las imágenes de las tarjetas, el control Burbuja de conversación. Consulta Personalizar el radio de las esquinas del widget.
CSS personalizado: usa
.olvio-cardpara cada tarjeta,.olvio-card-atcpara los botones de las tarjetas y.olvio-atc-btnpara el botón del panel de chat. Añade!importanta cada propiedad que sobrescribas. Consulta Añadir CSS personalizado al widget.
La Vista previa en vivo de la página Apariencia muestra el botón Añadir al carrito del panel de chat, pero no las tarjetas de producto. Comprueba las tarjetas en tu tienda online.
Texto de las tarjetas en otros idiomas
En las tarjetas, Desde, Gratis, Agotado, Añadir al carrito, Añadiendo..., Añadido al carrito y Error - reintentar siguen el idioma de la página de la tienda online. Este texto existe en inglés, francés, alemán, español, italiano y portugués, y las tarjetas usan el inglés en las páginas en otros idiomas. No puedes editarlo. Los títulos de los productos y los valores de los desplegables de variantes proceden de tu catálogo en el idioma predeterminado de tu tienda, sea cual sea el idioma de la página. Los enlaces de las tarjetas abren la página del producto en su dirección predeterminada, sin el prefijo de idioma de la página en la que está el comprador, así que la pestaña nueva puede mostrar la página en el idioma predeterminado de tu tienda. Consulta Multilingüe: elegir qué idiomas cubre tu widget.
Seguir los resultados de añadir al carrito
Cuando un comprador que ha chateado con Olvio añade un producto al carrito en una página de producto que muestra el widget de Olvio, en los 7 días anteriores o posteriores a la conversación, ya sea desde una tarjeta, desde el botón del panel de chat o desde el botón propio de tu tema cuando este añade el producto sin cargar una página nueva:
La conversación se marca en la columna Añadido al carrito de Conversaciones.
Cuenta para la Tasa de adición al carrito con Olvio del Panel (haz clic en Olvio en el menú de la app).
Un artículo añadido antes del primer mensaje del comprador solo se vincula si el mismo carrito ya se usó en una conversación anterior con Olvio. Si no es así, los artículos que se añadan después con el botón de tu tema tampoco se vinculan hasta que el comprador recargue la página o abra otra, aunque chatee entretanto.
Los artículos añadidos desde tarjetas de Olvio Advisor en páginas que no muestran el bloque del widget de Olvio no se registran como añadidos al carrito. Esas conversaciones solo se marcan como Añadido al carrito si el comprador también añade al carrito en una página de producto que muestra el widget de Olvio dentro de los 7 días, o si tiene un pedido atribuido.
Una conversación con un pedido atribuido en los 7 días anteriores o posteriores también se marca como Añadido al carrito y cuenta para la Tasa de adición al carrito con Olvio. Consulta Cómo funciona la atribución de conversiones.
Prueba tu configuración
Marca Activar añadir al carrito en el chat y haz clic en Guardar.
Abre una de tus páginas de producto y pide alternativas, por ejemplo "Muéstrame otras opciones."
En una tarjeta con varias opciones, elige un valor en un desplegable, abre otro desplegable y comprueba que los valores sin stock con esa elección aparecen tachados.
Si un producto combina variantes gratuitas y de pago, comprueba que su tarjeta coincide con lo que elegiste en Ocultar variantes gratuitas (precio 0).
Haz clic en Añadir al carrito en una tarjeta. Cuando la página se recargue, comprueba que tu carrito contiene la variante y que el panel de chat vuelve a estar abierto.
Abre Conversaciones en el menú de la app de Olvio y comprueba que tu conversación de prueba está marcada como Añadido al carrito.
Para una comprobación completa de tu tienda online, consulta Prueba Olvio en tu tienda online.
