Páginas de categoría que convierten: buenas prácticas de diseño, filtros y ordenación

La mayoría de los comerciantes de PrestaShop concentran sus esfuerzos en las páginas de producto y tratan las páginas de categoría como algo predeterminado que nunca tocan. Es justo al revés. Para muchísimas tiendas, la página de categoría es la primera página a la que llega un visitante: Google posiciona las URL de categoría para términos comerciales amplios ("zapatillas de running", "mangueras de jardín", "sillas de oficina"), y quien aterriza ahí está comparando, todavía no se ha decidido. La página de producto cierra la venta con el cliente al que ya has convencido; la página de categoría decide si ese cliente llegará siquiera a una página de producto. Esta guía trata del trabajo fino dentro de esa parrilla: el diseño, la ficha de producto, el orden de clasificación, cuántos productos mostrar y cómo avanzan los clientes por el listado, todo dentro del back office real de PrestaShop y su estructura de plantillas, no desde teoría genérica de comercio electrónico.

Dos grandes temas que viven en la página de categoría tienen ya sus propias guías en profundidad, y este artículo los remite allí deliberadamente en lugar de tratarlos a medias: el filtrado por facetas (la propia barra lateral de filtros) se cubre en ayudar a los clientes a encontrar productos en catálogos grandes, y el encabezado superior de la página es una palanca de conversión propia en por qué el H1 de tu categoría no debería ser el nombre de la categoría. El árbol de categorías detrás de las URL — profundidad, nombres, SEO — está en estructura de categorías de PrestaShop. Aquí nos centramos en el diseño y la mecánica del listado.

Última revisión en junio de 2026 — rutas de configuración verificadas en PrestaShop 1.7 a 9 (temas Classic y Hummingbird).

Qué es realmente una página de categoría en PrestaShop

Antes de cambiar nada, conviene saber qué estás editando. Una página de categoría en PrestaShop 1.7 a 9 la renderiza CategoryController, que amplía la lógica de listados de ProductListingFrontController. La parrilla visible procede del category.tpl de tu tema, que incluye product-list.tpl y renderiza cada elemento mediante la plantilla de "miniatura" de producto catalog/_partials/miniatures/product.tpl. Tres piezas de estado viajan en la URL y el controlador las lee en cada solicitud:

• ?order= — la ordenación, por ejemplo ?order=product.price.asc o ?order=product.name.desc.
• ?page= — la paginación, por ejemplo ?page=2.
• Los filtros por facetas — gestionados por el módulo ps_facetedsearch, que añade el estado de los filtros a la URL, normalmente mediante parámetros de consulta.

Esto importa porque casi todas las "buenas prácticas" que verás abajo son un ajuste que cambias en el back office o un pequeño retoque de plantilla, no una reconstrucción. ¿Qué significa eso para ti? Que puedes corregir la mayor parte de lo que hace perder ventas en las páginas de categoría sin una factura de desarrollo, y que los cambios resisten mejor las actualizaciones del tema porque trabajas con el propio sistema de listados de PrestaShop, no contra él.

Diseño: parrilla, lista y el número de columnas que de verdad encaja con tus productos

El tema Classic de PrestaShop (desde 1.7) trae únicamente diseño en parrilla: el antiguo conmutador parrilla/lista de 1.6 desapareció, así que una vista de lista real ahora depende de un tema que la incluya o de un módulo específico, no de un interruptor de URL integrado. La parrilla funciona para la gran mayoría de catálogos porque permite al comprador escanear muchos productos de un vistazo. Pero la elección no es estética: depende de qué vende el producto:

• Parrilla, 3–4 columnas: cuando la imagen es la que vende: moda, joyería, decoración, alimentación. La foto es el gancho, así que dale espacio y mantén debajo un texto de ficha mínimo.
• Vista de lista: cuando vende la ficha técnica: electrónica, recambios, suministros industriales, B2B. Una fila de lista deja espacio para la descripción breve, los atributos clave y el stock, de modo que el comprador puede comparar sin abrir cada producto.
• Ajusta la vista al catálogo: en el tema Classic eso significa apostar por la parrilla y afinar la ficha para ella; si tus productos realmente necesitan una vista de lista, es una decisión de tema o módulo que merece tomarse de forma deliberada. El error es una vista que va contra tu catálogo: una tienda de componentes de servidor mostrando mosaicos de imagen sin especificaciones, o una tienda de moda comprimida en filas densas, entierran por igual la información decisiva.

En cuanto al número de columnas, la realidad práctica en PrestaShop es que lo gobierna la parrilla CSS de tu tema (clases de columna de Bootstrap en product-list.tpl), no un desplegable del back office. Por tanto, "mostrar 4 columnas en lugar de 3" es un pequeño cambio de tema/CSS, idealmente en tu tema hijo para que una actualización no lo sobrescriba. Evita superar las cuatro columnas en escritorio: a partir de ahí, las imágenes se encogen hasta dejar de vender.

La ficha de producto: cada elemento se gana su sitio o se elimina

El bloque individual (la "miniatura") es donde la página de categoría persuade, y PrestaShop lo renderiza desde catalog/_partials/miniatures/product.tpl. Una ficha que convierte muestra un conjunto breve y deliberado de elementos, y nada que añada ruido:

La disciplina aquí es restar. Las etiquetas de "nuevo", "oferta", "envío gratis", los distintivos, las cuentas atrás y las etiquetas parecen útiles por separado; apiladas en una misma ficha convierten la parrilla en ruido visual y ralentizan la página. Elige una o dos que encajen con tu argumento de venta más fuerte y elimina el resto.

Ordenación: elige un valor predeterminado inteligente y ofrece pocas opciones

La ordenación predeterminada es uno de los ajustes con más impacto de toda la página, porque la mayoría de los compradores nunca la cambia: el orden que publiques será el orden con el que te juzguen. PrestaShop define el valor predeterminado de todo el catálogo en Parámetros de la tienda → Configuración de productos ("Ordenar por defecto" / "Método de ordenación por defecto"), y el desplegable de ordenación del front office escribe la elección en el parámetro ?order=. Estas son tus opciones y cuándo conviene usar cada una como predeterminada:

[captura de pantalla: el panel de Configuración de productos donde "Ordenar por defecto", "Método de ordenación por defecto" y "Productos por página" aparecen en la misma pantalla]

• Relevancia / posición (tu orden curado): el valor predeterminado adecuado para la mayoría de categorías: te permite colocar arriba los productos más vendidos y los de mayor margen, configurándolo por categoría al arrastrar productos en Catálogo → Categorías. La ordenación elegida sigue aplicándose después de seleccionar filtros.
• Precio: de menor a mayor: la ordenación manual más utilizada después de la predeterminada; los compradores sensibles al precio recurren a ella primero, así que asegúrate de ofrecerla.
• Precio: de mayor a menor: útil en categorías premium donde los clientes esperan que la calidad cueste más.
• Novedades primero (por fecha de alta): adecuada como predeterminada en categorías de rotación rápida: lanzamientos de moda, tecnología nueva.
• Más vendidos / ventas: prueba social hecha visible; funciona muy bien en categorías donde "popular" es una señal real.

Limita el desplegable a unas cuatro o seis opciones. Cada opción adicional de ordenación es una decisión que pides al comprador en lugar de dejarle comprar, y las marginales ("nombre Z–A") casi nunca se usan. Un valor predeterminado equivocado, en cambio, puede costarte ventas en silencio: ordenar por defecto por "precio de menor a mayor" coloca primero tus artículos más baratos y de menor margen, y entrena a los visitantes a ver tu tienda como un cajón de gangas.

Productos por página y cómo avanzan los compradores por el resto

Cuántos productos muestras antes de un corte, y cómo llega el comprador al siguiente lote, se configura en Parámetros de la tienda → Configuración de productos como "Productos por página" (el valor PS_PRODUCTS_PER_PAGE); algunos temas o módulos también pueden mostrar un selector por página en el front office, pero el control nativo es este ajuste de productos por página del back office. Hay tres formas de gestionar "más productos de los que caben":

En PrestaShop en concreto, la paginación es la opción segura precisamente porque produce URL reales e indexables (/category?page=2) que funcionan bien con la caché de página completa y permiten a Google llegar al inventario más profundo. Si quieres una experiencia más fluida, un botón "cargar más" es mejor compromiso que el scroll infinito: mantiene el pie de página accesible y la posición puede guardarse. En cuanto a productos por página, entre 24 y 48 funciona para la mayoría de catálogos; cifras muy altas (96+) hinchan el peso de la página y empeoran el tiempo de carga, algo que en una página de categoría afecta directamente a la tasa de rebote.

El texto introductorio: un párrafo breve, no un muro, y no un filtro

Una página de categoría debería incluir un bloque de texto único, pero es fácil pasarse. El patrón que respeta tanto a compradores como a buscadores: una introducción breve (dos o tres frases) arriba, por encima de la parrilla, y, si quieres más profundidad SEO, una descripción más larga debajo de los productos, donde no empuje la parrilla por debajo del primer pliegue. PrestaShop te da exactamente dos campos para esto en Catálogo → Categorías → [editar]: el campo principal Descripción y, en las versiones actuales (8.1+), un campo separado de Descripción adicional, cuyo propio texto de ayuda indica que "normalmente se muestra después de la lista de productos en la página de categoría"; úsalos para la parte superior e inferior respectivamente. Mantén la introducción superior en torno a 100–200 palabras entre ambos, escrita primero para una persona.

[captura de pantalla: la pantalla de edición de categoría con los campos Descripción principal y Descripción adicional visibles, para que la división entre parte superior e inferior quede clara]

Un límite firme: el bloque de texto no es el lugar para sustituir la navegación. Si los compradores no pueden acotar una categoría grande, la solución es la barra lateral de filtros, no un párrafo lleno de enlaces; consulta la guía de filtros por facetas. Y el encabezado situado encima de esa introducción merece su propia reflexión; una categoría llamada "Zapatos" puede tener un H1 que realmente venda, como se explica en H1 de categoría personalizado.

Cuando el catálogo es grande: filtros y búsqueda hacen el trabajo pesado

El diseño y la ordenación sostienen una categoría de unas pocas decenas de productos. A partir de ahí, el factor decisivo es si el comprador puede acotar, y ese tema es lo bastante amplio como para tratarlo aparte en lugar de encajarlo aquí a presión. Dos guías hermanas se ocupan de ello:

• Filtrado por facetas (talla, color, marca, control deslizante de precio, en stock, "mostrando 12 de 156", filtros activos eliminables) es la función que decide el éxito o el fracaso de las categorías grandes, impulsada por ps_facetedsearch; la estrategia completa, incluida la adaptación de filtros por categoría, está en Filter Revolution.
• Búsqueda para el comprador que prefiere escribir antes que navegar: cuando la búsqueda predeterminada de PrestaShop devuelve resultados flojos, la solución está en búsqueda inteligente para PrestaShop.

La página de categoría en móvil es otra página

Más de la mitad del tráfico de las páginas de categoría ya es móvil, y la parrilla de escritorio no basta con encogerla. La versión para móvil necesita decisiones propias: filtros plegados tras un botón "Filtrar" que abra un panel a pantalla completa (nunca en línea, donde se comerían la pantalla), una parrilla de dos columnas (una desperdicia espacio, tres reduce demasiado los productos), una barra fija de filtros/ordenación que siga accesible al desplazarse, y una vista rápida que muestre lo esencial sin cargar una página completa. Es una disciplina con entidad suficiente para tener su propia guía — consulta comercio móvil —, pero el titular para las páginas de categoría es este: diseña el layout móvil de forma deliberada, no lo heredes.

Prueba la página de categoría, porque los números se acumulan

Las páginas de categoría combinan mucho tráfico con impacto directo en ingresos, lo que las convierte en el mejor lugar de la tienda para hacer pruebas: una pequeña mejora aquí se multiplica en todos los productos que cuelgan de ella. Experimentos que merecen la pena, todos modificables desde los ajustes anteriores:

• Productos por página: 24 frente a 48, observando tanto la conversión como el tiempo de carga.
• Ordenación predeterminada: tu "posición" curada frente a "más vendidos".
• Contenido de la ficha: con o sin estrellas de valoración; "Añadir al carrito" frente a "Vista rápida".
• Ubicación del texto introductorio: arriba frente a abajo, y si la parrilla visible en el primer pliegue pesa más que las palabras.

Mide con volumen suficiente para confiar en el resultado: al menos unas semanas y unos cientos de sesiones por variante, no tres días de ruido, y analiza el clic desde categoría a producto y la conversión final, no solo los clics. La matemática es el motivo para hacerlo: subir la conversión aunque sea un par de puntos en una página de categoría que recibe diez mil visitantes al mes supone cientos de compradores adicionales, y esa mejora se apoya sobre todos los productos de la categoría.

Preguntas frecuentes

¿Dónde configuro el orden predeterminado de las páginas de categoría en PrestaShop?

En Parámetros de la tienda → Configuración de productos, mediante "Ordenar por defecto" y "Método de ordenación por defecto". Esto define el valor predeterminado de todo el catálogo, que la mayoría de los compradores nunca cambia. Para curar el orden dentro de una categoría concreta, arrastra los productos en Catálogo → Categorías y usa "posición" / relevancia como ordenación.

¿Cuántos productos debería mostrar por página de categoría?

Entre 24 y 48 funciona para la mayoría de catálogos. Se configura en Parámetros de la tienda → Configuración de productos como "Productos por página". Los recuentos muy altos (96+) hinchan el peso de la página y ralentizan la carga, lo que aumenta directamente la tasa de rebote en una página de categoría; por eso conviene preferir la paginación antes que mostrar cientos de productos de una vez.

¿Puedo añadir una vista de lista al tema Classic de PrestaShop?

No mediante un conmutador de URL integrado. El tema Classic (desde 1.7) eliminó el antiguo interruptor parrilla/lista de 1.6 y solo trae parrilla. Una vista de lista auténtica ahora depende de un tema que la incluya o de un módulo específico; por tanto, es una decisión deliberada de tema, que solo merece la pena cuando vende la ficha técnica del producto (electrónica, recambios, B2B) y no la imagen.

¿Debería usar paginación o scroll infinito en las páginas de categoría?

La paginación es la opción segura por defecto en PrestaShop porque produce URL ?page= reales e indexables, funciona con caché de página completa y permite a Google llegar al inventario más profundo. Si quieres una experiencia más fluida, un botón "Cargar más" es mejor compromiso que el scroll infinito, que vuelve inaccesible el pie de página y no ofrece una posición que guardar.

¿Qué plantilla renderiza una página de categoría de PrestaShop?

La controla CategoryController (que extiende ProductListingFrontController); la parrilla procede del category.tpl de tu tema, que incluye product-list.tpl, y cada bloque se renderiza mediante catalog/_partials/miniatures/product.tpl. La mayoría de ajustes son una configuración de back office o un retoque ligero en tu tema hijo, no una reconstrucción del controlador.

Dónde encaja esto en tu tienda

La página de categoría es el puente entre cómo llegan los clientes — tu navegación con mega menú y la página de inicio — y la página de producto que cierra la venta. Afina la parrilla, la ficha, la ordenación predeterminada y la paginación, deja el filtrado pesado y la búsqueda en manos de ps_facetedsearch y de un módulo de búsqueda adecuado, y diseña la vista móvil a propósito. Nada de esto exige bifurcar tu tema; casi todo vive en Parámetros de la tienda → Configuración de productos, Catálogo → Categorías y un retoque ligero en tu tema hijo. El principio bajo cada ajuste es el mismo: un visitante en una página de categoría ha mostrado intención, pero todavía no ha elegido; tu único trabajo es hacer que elegir sea fácil y luego apartarte.

Sigue leyendo

• Filter Revolution: ayudar a los clientes a encontrar productos en catálogos grandes — la barra lateral por facetas que sostiene las categorías cuando superan unas pocas decenas de productos.
• Estructura de categorías de PrestaShop: navegación optimizada para SEO — el árbol detrás de estas URL: profundidad, nombres y slugs.
• Mega menú de PrestaShop: crear una navegación que convierte — cómo llegan los compradores a la categoría correcta desde el principio.