Saltar al contenido principal

Publicado el 15 de septiembre de 2026

Cómo añadir tablas de tallas a las páginas de producto de sombreros y cascos

Un comprador llega a tu casco más vendido o a una gorra de talla fija. Le encanta el diseño, tiene la tarjeta preparada, pero se encuentra con el selector de talla.

De repente, se queda entre la «M» y la «L».

Lo que ocurre después afecta a tu rentabilidad. Abandona el carrito, pregunta a tu equipo «¿Talla pequeño?» o, peor aún, pide ambas tallas y devuelve la que no le sirve. Eso significa el doble de costes de envío, el doble de manipulación en almacén e inventario inmovilizado en tránsito.

La solución empieza junto a ese desplegable: aclarar la talla de inmediato antes de que el comprador se marche.

Tanto si usas Shopify como WooCommerce, aquí tienes cómo crear tablas específicas por producto, reducir las dificultades al elegir y convertir las dudas en ventas con confianza.

Empieza por la tabla del producto que vendes

La forma más rápida de generar devoluciones es aplicar una «Tabla de tallas de cascos» genérica a todo tu catálogo.

Las tallas nunca son universales. Un casco Bell Medium abarca 55–59 cm, mientras que un Shoei Medium cubre 57–58 cm. Una gorra ajustada de talla estadounidense 7¼ puede equivaler a 57,7 cm en una marca y a 58 cm en otra. Cuando la información es vaga y el comprador adivina, el comerciante paga la devolución.

Toda guía específica por producto debe incluir:

  • La marca y el modelo o gama exactos, nunca solo una tabla general para toda la web.
  • Etiquetas que coincidan con el selector, como S/M/L, tallas numéricas o centímetros.
  • Intervalos de contorno de cabeza, claramente indicados en centímetros y pulgadas.
  • Instrucciones de medición del fabricante y orientación cuando la medida queda entre tallas.

En sombreros de talla fija, conserva las denominaciones regionales del fabricante. En los ajustables, indica el intervalo de contornos admitido cuando esté disponible.

Para los cascos, incluye las indicaciones de ajuste propias del modelo. La medida del contorno ayuda a elegir talla; aun así, los compradores deben seguir las instrucciones del fabricante y comprobar físicamente el ajuste al recibirlo. Instrucciones de seguridad de SHOEI

Regla práctica: reutiliza una tabla solo cuando las medidas del fabricante sean realmente idénticas.

Elige tu configuración

Tu tienda necesita…Empieza por…
Pocas tablas y una ficha de producto sencillaLa guía de tallas o ventana modal integrada en tu tema
Guías distintas para varias marcas y productosUna aplicación o plugin con reglas de asignación dinámicas
Una posición o diseño que el tema no admiteUna modificación de código en la plantilla del producto
Medir la cabeza sin cinta métricaUn widget integrado de medición por cámara

Revisa primero tu tema actual. Muchos temas modernos ya incluyen un bloque modal o panel lateral configurable sin software adicional.

Cómo añadir tablas de tallas en Shopify

Opción 1: utiliza una ventana del tema y un metacampo de producto

Un metacampo guarda información de un producto concreto sin añadir una suscripción mensual a una aplicación. Shopify documenta una configuración nativa que vincula cada producto con su propia página de guía de tallas.

Para un tema compatible con Online Store 2.0:

  1. Crea la página de la guía: ve a Online Store → Pages y crea una página clara con la tabla y las instrucciones de medición.
  2. Define un metacampo de producto: entra en Settings → Custom Data → Products. Crea un campo llamado «Size chart» de tipo Page reference.
  3. Añade un bloque emergente: en el editor del tema, abre la plantilla de producto predeterminada e inserta un Pop-up block dentro de Product information.
  4. Conecta la fuente dinámica: pulsa el icono de fuente dinámica en el ajuste del contenido emergente y enlaza el nuevo metacampo «Size chart».
  5. Asigna la guía por producto: abre cada producto en Shopify, selecciona la página correspondiente en el metacampo y guarda.

Cuidado con las ventanas vacías: Shopify indica que el enlace puede seguir visible aunque la referencia de página esté vacía. Abrir una ventana sin contenido frustra al comprador. Usa una plantilla separada para accesorios sin tabla o pide a un desarrollador una condición sencilla ({% if product.metafields.custom.size_chart != blank %}). Tutorial de Shopify sobre tablas de tallas emergentes

Coloca el enlace justo encima o al lado del selector, donde lo permita el tema. Cada distancia adicional entre el selector y la guía aumenta el riesgo de abandono.

Opción 2: utiliza una aplicación especializada

Una aplicación se vuelve necesaria cuando gestionar metacampos manualmente para cientos de referencias de varias marcas lleva más tiempo que vender.

Por ejemplo, Kiwi Size Chart & Recommender ofrece asignación por colecciones y etiquetas, conversión automática de unidades y visualización modal.

Antes de elegir, comprueba si puede:

  • Asignar tablas automáticamente según proveedor, colección o etiqueta del producto.
  • Colocar la guía junto al selector de talla.
  • Mostrar tablas adaptables y legibles en móvil, sin desplazamientos horizontales incómodos.
  • Admitir unidades métricas e imperiales en el plan elegido.

Tras instalarla, sigue los pasos de activación en la tienda. Crear la tabla en el panel no termina el trabajo: abre una página publicada y confirma que se puede tocar y leer fácilmente.

Cómo añadir tablas de tallas en WooCommerce

Opción 1: utiliza tu tema o plantilla de producto

En un catálogo pequeño, puedes mostrar una tabla directamente en una pestaña de producto dedicada o en una sección desplegable bajo los controles de compra.

Si usas un tema de bloques, personaliza el diseño en Appearance → Editor → Templates → WooCommerce → Single Product. WooCommerce permite reorganizar los bloques de detalles y opciones de compra. Documentación de plantillas de producto de WooCommerce

Cuidado con las plantillas compartidas: añadir una tabla fija a una plantilla Single Product común impone esa tabla a todos los productos que la usan. Para varias marcas, mantén las plantillas genéricas e introduce los datos mediante pestañas, campos personalizados o un plugin de asignación.

Opción 2: utiliza un plugin de tablas de tallas

La extensión Size Chart for WooCommerce ofrece tablas reutilizables, reglas por categoría y etiqueta, y posiciones flexibles del botón.

Sigue esta secuencia:

  1. Instala y activa la extensión.
  2. Abre Chart Manager y crea una tabla.
  3. Introduce los intervalos de contorno de cabeza y pasos de medición claros.
  4. Asigna la tabla a los productos, categorías o etiquetas correspondientes.
  5. Elige el formato, ventana modal o pestaña adicional, y la posición del botón.
  6. Previsualiza un producto asignado en la tienda publicada.

Las posiciones habituales incluyen después del precio, de la descripción corta o del área de añadir al carrito. Prueba cuál acerca más la guía al selector de talla.

Si el tema restringe la posición, comprueba la compatibilidad de la plantilla antes de contratar un plugin de pago.

Coloca la guía junto al selector de talla

Un cliente que está eligiendo talla nunca debería buscar en el pie de página ni pasar las reseñas para encontrar las medidas.

Usa una etiqueta directa y conocida:

Guía de tallas, o Guía de tallas y medición si incluye instrucciones para medir.

Elige un formato que proteja el proceso de compra:

  • Ventana modal (recomendada): mantiene la página despejada y deja espacio para tablas y diagramas claros sin sacar «Añadir al carrito» de la pantalla.
  • Sección desplegable / acordeón: funciona bien si las medidas se abren justo debajo del selector.
  • Tabla integrada: mejor para tablas compactas que encajen junto a las opciones de compra sin saturar el diseño.

En una ventana, el botón de cierre debe destacar y poder pulsarse con el pulgar. Nunca recargues ni restablezcas la página al cerrar: conserva la variante elegida para permitir la compra inmediata.

Muestra claramente centímetros y pulgadas

Etiqueta las medidas de forma explícita: Contorno de cabeza (cm) o Contorno de cabeza (pulgadas). «Talla» por sí solo no explica qué representa la cifra.

Si un comprador internacional tiene que abrir otra pestaña para convertir unidades, es muy probable que no vuelva a completar el pedido.

Dos opciones funcionan especialmente bien:

  • Mostrar centímetros y pulgadas en columnas contiguas.
  • Ofrecer un interruptor interactivo cm / in.

Para convertir, divide los centímetros entre 2,54 y obtendrás pulgadas; por ejemplo, 58 cm son aproximadamente 22,8 pulgadas.

Mantén los intervalos originales del fabricante como referencia. Revisa los límites convertidos para que el redondeo no cree huecos ni solapamientos confusos.

Las tallas numéricas de sombreros necesitan etiquetas diferenciadas: la talla estadounidense 7¼ es una denominación de talla, no un contorno de 7¼ pulgadas. Muestra la medida real al lado para evitar confusiones.

Asigna tablas según las reglas de tallaje

Asignar tablas por categorías amplias es un atajo que suele fallar. En sombreros y cascos, distintas marcas de una categoría rara vez comparten el mismo ajuste.

Grupo de productosMétodo de asignación
Variantes de color de un modelo de talla fijaCompartir tabla si las medidas son idénticas
Cascos de adulto y juveniles de una marcaAsignar tablas separadas por intervalo de tallas de calota
Varias marcas en «Cascos de ciclismo»Asignar por marca y línea de modelo concreta
Modelo especial con ajuste de competición muy ceñidoCrear una regla específica del producto que prevalezca sobre las demás

Comprueba la prioridad de tu software: confirma si una regla de producto prevalece sobre una de categoría.

Revisa también qué ocurre si no coincide ninguna regla. Mostrar una tabla predeterminada sin relación induce a error. Es más seguro no mostrar ninguna que mostrar una incorrecta.

Comprueba todo el recorrido en un teléfono

Más del 70 % de la navegación sobre sombreros y otros artículos para la cabeza se realiza en móvil. Abre una página publicada en tu teléfono y recorre el proceso de compra:

  1. Localiza la guía: ¿el enlace se ve junto al selector sin desplazarte hacia abajo?
  2. Abre y revisa: ¿puedes leer cada columna sin ampliar ni hacer zoom?
  3. Cambia las unidades: ¿el selector responde bien en una pantalla táctil?
  4. Cierra la guía: ¿se mantiene la variante seleccionada al volver?
  5. Prueba otras variantes: cambia color o estilo y confirma que la guía se actualiza o sigue accesible.
  6. Busca obstáculos: asegúrate de que las barras inferiores fijas, avisos de cookies y chats no tapen la guía ni su cierre.

Evita las capturas: nunca subas una imagen de una hoja de cálculo como tabla de tallas. En móvil se vuelve borrosa, ilegible y difícil de ampliar con claridad. Utiliza siempre tablas HTML o basadas en texto.

Cuando tu cliente sigue sin tener cinta métrica

Has creado la tabla perfecta. La ventana se adapta a la pantalla, las unidades están claras y las asignaciones son correctas.

Pero los clientes siguen dudando. Siguen escribiendo al soporte. Siguen pidiendo dos tallas y devolviendo una.

¿Por qué?

Porque nadie lleva una cinta de sastre en el bolsillo.

Cuando alguien consulta cascos o sombreros en el móvil, pedirle que busque una cinta flexible, o un cordel y una regla, interrumpe la compra. La mayoría adivinará. Muchos se equivocarán. Otros abandonarán el carrito.

Aquí es donde Head Measurement Tool de TWIWT elimina esa dificultad.

En lugar de adivinar o buscar una cinta, los compradores usan la cámara del móvil o portátil directamente en el navegador. En segundos, el widget mide el contorno de cabeza y lo relaciona con la tabla específica que has configurado para el producto, recomendando la talla al instante.

Así ayuda a tu tienda:

  • De elegir a comprar: elimina las conjeturas y aporta claridad en la propia página de producto.
  • Respeta las reglas de varias marcas: asigna las medidas a tus marcas, modelos y tablas personalizadas.
  • Alternativa sin riesgo: quienes prefieren medir manualmente o rechazan la cámara siguen usando la tabla habitual sin interrupción.
  • Configuración sencilla: se integra en Shopify mediante la aplicación TWIWT Head Measurement, o en WooCommerce y tiendas personalizadas con una línea de JavaScript.
  • Expectativas realistas: para cascos, el resultado sigue siendo una recomendación basada en el contorno. Ofrece un punto de partida y recuerda seguir las instrucciones del fabricante y comprobar físicamente el ajuste.

Descubre cómo funciona con los productos que vendes.

Deja de perder pedidos por dudas de talla y devoluciones tras comprar varios tamaños.