Centro de ayuda
Cómo crear un «Vibe Block» con productos del catálogo de productos
Con Vibe Block, puedes crear un bloque de productos personalizado y vincularlo al catálogo de productos. Describe el diseño que necesitas en un campo de texto y, a continuación, obtén los nombres de los productos, los precios, las imágenes y los botones de «Comprar» que se mostrarán en el bloque generado.
Conectar el catálogo de productos y añadir productos
Ve a «Configuración del sitio» y, en «Servicios integrados», haz clic en «Conectar» para activar el catálogo de productos.
Añade productos al catálogo de productos manualmente o utiliza la función de importación.
Añade un «Vibe Block» a la página
Ve a la página en la que quieras mostrar los productos. Añade un bloque «Vibe» desde la biblioteca de bloques.
Introduce una descripción del diseño del bloque de la ficha del producto y especifica que el bloque debe estar vinculado al catálogo de productos del proyecto. Espera a que se genere el bloque.
Además, asegúrate de especificar en la indicación que el producto se añada al carrito de la compra.
Ejemplo de instrucción:
Crea un bloque con fichas de productos y conéctalo al «Catálogo de productos» del proyecto. Cada ficha debe mostrar el nombre y el precio del producto. Muestra tres fichas por fila. Añade un botón «Ver más» en la parte inferior del bloque. Al hacer clic en él, debe cargar más productos del «Catálogo de productos».
Crea un bloque con fichas de productos y conéctalo al «Catálogo de productos» del proyecto. Cada ficha debe mostrar el nombre y el precio del producto. Muestra tres fichas por fila. Añade un botón «Ver más» en la parte inferior del bloque. Al hacer clic en él, debe cargar más productos del «Catálogo de productos».
Una vez generado el Vibe Block, aparecerá el botón «Configuración del catálogo». Haz clic en él y selecciona la categoría del catálogo de productos que quieras mostrar en la página.
Añade a la página el carrito de la compra ST100 con un bloque de formulario de pedido.
Publica la página y ábrela para probar el bloque. Añade un producto al carrito de la compra.
Comprueba que todo funcione correctamente y, a continuación, realiza el pago. Los datos del producto se enviarán a los servicios de captura de datos conectados, como hasta ahora.
También puedes incluir la descripción detallada de la ventana emergente del producto en la instrucción. Puedes hacerlo una vez que se haya generado el contenido del bloque principal: describe cómo debe ser la ventana emergente y qué información debe mostrar.
Por ejemplo, la ventana emergente detallada de la imagen siguiente muestra toda la información disponible sobre el producto procedente del catálogo de productos, los controles de cantidad del producto y un botón «Añadir al carrito». Puedes escribir tu propia instrucción para eliminar botones o cambiar la información que se muestra en la ventana emergente.
Por ejemplo, la ventana emergente detallada de la imagen siguiente muestra toda la información disponible sobre el producto procedente del catálogo de productos, los controles de cantidad del producto y un botón «Añadir al carrito». Puedes escribir tu propia instrucción para eliminar botones o cambiar la información que se muestra en la ventana emergente.
Los productos también se pueden añadir al carrito de la compra desde la ventana emergente de detalles.
Si no se ha añadido un producto al carrito de la compra o se han transferido algunos datos de forma incorrecta —por ejemplo, el SKU—, describe el problema en una nueva indicación en el editor de Vibe Block y pide a la IA que lo solucione.
