Diseñar Muestras de Color de Producto con el Elemento Variantes y Muestras

¿Qué es una Muestra de Color de Producto?

Una muestra de color de producto es un botón de color en el que se puede hacer clic y que se muestra en su página de producto. Cada muestra representa una opción de color para el producto. Cuando un cliente hace clic en una muestra, la imagen y los detalles del producto se actualizan instantáneamente para coincidir con el color seleccionado.

En lugar de navegar por menús desplegables, las muestras de color hacen que sea más rápido y fácil para los clientes:

• Visualizar variaciones de producto (por ejemplo, camisetas rojas, azules, negras).
• Comparar opciones disponibles de un vistazo.
• Mejorar la experiencia de compra, lo que puede aumentar las conversiones.

Cómo Configurar Variantes de Color en Shopify

GemPages muestra muestras de color de producto basándose en las variantes que usted ya ha configurado en Shopify.

Paso 1: Inicie sesión en su Administración de Shopify.

Paso 2: Vaya a Productos > Seleccione un producto que desee editar.

Paso 3: Desplácese hacia abajo hasta la sección variantes .

Paso 4: Agregue o edite sus opciones de color (por ejemplo, Rojo, Azul, Verde).

Paso 5: Haga clic en guarde.

Cómo Agregar Muestras de Color de Producto en GemPages

Paso 1: Abra el Editor

Desde Panel de Control de GemPages, seleccione su plantilla preferida (plantilla de página de producto) y ábrala en el Editor.

Paso 2: Inserte el Elemento Variantes y Muestras

• En la barra lateral izquierda, vaya a la sección Producto .
• Localice la opción elemento Muestras de Producto.
• Arrastre y suelte el elemento dentro de su Módulo de Producto en la página.

Paso 3: Configure los Ajustes de Variante

• Haga clic en el elemento para abrir el panel de configuración en la barra lateral izquierda.
• En Configuraciones de Variantes, asegúrese de que el Tipo esté configurado como Separado.

Esto asegura que las variantes se muestren en categorías distintas.

Paso 4: Active las Muestras de Color de Producto

• Vaya a Opción > Estilo en la configuración del elemento.
• Seleccione Muestra de color.

• Haga clic en Editar color para abrir el panel Configurar estilo de variantes . Aquí encontrará herramientas para gestionar y personalizar cómo aparecen sus muestras.

Paso 5: Asigne Colores a las Variantes

• Haga clic en cada variante.
• Elija un color de la paleta or ingrese manualmente el código hexadecimal para colores precisos.
• Cuando termine, haga clic en Aplicar para todos los productos.

Esto asegura que el valor de color seleccionado se aplique universalmente en todos los productos con el mismo nombre de variante (por ejemplo, "Rojo" se verá consistente en cada producto que tenga una opción Roja).

Paso 6: Guarde y Publique

Después de configurar sus muestras de color de producto, haga clic en guarde en la esquina superior derecha.

Luego haga clic en Publicar para hacer que los cambios estén activos en su tienda.