Configuración del plugin
Alcance escrito de configuración para tu tienda, tema y plugins actuales.
Solicitar configuraciónGratis, Open Source
Swatch
Muestras de variación en lugar de desplegables
Swatch sustituye los desplegables de variación estándar de WooCommerce por muestras visuales y accesibles en la página de producto. Elige un tipo de muestra por atributo, puntos de color o pills de botón o etiqueta, y define un color o una etiqueta por término. Las muestras controlan el formulario de variación nativo, de modo que el precio, el stock y el carrito se actualizan como de costumbre.
Open Source GPLv2
Open source, con licencia GPLSin cuenta, sin tarjetaSin jQuery, manejable por teclado
Funciona con
WooCommerceGutenbergStorefrontAstraGeneratePressKadenceCompatible con Multisite
Así se ve en la práctica
Los desplegables de variación cuestan de interpretar
Quien elige un color o una talla de un desplegable no ve qué aspecto tiene la variación. Eso ralentiza la decisión y hace que la tienda parezca menos cuidada que la competencia que usa muestras.
- ✗ Colores y tallas ocultos en un desplegable
- ✗ La clientela no ve la variación antes de elegir
- ✗ Los plugins de muestras suelen cargar jQuery y ralentizan la tienda
- ✗ Muestras sin compatibilidad con teclado ni lector de pantalla
Swatch muestra las variaciones como muestras accesibles
- ✓ Muestras de color y de botón o etiqueta en lugar de desplegables
- ✓ Tipo de muestra elegible de forma independiente por atributo
- ✓ Formulario de variación nativo: precio, stock y carrito como de costumbre
- ✓ Renderizado en JavaScript puro, sin jQuery
Muestras de color y de botón
Dos tipos de muestra, puntos de color y pills de botón o etiqueta, elegibles por atributo.
Tipo por atributo
Elige el tipo de muestra en la página de atributos globales, de forma independiente para cada atributo.
Color y etiqueta por término
El color se guarda mediante sanitize_hex_color y una etiqueta propia se guarda como term meta.
Formulario de variación nativo
Las muestras controlan el formulario de WooCommerce; el precio, el stock y el botón Añadir al carrito se actualizan igual que con los desplegables.
Manejable por teclado
Semántica de radiogroup y navegación con las teclas de flecha, con etiquetas para lectores de pantalla.
Aspecto accesible
Anillos de foco visibles, contraste suficiente, respetuoso con el movimiento reducido y sin saltos de diseño.
Recurso limpio
Un atributo sin datos de muestra conserva el desplegable estándar; nunca se rompe nada.
Página de ajustes
Activa o desactiva y define el tipo de muestra predeterminado en el menú de WooCommerce.
Listo en tres pasos
Activa las muestras y muestra la primera variación en la página de producto.
01
Instalar
Activa Swatch junto con WooCommerce.
02
Definir los tipos
Elige el tipo predeterminado en WooCommerce > Swatch y luego define un tipo por atributo en la página de atributos globales.
03
Asignar colores
Define un color o una etiqueta para cada término en Productos > Atributos y luego abre la página de un producto variable.
Para quién está pensado
Cuando los productos tienen variaciones de color y talla: una selección clara sin un plugin pesado.
Moda y ropa
Colores y tallas visibles de un vistazo, sin adivinar desde un desplegable.
- ✓ Muestras de color
- ✓ Etiquetas de talla
- ✓ Sin jQuery
Tiendas con muchas variaciones
Tipo de muestra por atributo, color como punto, talla como etiqueta.
- ✓ Tipo por atributo
- ✓ Term meta
- ✓ Formulario nativo
Tiendas sin jQuery
Un script pequeño que se engancha a los eventos de variación, en lugar de una librería en cada página.
- ✓ JS puro
- ✓ ARIA radiogroup
- ✓ Cero CLS
Qué añade PRO y por qué importa
Muestras de imagen
Sube una imagen por término de atributo, que se muestra como miniatura en la página de producto.
Galería por variación
Imágenes de galería adicionales por variación, con una tira de miniaturas debajo de la galería principal.
Muestras en páginas de archivo
Muestra las muestras en los listados de tienda, categoría, etiqueta y búsqueda, con enlace al producto y a la opción elegida.
Tooltips detallados
Muestra una vista previa de la muestra de color, la etiqueta o la imagen de la variación al pasar el ratón y al enfocar con el teclado, en las páginas de producto y de archivo.
Tamaños y formas personalizados
Muestras pequeñas o grandes, y formas redondas, cuadradas, redondeadas o de pill por atributo global.
Qué incluye: FREE o PRO
PRO mantiene todo lo del plugin gratuito y añade los módulos siguientes.
CaracterísticaFREEPRO
Muestras de color y de botón✓✓
Tipo por atributo✓✓
Color y etiqueta por término✓✓
Formulario de variación nativo✓✓
Manejable por teclado✓✓
Aspecto accesible✓✓
Recurso limpio✓✓
Página de ajustes✓✓
Muestras de imagen×✓
Galería por variación×✓
Muestras en páginas de archivo×✓
Tooltips detallados×✓
Tamaños y formas personalizados×✓
Swatch vs Variation Swatches vs YITH Color & Label Variations
How Swatch compares to the popular WooCommerce variation swatches plugins.
| Swatch | Variation Swatches | YITH Color & Label | |
|---|---|---|---|
| Free version | Yes | Yes | Yes |
| Color + button/label swatches | Yes | Yes | Yes |
| Swatch type per attribute | Yes | Yes | - |
| Color or label per term | Yes | Yes | Yes |
| Uses the native variation form (no rebuild) | Yes | - | - |
| Keyboard + screen-reader accessible | Yes | - | - |
| No jQuery (lightweight) | Yes | - | - |
| Open source (GPLv2) | Yes | Core GPL | Core GPL |
| Paid plan price | from €19/yr | $49/yr | Free + premium |
Competitor data and pricing as of June 2026; check the vendors' sites for current pricing.
¿Necesitas más? Swatch PRO
FREE cubre las muestras de color y de botón o etiqueta. Swatch PRO añade muestras de imagen y tiras de galería por variación.
- ✓ Muestras de imagen por término (disponible)
- ✓ Imágenes de galería por variación (disponible)
- ✓ Muestras en archivos dentro de los bucles de la tienda (disponible en PRO)
- ✓ Tooltips completos al pasar el ratón y al enfocar (disponible en PRO)
- ✓ Tamaños y formas propios por atributo (disponible en PRO)
Soporte y recursos
Cada plugin tiene su propia documentación con guías de configuración. Los errores y preguntas van al repositorio público GitHub del plugin, respondemos abiertamente.
Estado de mantenimiento
Este plugin recibe mantenimiento. No hemos anunciado una fecha de fin de soporte y, cuando lo hagamos, se indicará aquí y en una versión.
¿Necesitas ayuda más allá del plugin?
Envía por escrito el contexto de la tienda. Recibirás una propuesta de alcance sin llamada comercial.
Auditoría de compatibilidad
Revisión con checkout, HPOS, bloques, tema e integraciones críticas.
Solicitar auditoríaIntegración a medida
Un conector o extensión con alcance definido para tu proceso.
Describir la integraciónTu email se usa solo para responder a esta solicitud. El marketing requiere un consentimiento explícito separado.
Preguntas frecuentes
¿Se necesita WooCommerce?
Sí. Swatch amplía los productos variables de WooCommerce y no hace nada sin WooCommerce.
¿Qué pasa con los atributos que no he configurado?
Conservan el desplegable estándar de WooCommerce. Las muestras de color sin colores definidos recurren automáticamente al desplegable, de modo que nunca se rompe nada.
¿Swatch usa jQuery?
No. El frontend es JavaScript puro que se engancha a los propios eventos de variación de WooCommerce.
¿Las muestras se pueden manejar por teclado?
Sí. Las muestras usan semántica de radiogroup, funcionan con las teclas de flecha y están etiquetadas para lectores de pantalla.
¿Dónde defino el color y la etiqueta?
En Productos > Atributos, en cada término de un atributo global. El color se guarda mediante sanitize_hex_color y la etiqueta como term meta.
¿Las muestras cambian el precio y el stock?
Sí. Las muestras controlan el formulario de variación nativo de WooCommerce, de modo que el precio, el stock y el botón Añadir al carrito se actualizan igual que con los desplegables.
¿Qué tipos de muestra hay disponibles?
Puntos de color y pills de botón o etiqueta, elegibles de forma independiente para cada atributo.
¿Swatch se puede combinar con Sizer y Shortlist?
Sí. Sizer añade una tabla de tallas a la página de producto y Shortlist una lista de deseos. Swatch complementa la selección de variaciones con muestras claras.
How does Swatch compare to Variation Swatches and YITH Color & Label Variations?
All three turn variation dropdowns into colour and label swatches. Swatch uses the native variation form, is keyboard accessible and jQuery-free, free and open source with PRO from €19/yr, versus Variation Swatches Pro at $49/yr. Pricing as of June 2026.
Muestra las variaciones como muestras
Muestras de color y etiqueta en lugar de desplegables, accesibles y sin jQuery. La edición FREE completa bajo GPL.
Obtener en WordPress.orgFREE ofrece muestras de color y etiqueta completas; PRO añade muestras de imagen, galerías por variación y vistas previas en el bucle de archivo.