- ¿Qué es una página de colección de Shopify?
- ¿Para qué utilizas una colección de Shopify?
- Componentes de una página de colección de Shopify
- ¿Cómo agregar colecciones en Shopify?
- Cómo crear páginas de colección personalizadas de Shopify con GemPages
- Crea tu página de Colección con la nueva función de IA de GemPages: Image-to-Layout
- Cómo usar GemPages para agregar colecciones a cualquier página
- Consejos y trucos para crear páginas de colección de Shopify con alta tasa de conversión
- Ejemplos de páginas de colección de Shopify
- ¿Estás listo para agregar colecciones a tus páginas de Shopify?
- Preguntas frecuentes sobre las colecciones de Shopify
Colecciones de Shopify: guía completa (actualizada en 2025)

En 2021, una encuesta de Top Design Firms a 500 consumidores reveló que el 38 % mira los enlaces de navegación de una página web cuando visita un sitio web por primera vez. También descubrieron que el 42 % de los encuestados abandonaría un sitio web debido a una funcionalidad deficiente. Una encuesta similar realizada por Komarketing arrojó resultados similares: el 37 % de los encuestados afirmó que abandonaría un sitio web si no pudiera encontrar lo que buscaba.

La funcionalidad y la usabilidad son las claves para un sitio web de alta conversión.
Las colecciones de Shopify son una parte importante de su embudo de conversión: el camino que se recorre desde que un visitante conoce su(s) producto(s) hasta que finalmente realiza una compra.
¿Qué es una página de colección de Shopify?

Alchemy Jewelry utilizó GemPages para crear esta colección para su joyería.

¿Para qué utilizas una colección de Shopify?
Hay muchas formas de presentar tus colecciones:
- Productos especializados para distintos tipos de compradores objetivo, por ejemplo: hombres, mujeres o niños.
- Productos para un uso o función específicos. Por ejemplo: artículos para mascotas , muebles y libros.
- Elementos del producto que tienen una especificación particular. Por ejemplo: tamaño, estilo y color.
- Productos que están en oferta o son para ocasiones especiales o eventos de temporada. Por ejemplo: útiles escolares o suéteres navideños.
- Colecciones manuales : una colección manual de Shopify incluye todos los productos individuales que elijas agregar. Este tipo de colección es más difícil de mantener y permanecerá igual si no agregas ni eliminas ningún producto. Puedes usar una colección manual para ocasiones como ventas relámpago o descuentos especiales.
- Colecciones automatizadas : una colección automatizada de Shopify agrega productos según las condiciones específicas del usuario. Una vez que un producto cumple con las condiciones requeridas de la selección del consumidor, se agregará automáticamente a la colección. Las colecciones automatizadas ayudan a ahorrar tiempo si tiene muchos productos que deben incluirse en una colección.
Componentes de una página de colección de Shopify
Nombre de la categoría

La categoría de Uniqlo para “Mujeres” está resaltada en rojo para facilitar la navegación.
Pan rallado
Las rutas de navegación muestran las categorías principales o subcategorías de la página de tu colección. Los compradores pueden moverse rápidamente entre categorías independientes y ver diferentes páginas de colección mientras exploran tu lista de productos.
Las migas de pan de The Gap navegan a varias páginas de colección.
Ordenar menú
El menú de clasificación tiene varias opciones para que los compradores puedan examinar rápidamente los productos según diferentes criterios como: "Más vendidos", "Orden alfabético", "A-Z", "Precio, de menor a mayor" y "Fecha, de más nuevo a más antiguo".
Los clientes pueden buscar y evaluar productos en un orden específico o según una especificación particular (por ejemplo, "más vendidos").
Nombre de la página
Como se mencionó anteriormente, una categoría puede tener muchas páginas de colección y todas son distintas. En el siguiente ejemplo, la categoría "Maquillaje" contiene diferentes páginas de colección, como "Todo el maquillaje", "Maquillaje facial" o "Maquillaje de labios".
Macy's tiene al menos seis páginas de colección en cada categoría de su tienda de comercio electrónico.
Páginas
Para poder navegar y ver los numerosos productos que contiene cada página de colección, los usuarios deben navegar por las páginas. A menudo, una cantidad de 10, 50 o más de 100 productos por página es suficiente.
Aumente las interacciones y facilite a los clientes la compra mejorando su experiencia de navegación.
Navegar por
Un menú de navegación permite a los clientes navegar a una página de subcategoría más específica de su página de colección. Véalo usted mismo en el siguiente ejemplo de COACH.
Subcategoría de Ropa dentro de la página de colección Estilos para Hombres de COACH.
Menú de filtros
Una vez que el cliente ha realizado su búsqueda y ha llegado a una página de colección específica, puede usar el menú de filtro para limitar las opciones de productos por atributos como color, precio, tamaño, marca, disponibilidad en la tienda y más.
Detalles del producto
Los detalles del producto ayudan a informar a los compradores sobre cada producto. La información incluye el nombre del artículo, su precio, los colores disponibles, las valoraciones de los clientes, las ofertas promocionales y mucho más.
Branelo Store coloca etiquetas en sus productos para notificar a los clientes sobre sus ofertas especiales.
¿Cómo agregar colecciones en Shopify?
1. Cómo crear una colección en Shopify


Paso 3: Agrega productos a colecciones en Shopify : navega a la sección Productos y busca tu producto. Agrega la colección correspondiente.

>>Lea este artículo para obtener más información sobre cómo crear una nueva colección de Shopify con GemPages.
2. Agregar colecciones a páginas en Shopify
Ahora que tus colecciones están configuradas, es hora de mostrar tus colecciones favoritas. Supongamos que quieres destacar el catálogo de tu tienda en la página de inicio . Hay dos formas de hacerlo:- Muestra una colección destacada para presentar los productos que deseas o incluso todos ellos en cualquier página de Shopify , o
- Muestra una lista de colecciones que enlaza a las páginas de colecciones de tu tienda .
2.1. Agregar colecciones destacadas
Paso 1: En tu Panel de Control de Shopify , ve a Tienda en línea > Temas y elige 'Personalizar' tu tema en vivo .





2.2. Agrega listas de colecciones a tu página de Shopify
Paso 1: En tu Panel de Control de Shopify , ve a Tienda en línea > Temas y elige “Personalizar” .






Cómo crear páginas de colección personalizadas de Shopify con GemPages
¿Sabes que puedes hacer mucho más con tus páginas de colección usando GemPages ?
Ahora que el panel de control de GemPages se ha actualizado , en sincronía con el sistema de diseño Polaris, se integra perfectamente con el administrador de Shopify.
Esta incorporación le permite editar con GemPages sin problemas dentro de la interfaz familiar de Shopify, lo que garantiza un proceso unificado y efectivo para crear y personalizar páginas.
Paso 1: Desde la interfaz de Shopify, puedes ver el panel de control de GemPages. Haz clic en "Páginas" en la lista de la barra lateral izquierda. Verás la opción "Crear nueva página" en la esquina superior derecha.

Paso 2: Seleccione “Páginas de colección” y, en unos minutos, debería ver varias plantillas prediseñadas que puede usar para crear su página de colección. Seleccione su plantilla preferida y haga clic en “Seleccionar” para comenzar o haga clic en “Vista previa” para ver si se adapta a sus necesidades.

De lo contrario, si ya tienes un diseño en mente, puedes comenzar a editarlo desde una página en blanco seleccionando “Comenzar desde cero” .
Nota: después de crear una página de colección, debe asignar una o varias colecciones a esa plantilla para que se publique. Haga clic aquí para ver un tutorial detallado.Paso 3: Dentro del editor, haz clic en el elemento Lista de productos para configurarlo, luego selecciona ' Asignar colección ' para asignar una colección a la página de colección que creaste.


Crea tu página de Colección con la nueva función de IA de GemPages: Image-to-Layout
Como característica destacada de GemPages, que utiliza tecnología de inteligencia artificial, Image-to-Layout ayuda a convertir imágenes o URL en diseños editables. Gracias a esta función, la estructura de las referencias se decodifica rápidamente para que puedas personalizarla.
Sigue los pasos anteriores para ingresar al editor de GemPages. Verás un cuadro de referencia para insertar la imagen o URL que desees:

Cuando la IA termine de leer, podrás elegir qué secciones quieres mostrar en tu página. Para finalizar, haz clic en " Generar ".
Requisitos para cargar imágenes y URL:
- Para URL:
- Solo en idioma inglés
- Asegúrese de que la URL sea de acceso público, lo que significa que el sitio no debe estar bloqueado por ningún tipo de autenticación (por ejemplo, contraseña) o abierto solo para una ubicación específica o visitantes específicos.
- El sitio no debe exceder de 25 secciones.
- Para la imagen:
- Tamaño máximo de archivo: 20 MB
- No hay requisito de tamaño mínimo de archivo
- Ancho mínimo: 1440px
- Altura máxima: 20000px
- Formatos admitidos: png, jpg, jpeg
La función de inteligencia artificial de GemPages ha recibido elogios generalizados por sus excepcionales beneficios, lo que la convierte en una herramienta indispensable para usuarios de todos los niveles de competencia en diseño. La brillantez de esta inteligencia artificial reside en sus capacidades inteligentes, que no solo agilizan el proceso de diseño, sino que también ahorran un tiempo valioso. Los usuarios han expresado su satisfacción con la plataforma, destacando su naturaleza fácil de usar y su idoneidad para personas con diferentes habilidades de diseño.
Empiece a explorar GemPages ahora para descubrir todo el potencial de esta notable función de inteligencia artificial. No pierda la oportunidad de mejorar su experiencia de diseño: instale GemPages y sea testigo del impacto positivo de esta potente función.
Si actualmente tiene una cuenta de GemPages versión 6 y desea acceder a la sección de temas, no dude en ponerse en contacto con nuestro equipo de atención al cliente para obtener ayuda con el proceso de actualización. Es posible que se apliquen algunas condiciones al realizar la actualización.
Si no conoces GemPages, solo tienes que instalar la aplicación desde la tienda de aplicaciones de Shopify. Una vez instalada, estarás usando automáticamente GemPages v7.
Cómo usar GemPages para agregar colecciones a cualquier página
Paso 1: Arrastre y suelte el elemento Lista de productos en cualquier lugar donde desee mostrar su colección en una página.

Cómo utilizar el elemento Lista de productos
Cómo agregar productos a Shopify en 5 sencillos pasos
Consejos y trucos para crear páginas de colección de Shopify con alta tasa de conversión
Aplicar CTA impactantes
Un llamado a la acción es lo que pides (o dices) a tus clientes que hagan a continuación. Es una forma directa de aumentar el compromiso de un cliente con tu marca. Al provocar ciertas emociones, por ejemplo, miedo a perderse algo o entusiasmo, les das a tus compradores una razón para realizar la acción indicada en tu CTA.
El banner de juguetes navideños de Target con un descuento de hasta el 50 % invita a los compradores a su página de colección de juguetes.
Te aconsejamos que diversifiques los distintos tipos de CTA para cada página de colección. Además de los banners (como se ve en el ejemplo de Target anterior), también puedes utilizar ventanas emergentes y hacer que los clientes se enganchen con todos los atractivos programas de descuento que ofrece tu tienda online.

Un CTA impactante que aparece en tu página de colección puede impulsar a los clientes a comprar más.
Utilice encabezados atractivos
Los encabezados son ideales para cautivar y mostrar la descripción del producto de su marca. ¿Por qué? Son lo primero que ven los visitantes de su sitio web.

De Négoce utilizó GemPages para crear un encabezado de diapositiva visualmente atractivo con un CTA que enlaza a su página de colección de vinos.
Proporcionar un excelente diseño del producto.
Con el diseño de su producto, lo mejor es aprovechar todo el espacio disponible. Hay dos formas de hacerlo: una vista de cuadrícula o una vista de lista.
Por lo general, las vistas en cuadrícula son las mejores para una experiencia visual optimizada. Como puede ver, no es necesario proporcionar información específica, ya que los compradores se basan principalmente en imágenes completas para comparar los productos.

H&M ha hecho un gran trabajo atrayendo a los compradores a hacer clic en sus productos con una descripción general elegante y con estilo.

Newegg muestra la página de su colección de relojes inteligentes en la vista de lista con toda la información necesaria para que los compradores evalúen sus productos (precio, información del producto, disponibilidad, etc.).

Mantén lo mejor en la cima
Volvamos a la cuestión de crear una buena primera impresión. Para generar confianza y motivar a los clientes a comprar, intente presentar sus productos más vendidos en la parte superior de cada página de colección. Para mejorar aún más su estrategia, puede captar la atención de un comprador con distintivos como "Los más vendidos", "Novedades" o "20 % de descuento" y animar a los compradores a navegar por sus productos más vendidos.
Realice atractivas recomendaciones de productos en la parte superior de las páginas de su colección con insignias y calcomanías de productos.
Resalte los precios y atraiga a los clientes con activadores atractivos
Un precio razonable siempre es una ventaja. ¡Ofrezca productos a precios razonables con descuentos, ofertas relámpago, clasificaciones de listas y puntos de recompensa!
Las etiquetas de productos, los rangos de precios precisos y las calificaciones hacen que la página de colección de belleza de Sephora sea más atractiva para los clientes.
Optimizar la miniatura del producto

Zara presenta en miniaturas su nueva colección de esquí infantil con contenido orientado a los beneficios y fotografías profesionales.
- La regla de tres: asegúrate de que las miniaturas tengan todas el mismo tamaño, sean de alta calidad y respondan a dispositivos móviles.
- Agregue un efecto de desplazamiento para que los clientes puedan hacer zoom.
- Utilice imágenes de productos en 3D siempre que sea posible.
- Muestra el producto en uso, por ejemplo, en un vídeo.
Haga que la navegación sea muy sencilla
Estructura tu página de colección en función de las necesidades y expectativas de tus compradores. Una ruta de navegación clara e intuitiva permite a los compradores encontrar y obtener rápidamente el producto que les encanta. En otras palabras, la navegación debe generar ventas y satisfacción del cliente.
El viaje interminable del comprador para encontrar lo que busca ahora se realiza a través del sistema de filtros de Gap.
- Tamaño
- Color
- Precio
- Elevar
- Lavar
- Adaptar
- Longitud
- Material de la tela
- Longitud de la manga
Crear un acceso directo
Utilice botones para agregar al carrito en sus páginas de colección para que los clientes puedan realizar una compra sin salir de su página de colección. Esto simplifica el proceso de compra y reduce el tiempo que lleva realizar el pago. Tenga en cuenta que debe optimizar continuamente cada punto de contacto del cliente de comercio electrónico para lograr conversiones. La página de colección no es una excepción.
Ejemplos de páginas de colección de Shopify
Taylor y negro
Taylor & Black dio en el blanco con esta lujosa y elegante página de colección para trajes masculinos. Es un diseño estático y minimalista, con miniaturas de productos de gran tamaño. La usaron como página de colección independiente y como página de inicio.

Taylor & Black presenta múltiples colecciones en su página de inicio con estilo y el toque justo de estilo.

¡La página de colección de la marca es una boutique de trajes a medida que ofrece a los clientes todas las variaciones y opciones que necesitan para satisfacer sus necesidades de traje!
Big Bag Lecco es otra marca de moda que ha logrado acertar con su página de colección para su nicho.

Big Bag Lecco muestra cómo llevar sus bolsos con estilo.
Nación de perros
Dog Nation es solo uno de los proveedores de suministros para mascotas de GemPages. Nos han demostrado que las interacciones con los clientes desempeñan un papel fundamental en la construcción de la confianza y la lealtad de los clientes, especialmente cuando se trata de nuestros queridos amigos de cuatro patas.
Además de imágenes de productos claras y brillantes, la marca ofrece opciones de tamaño, color, tipo de cuello e incluso calificaciones y reseñas de los clientes para cada producto de su colección.
¡Dog Nation demuestra su espíritu alegre y cálido en todas sus colecciones de productos!

Esta es una manera perfecta de llamar a los amantes de las mascotas a la acción: ¡páginas de colección con calificaciones, reseñas y opciones/variaciones de productos!

¿Estás listo para agregar colecciones a tus páginas de Shopify?
¡Ahora es el momento de tomar acción y actualizar tus páginas de colección de comercio electrónico!
Preguntas frecuentes sobre las colecciones de Shopify
Once your customer has set their mind on a specific product category and navigated to it, a collection page shows up with all of that category’s related products. The buyer can then quickly scroll and sort through the results and choose the product(s) they’re interested in. They can then purchase them on the product description pages.
1. Apply killer CTAs
2. Use compelling headers
3. Provide an excellent product layout
4. Keep the best sellers on top
5. Highlight pricing and lure customers in with inviting triggers
6. Optimize product thumbnails
7. Make navigation in your collection pages easy
8. Create a shortcut so customers can check out
For more detailed information, please check out the Tips and tricks for creating effective collection pages.