Añadir contenido: productos

En la barra lateral Admin, vaya a Content > Elements>Blocks.

Haga clic en Add New Block.

Escriba Block Title y Identifier.

Elija el Store View en el que el bloque va a estar disponible.

Desplácese hacia abajo y haga clic en Edit with Page Builder o dentro del área de vista previa de contenido para abrir el área de trabajo Page Builder.

En el panel Page Builder, expanda Add Content y arrastre un marcador de posición Products al escenario.

{width="600" modal="regular"}

Para determinar cómo se muestra la lista de productos en la página, elija uno de los tipos de aspecto visual:

{width="300"}

Si elige el carrusel de productos, también debe configurar Configuración de carrusel.

Para Select Products By, elija el método de selección de productos:

Puede seleccionar sus productos por categoría, SKU o condición. Estas opciones se excluyen mutuamente. Por ejemplo, no puede seleccionar la opción Categoría, utilizar el selector Categoría y, a continuación, cambiar a la opción Condición para agregar algunas condiciones. Los productos se seleccionan según lo que haya establecido para una de estas tres opciones.

• Category: elija esta opción para mostrar los productos usando una categoría seleccionada.

  {width="500"}

  Cuando se selecciona, esta opción proporciona un selector Category. Haga clic en la flecha y explore en profundidad la categoría de productos que desea mostrar. Por ejemplo, en los datos de ejemplo de Commerce, si explora y selecciona Mujeres > Tops > Tees, se muestran todos los productos de esa categoría.

  {width="500"}

• SKU: elija esta opción para mostrar los productos usando uno o más SKU

  Cuando se selecciona, esta opción proporciona un cuadro de texto Product SKUs en el que debe introducir una lista de SKU separados por comas para que se muestren.

  {width="500"}

• Condition: elija esta opción para mostrar los productos según una o varias condiciones que haya definido.

  Al seleccionarlo, hay herramientas disponibles para añadir condiciones a la selección de productos. Por ejemplo, puede seleccionar solo productos con un Género establecido en Unisex.

  {width="500"}

  note note
  NOTE
  Al seleccionar la opción Categoría o SKU, se proporciona la opción Sort By de Position. Con esta opción de ordenación, los productos aparecen en el mismo orden en que aparecen en el catálogo.
  En la opción Categoría, al ordenar por posición, se muestran los productos en el mismo orden en que aparecen en el catálogo. Para la opción SKU, al ordenar por posición, se muestran los productos en el orden en que se escriben en el cuadro de texto Product SKUs.

Para Sort By, elija el criterio de ordenación para los productos de la lista:

{width="300"}

Escriba Number of Products to Display en el carrusel o cuadrícula.

Los valores pueden estar comprendidos entre 1 y 999. El valor predeterminado es 5 para una cuadrícula y 20 para un carrusel.

Para determinar cómo se muestran los productos dentro del carrusel, elija Carousel Mode:

Si cambia entre estos dos modos, se conservarán los demás ajustes del carrusel, excepto el ajuste Infinite Loop, que siempre se establece en Yes en modo continuo y el campo se desactiva.

{width="600" modal="regular"}

Si es necesario, establezca la opción Autoplay en Yes.

Cuando la reproducción automática está activada, el carrusel comienza a desplazarse automáticamente cuando se carga la página. Si deja la configuración predeterminada (No), el cliente debe hacer clic en el desplazamiento por diapositivas (puntos o flechas) para mostrar cada diapositiva en secuencia.

Si habilita esta característica, escriba Autoplay Speed para especificar el retardo en milisegundos entre cada diapositiva. El valor predeterminado es 4000 (4 segundos).

Si es necesario, establezca la opción Infinite Loop en Yes.

Cuando el bucle infinito está habilitado, la presentación con diapositivas se reproduce indefinidamente mientras la página está abierta. Si deja la configuración predeterminada (No), la presentación con diapositivas se reproducirá solo una vez.

Si es necesario, establezca la opción Show Arrows en Yes.

Cuando esta opción está habilitada, cada diapositiva incluye siguiente y anterior flechas de navegación a la izquierda y a la derecha. Si deja la configuración predeterminada (No), las diapositivas no mostrarán flechas de navegación.

Si es necesario, establezca la opción Show Dots en No.

Cuando se establece la configuración predeterminada (Yes), aparecen puntos de navegación en la parte inferior del control deslizante del carrusel. Si desactiva esta configuración, el deslizador del carrusel no mostrará puntos de navegación.

Para controlar el posicionamiento de la lista Productos dentro del contenedor principal, elija Alignment:

Establezca el estilo Border que se aplica a los cuatro lados del contenedor Productos:

Si establece un estilo de borde distinto de None, complete las opciones de visualización de borde:

(Opcional) Especifique los nombres de CSS classes de la hoja de estilos actual para aplicarlos al contenedor.

Separe los distintos nombres de clase con un espacio.

Escriba valores, en píxeles, para que Margins and Padding determine los márgenes externos y el relleno interno del contenedor de productos.

Introduzca los valores correspondientes en el diagrama.