Cómo personalizar la página de categorías de WooCommerce en WordPress sin codificar

cómo personalizar la página de categorías de wooCommerce

¿Está pensando en si debería editar la página de categoría de producto de WooCommerce en Elementor?

Bueno, si es así, te recomiendo encarecidamente que lo hagas. Personalizar la página de archivo de WooCommerce y optimizarla puede aumentar sus ventas.

Pero la pregunta es ¿cómo personalizar la página de categorías de productos de WooCommerce en WordPress?

Bueno, seguro que no tienes que codificar nada para personalizar la página de categorías de WooCommerce si sigues el proceso que se muestra en este blog.

En este artículo aprenderás cómo personalizar la página de categorías de WooCommerce sin ningún tipo de codificación. Además, también conocerás cómo puedes crear diferentes plantillas de archivo personalizadas para cada categoría individualmente. Y también formas de optimizar su página de archivo para aumentar la tasa de conversión.

Entonces, sigue leyendo….

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

De acuerdo a construidoCon, WooCommerce es utilizado por más del 29% por ciento del millón de sitios web principales. Si bien esta popularidad indica la credibilidad de WooCommerce como herramienta de comercio electrónico, también refleja que miles y miles de sitios web utilizan el mismo diseño predeterminado que WooCommerce tiene para ofrecer.

WooCommerce
Uso de WooCommerce entre el millón de sitios principales

Y si piensas usar el valor predeterminado WooCommerce página sólo minimizará las posibilidades de que su sitio web se destaque entre la multitud, entonces está equivocado. Hay otras razones que también debes considerar. Para conocer estas otras razones, echemos un vistazo a la página de categoría predeterminada de WooCommerce con el Tema de WordPress veinte veintidós activado.

Página de categoría predeterminada de WooCommerce
Página de categoría predeterminada de WooCommerce

Si ve, la página de categorías predeterminada de WooCommerce tiene un aspecto básico que no es muy atractivo. A pesar de no tiene opciones avanzadas como buscar productos usando nombres, filtrar productos según diferentes atributos, etc. Todo esto es importante para garantizar una buena experiencia de usuario en su tienda en línea.

Además, ¿a quién no le gusta un sitio atractivo, agradable a la vista y fácil de navegar? 

Bueno, ¡la respuesta es para todos! Y pasemos a la siguiente sección donde aprenderá cómo personalizar las plantillas de páginas de categorías de productos de WooCommerce sin ningún tipo de codificación.

Personaliza WooCommerce usando ShopEngine

Cómo personalizar la página de categorías de productos de WooCommerce en 6 pasos

Este es un tutorial fácil de seguir sobre cómo personalizar las páginas de categorías de WooCommerce en WordPress sin ningún tipo de codificación. Siguiendo este proceso, puede elegir el diseño y el diseño de su página de archivo de WooCommerce en poco tiempo. Entonces empecemos…

Paso #1: Instale el creador de páginas Elementor y ShopEngine

Para editar la página de categoría de producto de WooCommerce en Elementor mediante el proceso que se muestra en este blog, necesitará dos complementos de WordPress:

ShopEngine es el creador de WooCommerce definitivo para el creador de páginas de arrastrar y soltar: Elementor. Es un complemento para Elementor que viene con una enorme cantidad de widgets y módulos para facilitar la personalización de WooCommerce.

Nota: Puede usa el cupón comunidad20 para obtener 20% OFF en ShopEngine Pro. Instale Elementor primero, ya que ShopEngine depende de este creador de páginas. Si necesita ayuda para activar ShopEngine Pro, consulte la documentación.

Paso #2: cree una plantilla de página de categoría personalizada de WooCommerce

Una vez que haya instalado y activado todos los complementos necesarios, deberá crear una plantilla de categoría. Para crear una plantilla de página de categoría personalizada de WooCommerce,

  • Navegar a: ShopEngine ⇒ Plantilla de constructores
  • Haga clic en Agregar nuevo
  • Proporcionar un nombre de plantilla
  • Elija Tipo como archivo en el menú desplegable
  • Deje el campo Categoría aplicable como está es crear una plantilla común para todas las categorías
  • Active la opción Establecer predeterminado para anular cualquier plantilla de categoría/página de archivo existente
  • Seleccione la opción en blanco en Diseño de muestra 
  • Haga clic en Editar con Elementor para comenzar a construir la plantilla
crear una plantilla de página de categoría personalizada de WooCommerce
Cree una plantilla de página de categoría de WooCommerce en blanco

Nota: Elegí la opción en blanco porque en este blog voy a mostrar cómo cree una página de categoría personalizada desde cero. ShopEngine ofrece múltiples plantilla de página de categoría de WooCommerce prediseñada. Si quieres usar un plantilla prediseñada, elija la que le guste y luego vaya al paso 5. (Los pasos 3 y 4 son obligatorios si quieres construir desde cero)

Paso #3: elija un diseño/estructura para la página de categorías de WooCommerce

Una vez que esté en el modo editor, debe elegir una estructura para su página de categorías de WooCommerce.

Voy a utilizar 3 tipos diferentes de diseños para tres secciones diferentes para crear una página de archivo personalizada. Puedes hacer lo mismo que se muestra en el blog o elegir el diseño que más te guste.

Para elegir una estructura, haga clic en el icono “+”, luego coloca el cursor sobre el diseño que te guste y luego simplemente haz clic en él.

seleccione una estructura para la página de categoría personalizada cómo personalizar el tutorial de la página de categoría de producto de WooCommerce
Elige una estructura

Nota: Puedes repetir el mismo proceso para elegir diferentes diseños.

Relacionado: Cómo personalizar la página del producto WooCommerce

Paso #4: arrastre y suelte los widgets de ShopEngine y personalice la configuración

ShopEngine proporciona más de 8 widgets dedicados para crear páginas de archivo personalizadas de WooCommerce. Estos widgets de página de categorías son

  • Descripción del archivo
  • Archivar productos
  • Título del archivo
  • Archivo Recuento de resultados
  • Modo de vista de archivo
  • Ordenar por filtro
  • Filtro de productos por página
  • Lista de productos
  • Filtros de producto

Voy a utilizar algunos de estos. Puede optar por utilizarlos todos para editar la página de categoría de producto de Elementor WooCommerce. Pero antes de eso, debes asegurarte de que todos los widgets estén activados y disponibles para su uso. 

Puedes activar/habilitar los widgets desde ShopEngine ⇒ Widgets. Aquí enciende todos los widgets o los que vas a utilizar y finalmente haga clic en el botón "Guardar cambios" para actualizar el estado.

Habilite todos los widgets de la página de categorías de ShopEngine
Habilite todos los widgets de la página de categorías de ShopEngine

voy a elegir un diseño de una columna y Arrastre y suelte los widgets de búsqueda avanzada y recuento de resultados de archivo.

Arrastre y suelte el widget de búsqueda y recuento de resultados para la página de categorías de WooCommerce. Cómo personalizar la página de categorías de WooCommerce.
Arrastre y suelte los widgets de recuento de resultados de archivo y búsqueda avanzada

Puede seleccionar el widget y personalizar las configuraciones relacionadas. Por ejemplo, si hace clic en el widget Búsqueda avanzada, en el panel izquierdo, obtendrá opciones como Columna de productos, Mostrar categoría en el resultado de búsqueda, Mostrar menú desplegable de categorías, Texto para todas las categorías, ícono de búsqueda, etc.

Personalizar el widget de búsqueda avanzada de WooCommerce
Personalizar el widget de búsqueda avanzada de WooCommerce

Ahora, para la siguiente sección, seguiré los pasos descritos en el paso 3 para insertar un nuevo diseño de dos columnas. Luego arrastre y suelte los widgets Filtros de productos y Productos de archivo.

Inserte y suelte filtros de productos y widgets de productos de archivo. Personalice la página de archivo de WooCommerce.
Seleccione una nueva estructura de Elementor

Nota: El El widget de filtro de productos solo está disponible con ShopEngine Pro. Entonces, asegúrese de haber instalado y activado ShopEngine Pro.

Puede personalizar las opciones relacionadas con el filtro, como el filtro de precio, el filtro de calificación, el filtro de color, el filtro de categoría, etc. Además, puede personalizar las opciones relacionadas con el diseño, como el modo de visualización del filtro, habilitar el botón de alternancia de contenedor, columnas (por fila), etc. También puedes agregar una lista de atributos personalizados si lo deseas.

Personalizar el widget Proudct Filters cómo personalizar la página de categorías de WooCommerce
Personalizar el widget de filtros de productos

Puede cambiar la configuración de diseño de Archivar productos desde la opción de diseño de WooCommerce. Para obtener más detalles sobre cómo cambiar la opción de diseño, puede consultar esto doc. Además, puede personalizar la configuración de contenido, como Insignia de venta flash, Mostrar categorías, Mostrar calificación de descripción, etc. También puede elegir un ícono de paginación personalizado y un orden personalizado del botón CTA como Agregar al carrito, Agregar a la lista de deseos, Vista rápida, etc. .

Personalizar el widget de productos de archivo

Relacionado: Cómo personalizar la página Mi cuenta de WooCommerce

Paso #5: personalice la configuración de estilo de la página de archivo de WooCommerce

Una vez que esté configurado con sus diseños personalizados y widgets personalizados, es hora de cambiar su apariencia cambiando la configuración de estilo de estos widgets. Para cambiar la configuración de estilo, debe hacer clic en el widget y en el panel ir a la pestaña Estilo para acceder a todas las configuraciones de estilo. Echemos un vistazo a la opción de estilo para los widgets utilizados en este tutorial:

Búsqueda Avanzada:  Puede personalizar varias opciones del formulario de búsqueda, icono de búsqueda/estilo de texto, estilo de categoría, estilo de producto, botón Más productos y fuente global. 

Cambie la configuración de estilo del widget de búsqueda avanzada cómo personalizar la página de categorías de WooCommerce
Cambiar la configuración de estilo del widget de búsqueda avanzada

Recuento de resultados del archivo: Puede personalizar las opciones de alineación, color y tipografía.

widget de recuento de resultados de elementsKit
Cambiar la configuración de estilo del widget Archive Result Count

Filtros de productos: Puede encontrar opciones para diseñar la sección de filtros de productos en diferentes categorías, como Estilos comunes, Filtro de precio/control deslizante de rango, Filtro de calificación y Filtro de categoría.

Configuración de estilo de filtro de producto para editar la página de categoría de producto de WooCommerce en WordPress
Personalizar las opciones de estilo del widget de filtro de productos

Productos de archivo: Puede personalizar la configuración de estilo del producto de archivo personalizando las opciones proporcionadas en secciones como Contenedor de producto, Imagen del producto, Categorías de producto, Título del producto, Precio del producto, Fuera de etiqueta, Botón Agregar al carrito, Calificación, Venta flash y Paginación.

Archive la configuración de estilo del producto para editar la página de categorías de Elementor WooCommerce
Personaliza el estilo del widget de productos de archivo

Relacionado: Cómo personalizar la página del carrito de WooCommerce

Paso #6: actualice y obtenga una vista previa de la plantilla de página de categoría personalizada de WooCommerce

Después de finalizar la personalización del estilo, haga clic en el botón Actualizar para guardar. Ahora puede hacer clic en el botón de vista previa para ver la vista previa o visitar cualquier página de categoría manualmente y debería ver que la nueva plantilla está activada como se muestra en la vista previa a continuación:

Personalizar la vista previa de la página de categorías
Página de categoría personalizada de WooCommerce usando ShopEngine

Ahora, este fue el proceso de creación de una página de categorías personalizada para su tienda WooCommerce. Pero ¿qué tal crear un diseño diferente para cada categoría de tu tienda? Bueno, también puedes hacerlo con ShopEngine. Para conocer más detalles, pase a la siguiente sección.

Personaliza WooCommerce usando ShopEngine

¿Cómo crear una página de archivo WooCommerce personalizada para cada categoría por separado?

Puedes crear un diseño totalmente diferente para cada categoría o una categoría específica solo de tu tienda WooCommerce. Para eso, el proceso sigue siendo prácticamente el mismo que mostrado anteriormente. Pero en paso 2, Crear una plantilla de página de categoríatú No puede dejar el campo Categoría aplicable en blanco.

Necesitas seleccione la categoría en el campo Categoría aplicable para el cual desea aplicar la plantilla de diseño que está creando. Por ejemplo, si desea crear un diseño que solo debería ser aplicable a la categoría Música, en el campo Categoría aplicable elija Música. 

cree una página de archivo diferente para cada categoría de WooCommerce usando ShopEngine

El resto de los pasos serán los mismos que para crear un diseño de plantilla de categoría general que se muestra en la sección anterior.

Nota:  Cuando crea una plantilla de archivo para una categoría específica, solo se aplica a esa página de categoría y no al resto de las páginas de categorías.
Para el resto de categorías, debe crear una plantilla de categoría diferente con el campo "Categoría aplicable" en blanco para todas las categorías o una diferente para cada una de ellas. De lo contrario, el resto de las categorías tendrán la plantilla de archivo predeterminada de WooCommerce o la plantilla que ofrece su tema activado.

diferentes plantillas de páginas de archivo de WooCommerce usando ShopEngine, el creador definitivo de WooCommerce

Aquí hay una vista previa de diferentes páginas de categorías de WooCommerce con diferentes diseños creados con ShopEngine:

vista previa de diferentes páginas de categorías personalizadas de WooCommerce para cada categoría usando ShopEngine

Nota: La opción de crear diferentes plantillas/diseños para diferentes categorías de su sitio WooCommerce solo está disponible en la versión Pro de ShopEngine.

Bonificación: 5 formas de optimizar la página de categorías de WooCommerce para aumentar la tasa de conversión 

Aquí hay algunos consejos útiles que puede seguir para optimizar su página de archivo de WooCommerce para aumentar la tasa de conversión:

Proporcionar opción de filtro de producto

agregue filtros de productos para aumentar la conversión
Filtro de producto en la página de categorías de WooCommerce

Su página de categoría muestra de forma predeterminada todos los productos de esa categoría. Pero normalmente la gente busca un producto de un determinado color o tamaño o cualquier otro atributo.

Por lo tanto, debe proporcionar opciones para filtrar y limitar la cantidad de productos de una categoría según su atributo preferido. De esta manera, las personas pueden encontrar fácilmente sus productos y esto le ayudará a potencia tus ventas.

Verifique también Cómo agregar un conmutador de divisas al sitio web WooCommerce en 5 pasos

Agregar opción de comparación de productos

agregue una comparación de productos y aprenda cómo personalizar la página de categorías de WooCommerce en WordPress
Opción de comparación de productos en WooCommerce

Agregar un Comparación de productos La opción para su WooCommerce ayudará a los consumidores a comparar productos de tipo similar. Esta opción es necesaria especialmente si ofreces productos digitales como móviles, relojes, etc.

La opción de comparación de productos ayudará a los clientes a tomar una decisión más rápidamente. Y esto le ayudará a alcanzar rápidamente su objetivo de aumentar las ventas.

Botón de lista de deseos

personalizar la lista de deseos de la página de archivo de WooCommerce para personalizar la página de categorías de WooCommerce
Botón de lista de deseos en la página de categoría

Lista de deseos brinda la opción de agregar productos al carrito para su posterior compra. Algunas personas no consideran que Wishlist sea tan eficaz cuando se trata de conversión. Pero, sinceramente, es muy eficaz.

Porque las personas suelen agregar productos a su lista de deseos cuando realmente les gusta el producto pero por alguna razón no pueden comprarlo de inmediato. Pero eso no significa que esa persona no comprará los productos más adelante.

En la mayoría de los casos, las personas tienden a comprar productos que han agregado a su lista de deseos. Entonces, agregue una opción de lista de deseos en su página de Categoría de WooCommerce.

Opción de vista rápida

Agregue una vista rápida para aumentar la tasa de conversión de la página de categorías utilizando la plantilla de página de categorías personalizada de WooCommerce
Opción de vista rápida en la página de archivo de WooCommerce

Agregar un Vista rápida El botón garantiza una excelente experiencia de usuario, ya que las personas no tienen que visitar páginas separadas para conocer un producto. Con esta opción de Vista rápida, su cliente puede permanecer en la página de categorías y conocer detalles sobre los productos con solo un clic.

Si las personas tienen que ir a la página de un producto para verlo, pueden abandonar su sitio sin comprar el producto en caso de que no les guste. Sin embargo, si proporciona la opción de vista rápida para que los clientes puedan ver varios productos mientras permanecen en la misma página, mejorará la experiencia de compra. Y como resultado, te ayudará a incrementar las ventas de tu tienda.

Optimización SEO en la página

SEO en la página

Las páginas de categorías son el indicador de la jerarquía de páginas en su sitio web. Entonces, optimizando su página de categoría para los motores de búsqueda nunca debe descuidarse. Porque, si bien desea que su página de inicio y de producto se clasifiquen, su página de categorías, si se clasifica, también puede generarle mucho tráfico.

Cuanto más tráfico obtenga en su sitio web, mayores serán sus posibilidades de obtener más conversiones. Por lo tanto, asegúrese de agregar metadatos de SEO adecuados, optimizar los enlaces internos y externos, optimizar la URL, etc. Puede recibir ayuda de complementos de SEO como Matemáticas de rango, Yoast SEO etc.

¿Cree que todos los puntos parecen válidos, pero necesitaré varios complementos para agregar estas opciones a mi sitio y aumentar la conversión?

Bueno, no tienes nada de qué preocuparte. Porque ShopEngine, además de ser un fabuloso personalizador de WooCommerce con abundantes widgets de WooCommerce, también proporciona Más de 13 módulos como lista de deseos, pago rápido, comparación de productos, etc.

Además, puedes personalizar tu tienda WooCommerce completa con este complemento. usando este editor de categorías, puedes editar todas tus páginas de WooCommerce; desde el pagina de la tienda a gracias pagina. Mire el vídeo para conocer las amplias funciones que ShopEngine tiene para ofrecer.

ShopEngine: el creador de WooCommerce definitivo

Otros blogs relacionados con WooCommerce:

👉 Cómo agregar un campo de pago personalizado avanzado de WooCommerce
👉 Los mejores complementos de carrito de compras para WooCoomerce
👉 Cómo resolver el error de carrito vacío de WooCommerce
👉 Cómo agregar el pago en varios pasos de WooCommerce

Palabras finales en la página de categorías personalizadas de WooCommerce

Una página de categorías es una página esencial tanto para sus clientes como para los motores de búsqueda. Personalizar y optimizar las páginas de sus categorías solo puede ayudarlo a obtener más éxito en su negocio de comercio electrónico. 

Lo bueno es que ahora sabes cómo personalizar la página de categorías de WooCommerce en WordPress y cómo optimizar la página para duplicar tu tasa de conversión. Además de eso, ahora sabes cómo crear páginas de categorías personalizadas de WooCommerce para cada categoría por separado.

Puede aprovechar el creador de WooCommerce más completo disponible en el mercado llamado ShopEngine para optimizar la página de categorías de su tienda electrónica. ¡Y ahora puedes obtener su completo complemento WooCommerce en 20% OFF!

🔔 🔔 Para comprar ShopEngine Pro a 20% menos precio usa el código de cupón comunidad20.

Entonces, ¡apurémonos y unámonos a la comunidad de amantes de WooCommerce ahora!

Comentarios

Deja una respuesta

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *