Menú
Feedback
Comienza aquí
Tutoriales


Comienza aquí
VTEX Live Shopping - Primeros pasos
Configurar el evento
6 min de lectura

En el Admin VTEX, al acceder a Apps > Live Shopping y hacer clic el ícono de flecha de un evento creado se abre la página de Información del evento, que te permite configurarlo mediante las siguientes secciones:

Este artículo describe los ajustes principales para un evento. No explica todas las secciones de la página Información del evento. Para más información, consulta Live Shopping: Eventos.

Tipo de layout - Configurar el estilo

El layout define el formato de la pantalla que los clientes ven durante la transmisión del evento, que a su vez determina el formato de grabación del evento.

El estudio de transmisión usa el layout de la primera persona que entre. Debes configurar el layout del evento antes de entrar al estudio de transmisión. Aunque es posible cambiar el layout a través del Admin VTEX después, no puedes cambiarlo dentro del estudio de transmisión.

Formato de pantalla

En la sección Tipo de layout, puedes elegir el formato de layout deseado para transmitir el evento:

  • Horizontal (16:9): proporciona una vista horizontal de la transmisión, optimizada para pantallas de escritorio.
  • Vertical (9:16): proporciona una vista vertical de la transmisión, optimizada para pantallas móviles.

{"base64":"  ","img":{"width":1464,"height":654,"type":"png","mime":"image/png","wUnits":"px","hUnits":"px","length":158766,"url":"https://raw.githubusercontent.com/vtexdocs/help-center-content/refs/heads/main/docs/es/tracks/omnichannel/vtex-live-shopping-primeros-pasos/configurar-evento_1.png"}}

El formato predeterminado de la pantalla es Horizontal (16:9), pero puedes cambiarlo haciendo clic en la vista Vertical (9:16). La marca azul indica la opción seleccionada.

Ten en cuenta que, una vez iniciada la transmisión en el estudio Bundle, el layout de la pantalla no se puede cambiar. Para cambiarlo, tendrías que crear un nuevo evento.

Personalización de estilo

De forma predeterminada, los eventos tienen un estilo visual neutral apto para tiendas sin afectar la imagen de marca. Sin embargo, puedes personalizar el estilo de los siguientes elementos:

  • Fuente del texto
  • Colores
  • Tarjetas de productos
  • Precio de los productos
  • Botón de agregar al carrito
  • Producto destacado
  • Título de la sección de productos
  • Título del chat
  • Botón de enviar mensaje

Estas personalizaciones se realizan haciendo clic en el botón Personalizar apariencia y ajustando las opciones de la página Look and Feel a tus preferencias. Para instrucciones detalladas, consulta Live Shopping: Eventos.

Chat - Configurar el nombre del administrador

La sección Chat es donde gestionas el chat en vivo durante tu evento. Si deseas configurar un nombre específico para identificar al administrador que envía mensajes, sigue los pasos a continuación:

  1. En la sección Chat, haz clic en el ícono de perfil.
  2. En la ventana Información de la tienda, ingresa el nombre del administrador en el campo.
  3. Haz clic en Confirmar.

Para aprender a fijar mensajes, bloquear usuarios, eliminar mensajes y realizar otras acciones en el chat del evento, consulta Live Shopping: Eventos.

Configuración - Configurar funcionalidades

En la sección Configuración puedes activar o desactivar las siguientes funcionalidades del evento:

FuncionalidadOpción
Chat
  • Email obligatorio: de forma predeterminada, para permitir que el público participe en el chat del evento en vivo, solo se requiere el nombre. Cuando activas esta opción, los participantes también tienen que proporcionar una dirección de email.
  • Activar envío de email: cuando activas esta opción, si el público hace una pregunta y el administrador responde a través del chat, se envía un email al usuario con la respuesta. Esto ayuda a mantener la interacción con el usuario final fuera del chat.
Reproductor
  • Número de espectadores: muestra el número de espectadores que están viendo el evento en vivo. Este número no es acumulativo.
  • Ventana emergente de la transmisión: permite mostrar el componente completo de Live Shopping (chat, reproductor y barra lateral de productos) en un formato de ventana emergente para captar toda la atención del público mientras ven el evento. Los participantes pueden cerrar la ventana emergente en cualquier momento haciendo clic en la X en la esquina para volver al formato normal.
Productos
  • Aplicar impuestos: permite aplicar impuestos a los productos mostrados durante el evento en vivo. Cuando activas esta opción, el módulo Promociones > Cargos muestra el precio del producto incluyendo los cargos aplicables.

Configuración CMS - Configurar la presentación del contenido

En la sección Configuración CMS puedes configurar la presentación del contenido durante el evento. Las funcionalidades existentes son:

  • Productos de la barra lateral: muestra una barra con los productos seleccionados al lado del reproductor de video. Los productos se muestran verticalmente al lado izquierdo del reproductor.
  • Carrusel de productos: muestra un carrusel con una colección de productos en una vista horizontal debajo del reproductor de video durante el evento en vivo.
  • Chat: permite que tu audiencia interactúe en el chat durante el evento en vivo. Ten en cuenta que si el chat está oculto, la opción de preguntas también estará oculta, ya que esa funcionalidad se muestra encima del chat.
  • Me gusta: permite a los usuarios reaccionar durante el evento en vivo utilizando el botón de me gusta en forma de corazón.

{"base64":"  ","img":{"width":1266,"height":756,"type":"png","mime":"image/png","wUnits":"px","hUnits":"px","length":384484,"url":"https://raw.githubusercontent.com/vtexdocs/help-center-content/refs/heads/main/docs/es/tracks/omnichannel/vtex-live-shopping-primeros-pasos/configurar-evento_2.png"}}

  • Carrito de checkout: proporciona un botón Agregar al carrito que cuando utilizado por la audiencia, abre el checkout con el producto agregado al carrito en una nueva pestaña. El modo pantalla en pantalla (PiP) también se activará para permitir que el cliente continúe viendo la transmisión en vivo mientras finaliza la compra.
  • Vista rápida: permite que el público vea el evento en vivo mientras consulta las variaciones del producto. Cuando el cliente hace clic en el botón Agregar al carrito, se abre una vista rápida del producto sin ocultar la transmisión del evento permitiéndole elegir la talla y el color del producto, por ejemplo, sin dejar de ver el evento.
    • Si desactivas esta opción, cuando el cliente hace clic en Agregar al carrito, se abre una nueva pestaña con la página de detalles del producto (PDP) y se activa el modo PiP automáticamente para que pueda continuar viendo la transmisión.
  • Scroll infinito: implementa el scroll infinito en la opción de barra lateral de productos que hace scroll cada N segundos automáticamente para que tu público pueda ver todos los productos sin ninguna acción adicional.
    • La velocidad del scroll automático es 10 segundos de forma predeterminada, pero puedes cambiar el valor ingresando el número deseado en el campo. Recomendamos una configuración de 3 a 100 segundos.

Todas las funcionalidades mencionadas anteriormente están activas de forma predeterminada, excepto Carrusel de productos y Carrito de checkout.

Script para plantilla

Para incorporar la aplicación de transmisión en vivo en tu storefront incluyendo tus preferencias, puedes utilizar la tag HTML del campo Script para plantilla. Debes elegir una de las siguientes opciones:

  • Plantilla CMS: para tiendas que utilizan CMS - Portal Legado.
  • Plantilla externa: para tiendas externas.

Vista previa

Para previsualizar el evento, en Información del evento > Configuración CMS, haz clic en el botón Vista previa. Se abrirá una nueva pestaña y reproducirá el evento tal y como tu audiencia lo verá. Esta simulación ayuda a validar que todo esté funcionando correctamente al mostrar elementos como:

  • Chat
  • Reproductor
  • Barra lateral de productos
  • Productos destacados

Es muy aconsejable realizar controles adicionales en todo el sitio web para comprobar el funcionamiento correcto de todos los elementos. La Vista previa solo verifica ciertos componentes de Live Shopping.

Contribuidores
2
Photo of the contributor
Photo of the contributor
+ 2 contributors
¿Te ha parecido útil?
No
Sugerir cambios (GitHub)
6. Iniciar un evento
« Anterior
8. Utilizar el estudio Bundle
Siguiente »
Contribuidores
2
Photo of the contributor
Photo of the contributor
+ 2 contributors
En esta página
¿Tienes otras preguntas?
Pregunta a la comunidad
Encuentra soluciones y comparte ideas en VTEX Community
Únete a nuestra comunidad
Solicita soporte a VTEX
Recibe asistencia personalizada de nuestros especialistas
Abre un ticket de soporte
GitHubDeveloper PortalComunidadFeedback