Video comprable en la página de producto

Video comprable (Video Commerce) usa el primer video nativo registrado en el contenido multimedia del producto. En la página de producto, el visitante puede mirar y elegir variantes antes de añadir al carrito.

En el nuevo editor (Brand Editor), abre el template de producto, selecciona la sección principal de información y activa Activar video comprable. La configuración se aplica al template: los productos que lo usan y tienen video nativo pueden mostrar la función. Por defecto, está desactivada.

En Formato del video flotante, elige Círculo (predeterminado), Stories (vertical) o Cuadrado. El formato solo modifica el flotante; reproductor y compra siguen iguales.

En computadoras, aparece en un botón en la esquina inferior izquierda, sin sonido y en bucle. Puedes moverlo a la derecha en Posición del video flotante. El botón de cerrar lo descarta para ese producto durante la sesión. Si el navegador impide autoplay o el visitante prefiere movimiento reducido, la portada permite abrirlo manualmente.

En celulares, el mismo video flotante usa el formato elegido, con ancho predeterminado de 104 px (185 px de altura en Stories). El toque abre el modal a pantalla completa. No hay botón adicional debajo de la galería. El modal vertical presenta una tarjeta con nombre, imagen, precio y Comprar sobre el video. El primer clic en Comprar abre variantes en botones y cantidad con −/+ al lado de la compra; la confirmación añade al carrito. La selección sigue el formulario de la página y las opciones sin stock bloquean el botón. Después de añadir, el tema presenta el flujo normal del carrito.

Los controles con íconos permiten pausar/reanudar y activar/silenciar sonido. Siguen el estado del reproductor y tienen etiquetas accesibles. Cuando la función está activa, el video usado sale del carrusel de imágenes y miniaturas. Los demás videos permanecen; desactivarla restaura la galería completa. El flotante se oculta mientras está abierto el carrito u otro modal del tema. Los kits y suscripciones dirigen al visitante a los detalles de la página para completar su configuración.

El flotante solo usa video nativo. Para tarjetas en el inicio o la página de producto, incluido YouTube/Vimeo, usa Carrusel de videos comprables. Cada tarjeta puede vincular un producto; varios productos en el mismo video siguen fuera del alcance. La transición entre flotante y modal puede reiniciar la reproducción.

Si el video no carga, el modal informa el fallo y ofrece Intentar nuevamente. La tarjeta y opciones de compra siguen disponibles. El nuevo intento recrea el reproductor y, si hace falta, solicita nuevamente el SDK.

Al abrir opciones, se oculta Comprar de la tarjeta: solo queda el botón de confirmación del formulario. Reabrir el modal restaura la tarjeta compacta.

Para volver a la tarjeta compacta, toca la flecha de la esquina superior de la tarjeta o el video encima de ella. Opciones y cantidad se conservan. Pausa, sonido y X siguen independientes.

La tarjeta no muestra un enlace a los detalles de la misma página de producto. El ícono para contraer está junto al resumen, sin ocupar una fila del formulario.

El formulario se abre y contrae con la misma transición corta del carrusel, desactivada con movimiento reducido. Colores/imágenes y talles siguen el aspecto de variantes del tema, y los redondeados siguen las superficies y botones configurados.

Mover el video flotante

Arrástralo con mouse o dedo para apartarlo del contenido. Al soltar, se acomoda en el lateral más cercano y conserva la altura elegida dentro de la pantalla. Un clic o toque corto abre el reproductor. La posición es temporal en la página y no cambia la configuración del editor.

Personalizar el widget

El editor ofrece activación, formato (círculo, stories o cuadrado), lado inicial y tamaño compacto o predeterminado. Predeterminado: 144px en computadoras y 104px en celulares; compacto: 112px y 88px. Stories conserva 9:16. Los colores siguen el tema y el componente controla los espacios. A la derecha, la posición inicial deja espacio para el botón de contacto. El visitante siempre puede arrastrarlo; la posición manual es temporal.

Video flotante en el inicio

En el inicio, añade Video flotante, disponible en la categoría de medios. Se permite uno por inicio. Configura enlace público de YouTube o Vimeo, portada opcional, nombre accesible, formato (círculo, stories o cuadrado), tamaño (compacto o predeterminado) y lado inicial.

Esta versión es informativa: no vincula productos ni muestra formulario de compra. La posición de la sección en la lista no cambia la del widget en pantalla. El visitante puede arrastrarlo al otro lateral, cerrarlo o abrir el video. La vista previa comienza sin sonido; los controles del proveedor están en el reproductor. El movimiento reducido impide la reproducción automática.

Sin video configurado, la tienda no muestra el widget; el editor muestra orientación. Cerrar se aplica a la página abierta; al recargar, vuelve a aparecer. Los videos privados o con incorporación deshabilitada siguen sujetos a restricciones del proveedor.

El video comprable de la página de producto conserva su configuración actual. La sección del inicio no está disponible en categorías ni reemplaza sus configuraciones.

En círculo o cuadrado, la vista previa de YouTube usa recorte centrado para llenar el widget, incluidos Shorts. Los bordes pueden quedar fuera. El formato stories y el video abierto en modal conservan el encuadre anterior. Las franjas negras grabadas en el archivo pueden permanecer.