> ## Documentation Index
> Fetch the complete documentation index at: https://help.chateea.com/docs/llms.txt
> Use this file to discover all available pages before exploring further.

# Estilos del selector de productos

> Controla cómo el cliente elige variantes, precios y cantidades en la página de producto.

El estilo del selector controla cómo se muestran las opciones seleccionables en la página de detalles del producto: variantes, precios, cantidades y complementos de venta adicional.

Elegir bien este formato ayuda a que el cliente entienda rápido sus opciones y complete la compra con menos fricción.

## Los dos formatos disponibles

> **Menú desplegable**
>
> Muestra las opciones dentro de un menú compacto que se despliega al hacer clic.

> **Pastillas**
>
> Muestra las opciones como botones seleccionables, visibles directamente en la página.

## Qué ganas al personalizarlo

| Ventaja | Detalle |
| - | - |
| **Más visibilidad de las opciones** | Las pastillas muestran todas las variantes desde el inicio, lo que facilita que el cliente las descubra |
| **Experiencia uniforme** | Variantes, cantidad, complementos y selectores de precios múltiples siguen el mismo patrón visual |
| **Mejor uso en móvil** | El comportamiento está optimizado tanto para escritorio como para la tienda móvil |
| **Control de diseño** | Eliges entre un diseño compacto o uno más visual |
| **Vista previa confiable** | El comportamiento se refleja en el creador de páginas y en la vista previa, para revisar antes de publicar |

## Cuál elegir

La decisión depende de **cuántas variantes tiene tu producto** y de cuánta visibilidad quieres darles.

| | Menú desplegable | Pastillas |
| - | - | - |
| **Cómo se ve** | Opciones ocultas dentro de un menú | Opciones visibles como botones en la página |
| **Cantidad de variantes** | Productos con muchas opciones | Productos con pocas opciones |
| **Diseño de página** | Compacto, ocupa poco espacio | Más visual, ocupa más espacio |
| **Comparación entre opciones** | El cliente debe abrir el menú | El cliente compara de un vistazo |
| **Personalizar colores** | No disponible | Disponible para estados seleccionado y no seleccionado |
| **Ideal para** | Tiendas que prefieren la experiencia tradicional o quieren mantener el comportamiento por defecto | Tiendas que buscan una experiencia más visual y donde la visibilidad de las opciones importa |

> [!TIP]
>
> Regla práctica: si tus variantes caben cómodamente en una fila o dos, usa **pastillas**. Si tienes quince tallas o veinte colores, el desplegable evita que la página se vuelva ilegible.

## Cómo configurarlo

**1. Abre tu tienda en el creador**

Entra al creador de tu tienda y edita la página de detalles del producto.

**2. Selecciona el elemento Producto**

Haz clic sobre el elemento **Producto** en la página.

**3. Busca la opción Estilo de variantes**

En el panel de configuración general del elemento, localiza **Estilo de variantes**.

**4. Elige el estilo**

Selecciona **Menú desplegable** o **Pastillas**.

**5. Revisa en la vista previa**

Comprueba que las variantes, las opciones de precio y los controles de cantidad se muestren bien **en todos los dispositivos**.

> [!WARNING]
>
> Revisa especialmente en móvil. Un conjunto de pastillas que se ve equilibrado en escritorio puede desbordarse en una pantalla pequeña.

**6. Guarda y publica**

Cuando todo se vea bien, guarda los cambios y publica la página.

## Notas importantes

> **El desplegable sigue siendo el formato por defecto**
>
> Las tiendas existentes mantienen el menú desplegable. Nada cambia automáticamente.

> **Tu tienda no cambiará sola a pastillas**
>
> El cambio es siempre manual, desde la configuración del elemento Producto.

> **Las pastillas permiten una sola selección por grupo**
>
> Por ejemplo, una talla del grupo de tallas y un color del grupo de colores. No se pueden marcar dos opciones del mismo grupo.

> **La personalización de color solo existe en pastillas**
>
> Los colores de cantidad y de estados seleccionados solo son configurables con este estilo, para mantener la coherencia visual del selector.

## Preguntas frecuentes

> **¿Esto va a cambiar el diseño de mi tienda actual?**
>
> No. Las tiendas existentes siguen usando el menú desplegable a menos que lo cambies manualmente en la configuración del elemento Producto.

> **¿Cuál es la diferencia entre desplegable y pastillas?**
>
> El desplegable guarda las opciones dentro de un menú. Las pastillas las muestran como botones seleccionables directamente en la página.

> **¿Cuándo conviene usar pastillas?**
>
> Cuando quieres que el cliente vea todas las opciones desde el primer momento. Funciona bien con productos que tienen pocas variantes o en tiendas que buscan una experiencia más visual.

> **¿Cuándo conviene usar el desplegable?**
>
> Cuando el producto tiene muchas variantes o cuando quieres una página de producto más compacta.

> **¿Puede el cliente elegir más de una opción del mismo grupo?**
>
> No. Las pastillas admiten una sola selección por grupo de variantes.

> **¿Los selectores de precios múltiples siguen el mismo estilo?**
>
> Sí. Adoptan la misma configuración de desplegable o pastillas que los selectores de variantes.

> **¿Por qué no puedo personalizar los colores con el desplegable?**
>
> La personalización de color solo está disponible con el estilo de pastillas, para mantener coherente el diseño del selector.

> **¿Puedo previsualizar antes de publicar?**
>
> Sí. El comportamiento se refleja tanto en el creador de páginas como en la vista previa.

> **¿Aplica también a la tienda móvil?**
>
> Sí. El selector está optimizado tanto para escritorio como para móvil.

## Continúa

> **[Embudos y sitios web](https://help.chateea.com/docs/sitios/introduccion.md)**
>
> Construye páginas que convierten.

> **[Pagos y facturación](https://help.chateea.com/docs/pagos/introduccion.md)**
>
> Cobros, catálogo y complementos de venta.


This documentation is built and hosted on [Mintlify](https://mintlify.com), a developer documentation platform.