Muestras de producto
Los clientes tienen grandes expectativas de elegir un color y es crucial que las descripciones de los productos representen con precisión cada color, patrón o textura disponible. Por ejemplo, los pantalones del siguiente ejemplo no están disponibles en rojo, verde y azul. En cambio, solo están disponibles en tonos específicos de rojo, verde y azul, que probablemente sean únicos para este producto.
Para productos configurables, el color se puede indicar mediante una muestra visual, una muestra de texto o un control de entrada. Las muestras se pueden usar en la página de productos, en las listas de productos y en navegación por capas. En la página del producto, las muestras se sincronizan para mostrar la imagen del producto correspondiente cuando se selecciona la muestra. Cuando el cliente selecciona la muestra, el valor correspondiente aparece en el campo de entrada y la muestra se esquematiza como la selección actual.
No en la página Attribute Edit en el Administrador.Muestras basadas en texto
Si una imagen no está disponible para una muestra, el valor del atributo aparece como texto. Una muestra basada en texto es como un botón con una etiqueta de texto y se comporta de la misma manera que una muestra con una imagen. Cuando se utilizan muestras basadas en texto para mostrar los tamaños disponibles, cualquier tamaño que no esté disponible se tachará.
Muestras en la navegación por capas
Las muestras también se pueden usar en la navegación por capas, si la propiedad Use in Layered Navigation del atributo de color está establecida en Yes. El siguiente ejemplo muestra muestras de imagen basadas en texto y en color en la navegación por capas.
Creación de muestras para los productos
Las muestras pueden definirse como un componente del atributo color o configurarse localmente para un producto específico y cargarse como imágenes de producto.
En los ejemplos anteriores, los pantalones "Sylvia Capri" están disponibles en valores específicos de red, green y blue. Dado que las muestras se tomaron de la imagen del producto, cada una es una verdadera representación del color. El atributo color se usa para administrar la información de todos los colores y muestras del producto.
Paso 1: Creación de las muestras
Utilice cualquiera de los siguientes métodos para crear muestras para sus productos.
Método 1: añadir una muestra de color
-
Para capturar el color verdadero de un producto, abra la imagen en un editor de fotos y use la herramienta de cuentagotas para identificar el color exacto y tomar nota del valor hexadecimal equivalente.
-
En la barra lateral Admin, vaya a Stores > Attributes>Product.
-
En la cuadrícula, abra el atributo color en el modo de edición.
-
Compruebe que Catalog Input Type for Store Owner está establecido en
Visual Swatch. -
Si prefiere no mostrar las imágenes de productos simples correspondientes cuando la muestra se selecciona en la página de visualización del producto, establezca Update Product Preview Image en
No. -
En Manage Swatch (Values of Your Attribute), haga clic en Add Swatch y haga lo siguiente:
-
En la columna Muestra, haga clic en la nueva muestra y seleccione Choose a color en el menú.
-
En el selector de color, coloque el cursor en el campo #, elimine el valor actual e introduzca el valor hexadecimal de seis caracteres del nuevo color.
-
Para guardar la muestra, haga clic en el icono Rueda de color (
-
En la columna Admin, escriba una etiqueta para describir el color al administrador de la tienda.
Si procede, también puede introducir la traducción del color para cada idioma admitido. En el siguiente ejemplo, el SKU se incluye como referencia en la etiqueta Admin porque los colores solo se utilizan para un producto específico. Puede incluir un espacio o un guion bajo en la etiqueta, pero no un guión.
-
En la columna Predeterminado, seleccione la muestra que será la opción predeterminada.
-
Para cambiar el orden de las muestras de color, haga clic en el icono Order
-
-
Cuando termine, haga clic en Save Attribute y actualice la caché cuando se le solicite.
-
Abra cada producto en modo de edición y actualice el atributo Color con la muestra correcta.
Para actualizar varios productos al mismo tiempo, siga los pasos a continuación.
Método 2: cargar una imagen de muestra
-
Para capturar una imagen para una muestra, abra la imagen del producto en un editor de fotos y guarde un área cuadrada de la imagen que represente el color, el patrón o la textura.
Si es necesario, puede repetir esta acción para cada variación del producto.
El tamaño y las dimensiones de la muestra vienen determinados por la temática. Por lo general, guardar una imagen como un cuadrado ayuda a conservar la relación de aspecto de un motivo.
-
En la barra lateral Admin, vaya a Stores > Attributes>Product.
-
En la cuadrícula, abra el atributo color en modo de edición.
-
Compruebe que Catalog Input Type for Store Owner está establecido en
Visual Swatch. -
Si prefiere no mostrar las imágenes de productos simples correspondientes cuando la muestra se selecciona en la página de visualización del producto, establezca Update Product Preview Image en
No. -
En Manage Swatch(valores de su atributo), haga clic en Add Swatch y haga lo siguiente:
-
En la columna Swatch, haga clic en la nueva muestra para mostrar el menú y elija Upload a file.
-
Vaya al archivo de muestra que ha preparado y elija el archivo que desea cargar.
-
Repita estos pasos para cada imagen de muestra.
-
Introduzca las etiquetas para el administrador y la tienda.
En este ejemplo, el SKU se incluye en la etiqueta Admin como referencia, ya que estos colores solo se utilizan para un producto específico. Puede incluir un espacio o un guion bajo en la etiqueta, pero no puede incluir un guion.
-
-
Cuando termine, haga clic en Save Attribute y actualice la caché cuando se le solicite.
-
Abra cada producto en modo de edición y actualice el atributo Color con la muestra correcta.
Para actualizar varios productos al mismo tiempo, siga los pasos a continuación.
Paso 2: Actualizar los productos
-
En la barra lateral Admin, vaya a Catalog > Products.
-
Use Filter para mostrar la lista por nombre o SKU e incluir solo los productos aplicables.
-
En la cuadrícula, seleccione la casilla de verificación de cada producto al que se aplique la muestra.
-
Establezca Actions en
Update Attributes.En este ejemplo, se seleccionan todas las configuraciones azules de los pantalones.
-
Desplácese hacia abajo hasta el atributo Color y seleccione la casilla de verificación Change.
-
Elija la muestra que se aplica a los productos seleccionados y haga clic en Save.
-
Cuando se le solicite, actualice la caché.
Añadir muestras a un producto sencillo
-
En la barra lateral Admin, vaya a Catalog > Products.
-
Abra un producto en modo de edición y compruebe su estado (debe estar activado).
-
Haga clic en el botón Create Configurations (en la ficha
Configurations). -
En la ventana emergente, elija el atributo Color y Next.
-
Seleccione muestras de color del atributo que desee incluir en este producto.
-
En la barra de progreso, haga clic en Next.
-
Configurar las imágenes, el precio y la cantidad.
En este paso, establezca las imágenes, los precios y la cantidad de cada configuración. Las opciones disponibles son las mismas para cada una y solo puede elegir una. Puede aplicar la misma configuración a todos los SKU, aplicar una configuración única a cada SKU u omitir la configuración por ahora.
-
Una vez completada la configuración de las imágenes, el precio y la cantidad, haga clic en Next en la esquina superior derecha.
Las variaciones de productos actuales aparecen en la parte inferior de la sección Configuración. Si está satisfecho con las configuraciones, haga clic en Generate Products.