Cómo personalizar páginas de categorías de productos en WooCommerce

Publicado: 2022-03-21

¿Quiere saber cómo personalizar las páginas de categorías de productos en WooCommerce?

Las páginas de categoría son esenciales para cualquier tienda de WooCommerce porque ayudan a los clientes potenciales a buscar productos antes de comprarlos. Sin embargo, si sus páginas de categorías de productos son inexactas, pueden hacer que los compradores abandonen su sitio, perdiendo clientes potenciales e ingresos.

Este artículo le mostrará cómo personalizar y mostrar las páginas de categorías de productos de WooCommerce para mejorar la experiencia del usuario y las ventas.

¿Por qué personalizar las páginas de categorías de productos de WooCommerce?

Hay varias razones para personalizar las páginas de categorías de WooCommerce:

  • Impulse las ventas: alrededor del 70 % de las ventas provienen de páginas de categorías, lo que significa que contribuyen directamente al éxito de su negocio. La creación de páginas de categorías personalizadas adaptadas a las necesidades de los compradores puede generar altas tasas de conversión.
  • Mejore el SEO: la optimización de las páginas de categorías puede ayudarlo a mejorar su clasificación en los resultados de búsqueda. Dado que muchas tiendas en línea tienen un contenido mínimo en las páginas de categorías, es una oportunidad ideal para optimizar las categorías y subcategorías de productos para las palabras clave que busca su audiencia.
  • Capte la atención: los motores de búsqueda a menudo llevan a los usuarios a las páginas de categorías de productos más que a las páginas de compras porque se enfocan en resultados específicos. Puede personalizar esas páginas con contenido generado por el usuario, mejores imágenes de productos y reseñas para llamar la atención y convencer a los compradores de que visiten.

Al final, personalizar las páginas de categorías de productos en WooCommerce puede ayudarlo a atender mejor a los compradores, mejorar la clasificación en los motores de búsqueda y aumentar sus ventas.

Antes de mostrarle cómo personalizar sus páginas de categoría, veamos cómo agregarlas a su tienda WooCommerce.

Cómo agregar categorías de productos en WooCommerce

Agregar páginas de categorías de productos en WooCommerce es bastante sencillo. Vaya a Productos » Categorías desde su panel de WordPress y verá varios campos de entrada.

How to add product categories in woocommerce

Puede agregar tantas categorías como desee, pero recuerde ingresar la siguiente información para que sea más fácil mostrar los datos de la categoría en las páginas de productos:

  • Nombre
  • Babosa de categoría
  • Categoría principal
  • Descripción
  • Tipo de visualización
  • Miniatura

Después de agregar categorías a su tienda en línea, está listo para crear y personalizar sus páginas de categorías.

Primero, le mostraremos cómo crear una página de categoría de producto personalizada en WooCommerce usando SeedProd. Luego, compartiremos varias formas de mostrar categorías de productos en WooCommerce.

Tabla de contenido
  1. Cómo agregar categorías de productos en WooCommerce
  2. Cómo personalizar la página de categoría de producto en WooCommerce
  3. Cómo mostrar la categoría del producto en WooCommerce

Cómo personalizar la página de categoría de producto en WooCommerce

Aunque WooCommerce incluye muchas formas de mostrar categorías de productos, no es fácil personalizarlas sin herramientas de terceros y complementos de WordPress. Lo que es más, muchas de esas herramientas son difíciles de usar y agregan una sobrecarga a su sitio que puede ralentizarlo.

Es por eso que siempre sugerimos usar SeedProd para personalizar su tienda WooCommerce.

SeedProd WordPress website builder

SeedProd es el mejor creador de sitios web para WordPress. Con más de 1 millón de instalaciones activas, es la forma más fácil de crear temas, diseños y páginas de destino personalizados de WordPress sin código.

También es rápido, liviano y totalmente compatible con WooCommerce, lo que le permite crear tiendas en línea completas con su sencillo generador de arrastrar y soltar.

Siga los pasos a continuación para crear páginas de categorías personalizadas con SeedProd.

Paso 1. Instalar y activar el Creador de sitios web de SeedProd

El primer paso es descargar el creador de sitios web de SeedProd.

Comience con SeedProd hoy

Nota: Hay una versión gratuita de SeedProd disponible, pero usaremos SeedProd Pro para las funciones de WooCommerce.

A continuación, instale y active el archivo .zip del complemento en su sitio web de WordPress. Si necesita ayuda con este paso, puede seguir estas instrucciones para instalar un complemento de WordPress.

Después de instalar y activar SeedProd, vaya a SeedProd » Configuración y pegue su clave de licencia.

enter your license key

Puede encontrar su clave de licencia iniciando sesión en el sitio web de SeedProd y copiándola desde la pestaña Descargas.

copy your seedprod license key

Haga clic en el botón Verificar clave ; entonces estará listo para configurar sus páginas de categorías personalizadas de WooCommerce.

Paso 2. Crea un tema de WooCommerce

SeedProd le permite crear páginas personalizadas de WooCommerce de 2 maneras:

  • Generador de temas : el Generador de temas anula su tema actual y le permite personalizar cada parte de su sitio web con su editor visual.
  • Generador de páginas de destino: el Generador de páginas de destino le permite mantener su tema actual y crear páginas de destino individuales que puede personalizar con el editor de arrastrar y soltar.

Usaremos la opción Theme Builder para hacer todas las páginas automáticamente para una tienda WooCommerce.

Para configurar su tema de WooCommerce, vaya a SeedProd » Theme Builder .

Normalmente, verá una lista de las plantillas que componen su tema en esta página. Por ahora, solo verá la plantilla CSS global.

SeedProd theme builder

Lo bueno de SeedProd es que viene con más de 150 páginas de destino y plantillas de temas adaptables a dispositivos móviles. De esa manera, no necesitará comenzar desde cero con el diseño de su sitio web WooCommerce.

Haga clic en el botón Temas para ver una lista de las plantillas de temas de WordPress actuales de SeedProd. Regularmente se agregan más plantillas a esta lista, muchas de las cuales están diseñadas para tiendas en línea.

wordpres theme templates seedprod

Por ejemplo, el tema Tienda de bicicletas se adaptaría a las tiendas que venden bicicletas y accesorios para bicicletas.

Para elegir un tema, pase el cursor sobre él y haga clic en el icono de marca de verificación.

Choose a premade woocommerce theme

Después de importar su tema, SeedProd creará todas las partes de la demostración del tema. En nuestro caso, incluye las siguientes plantillas de temas:

  • Archivos de productos: un archivo completo de todos los productos.
  • Página del producto: un espacio para mostrar detalles sobre productos individuales.
  • Página de la tienda: una página de escaparate personalizable.
  • Página única: una página individual para el contenido, como su información acerca de o de contacto.
  • Blog Index, Archives, Search: una página para mostrar las publicaciones de su blog, los resultados de búsqueda y los archivos de publicaciones.
  • Página de inicio: la página principal de su sitio web.
  • Barra lateral: un área preparada para widgets que puede personalizar.
  • Pie de página: un lugar para enlaces personalizados, contenido e información de derechos de autor.
  • Encabezado: un espacio para su logotipo y menús de navegación.
seedprod theme parts

Nota: A menudo nos referimos a partes individuales de un tema como "plantillas".

Al hacer clic en cada plantilla de tema, se abrirá en el editor de arrastrar y soltar de SeedProd, donde puede personalizar el contenido y el diseño.

Una plantilla de tema fundamental para este tutorial es el Archivo de productos. Cuando los usuarios hacen clic en una categoría de su tienda, verán el Archivo de productos para esa categoría de productos.

Es esa plantilla la que necesitará abrir para personalizar sus páginas de categorías de productos de WooCommerce. Pase el mouse sobre la plantilla y haga clic en el enlace Editar diseño para abrirlo en el editor visual.

edit woocommerce product archives template

Paso 3. Personalice su plantilla de página de categoría de producto

Cuando abra las plantillas de archivos de productos, verá un diseño de 2 columnas. A la izquierda hay bloques y secciones que puede agregar a su página. Luego hay una vista previa en vivo de su diseño a la derecha.

SeedProd product archives template

Ya debería haber 2 bloques en su página:

  1. Título del archivo
  2. Archivo de productos

El título del archivo es uno de los bloques de etiquetas de plantilla de SeedProd. Extrae automáticamente el título del archivo de su base de datos de WordPress.

SeedProd archive title block

Por ejemplo, si hace clic en la categoría "bicicleta negra" en su tienda, la página que verá tendrá el encabezado: "Categoría: Bicicletas negras". El encabezado cambiará automáticamente según la categoría en la que haga clic.

Del mismo modo, el bloque Archive Products es una de las etiquetas de plantilla de WooCommerce de SeedProd. Este bloque mostrará una cuadrícula de productos en esa categoría específica.

SeedProd archive products block

Para usar nuestro ejemplo anterior, si hace clic en la categoría "bicicleta negra", verá una cuadrícula de productos que solo muestra bicicletas negras.

Personalizar ambos bloques es fácil. Simplemente haga clic en cualquiera de los bloques y ajuste el estilo en el panel de configuración de la izquierda.

Por ejemplo, puede cambiar el tamaño, la alineación y el nivel del título del archivo. Luego, en la pestaña Avanzado, puede ajustar las fuentes, el color, el espaciado, las sombras y más.

Archive title advanced settings

En el panel de configuración de Archive Products, puede cambiar las columnas, la paginación, la consulta, el recuento de elementos y más. También puede cambiar el estilo en la pestaña Avanzado.

Además, es muy fácil cambiar el diseño completo de la página de categoría de su producto con cualquiera de los bloques y secciones de SeedProd.

Por ejemplo, puede arrastrar sobre el bloque de imagen y agregar una imagen de banner llamativa. Luego, puede vincularlo a una venta o promoción que esté ejecutando actualmente.

SeedProd image block

También puede agregar testimonios de clientes anteriores para convencer a los compradores de que sus productos son la mejor opción.

En este ejemplo, arrastramos el título del archivo y los bloques de productos a una sección ancha y estrecha de 2 columnas. Luego usamos el bloque Testimonios en la columna más pequeña.

Seedprod testimonials on custom product category page woocommerce

Las posibilidades son prácticamente infinitas.

Cuando esté satisfecho con la página de su categoría, recuerde hacer clic en el botón Guardar en la esquina superior derecha. Luego puede continuar y personalizar el resto de su tema de WooCommerce de la misma manera.

Paso 4. Publica tu tema de WooCommerce

Cuando esté listo para dar vida a su nuevo diseño, diríjase a la página SeedProd » Theme Builder . Luego, en la esquina superior derecha, haga clic en Habilitar tema de SeedProd hasta que esté en la posición "encendido".

Enable seedprod theme

Ahora puede obtener una vista previa de cualquier página de categoría de producto para ver sus personalizaciones.

how to customize product category page in woocommerce

Cómo mostrar la categoría del producto en WooCommerce

Ahora que sabe cómo personalizar las páginas de categorías de productos en WooCommerce, aquí le mostramos cómo mostrarlas en la página de su tienda.

Mostrar categorías de productos en la página de la tienda con SeedProd

Si desea mostrar categorías de productos en su página de la tienda de WooCommerce con SeedProd, vaya a SeedProd » Theme Builder y abra la plantilla de la página de la tienda.

Edit seedprod shop page template

Desde allí, abra la configuración del bloque Product Grid y cambie el Tipo de consulta a Consulta personalizada. Debajo del encabezado Atributo de consulta, haga clic en "Seleccionar por categoría". Luego, en el cuadro de categoría, haga clic en las categorías que desea mostrar en la página.

Display woocommerce product categories on the shop page

Nota: Puede seleccionar varias categorías manteniendo presionado el comando en Mac o Ctrl en Windows.

Haga clic en Guardar para almacenar sus cambios.

Mostrar categorías de productos en la página de la tienda con WooCommerce

Para mostrar categorías de productos en la página de su tienda con la configuración predeterminada de WooCommerce, vaya a Apariencia » Personalizar » WooCommerce » Catálogo de productos.

Luego, bajo el encabezado "Visualización de la página de la tienda", elija la opción "Mostrar categorías".

Show categories on the shop page with product catalog

¡Eso es todo!

Esperamos que este artículo le haya ayudado a aprender cómo personalizar las páginas de categorías de productos en WooCommerce.

También te puede interesar esta guía sobre cómo acelerar tu tienda WooCommerce.

Gracias por leer. Síganos en YouTube, Twitter y Facebook para obtener más contenido útil para hacer crecer su negocio.