Cómo Hacer Una Página

Hacer una Web Profesional con Wordpress

  • Mi Cuenta
  • Contacto
  • Curso GRATUITO de WordPress
  • Suscribirse (10€/mes)
Estás aquí: Inicio / Woocommerce / Cómo crear Filtros con Atributos en WooCommerce

Cómo crear Filtros con Atributos en WooCommerce

noviembre 9, 2022 Por Oscar martin Deja un comentario

En este tutorial te explicaré como crear filtros con atributos de WooCommerce pero antes te voy a explicar que son los atributos y su diferencia con las variaciones.

Reconozco que siempre que intento explicar la diferencia entre atributos y variaciones en WooCommerce lo paso mal 😅.

Creo que las variaciones y los atributos son dos de las opciones más complicadas de WooCommerce.

Aquí tienes la tabla de contenidos por si quieres ir directamente a crear los filtros:

Tabla de Contenidos

  • Diferencia entre Atributos y Variaciones
  • Diferencia entre Atributos y Categorías
  • Crear Filtros con Atributos en WooCommerce
    • Crear Atributos
    • Añadir los filtros a la tienda
  • Mejores plugins para crear Filtros Avanzados con WooCommerce

Diferencia entre Atributos y Variaciones

Atributos: Los atributos son características de los productos que puedes usar para:

  • Crear filtros en tu web por esas características
  • Crear variaciones de productos

Pero, ¿Qué son las variaciones de productos?

Gracias a las variaciones de productos podemos hacer que los atributos se conviertan en opciones distintas que el cliente puede elegir de un producto.

Las variaciones típicas son la talla y el tamaño de una prenda.

Por ejemplo, imaginemos que vendemos una camiseta que puede ser Roja, Amarilla y Azul y a su vez puede ser Pequeña, mediana o grande.

Podemos crear un atributo que sea Talla y otro atributo que sea color.

Si solo creamos los atributos podremos crear filtros con esas características, pero si queremos que un usuario pueda elegir entre las diferentes tallas y tamaños tenemos que convertir esos atributos en variaciones de productos.

Por cierto, un plugin muy útil para hacer más atractivas las variaciones en la ficha de producto es Variation Swatches for WooCommerce. Este plugin cambia el desplegable para elegir colores por botones de los colores que quieras.

Puedes aprender mucho más sobre las variaciones y como crear una tienda en nuestro curso de WooCommerce

Por lo que podemos crear atributos sin necesidad de crear variaciones si lo único que queremos es que el cliente pueda filtrar en nuestra tienda pero en cambio no queremos que se generen variaciones de producto.

Un caso de uso de crear atributos sin crear variaciones sería si queremos que los usuarios puedan filtrar por marca de producto, tipo de tejido o cualquier otra característica de nuestro producto.

Diferencia entre Atributos y Categorías

Puede que te estés preguntando, ¿y para que quiero crear atributos para crear filtros si lo puedo hacer con las categorías de productos?

Y entiendo tus dudas, yo mismo a veces las tengo 🙃

Imagina que tienes una tienda de productos de higiene y quieres categorizar tus productos por tipo de uso, entonces crearás categorías del tipo: Champús, Geles, Hidratantes, Exfoliantes etc

Pero es muy probable que sea muy útil para el usuario poder filtrar por tipo de ingredientes o de principios activos. Por lo que una buena idea sería crear atributos con sus componentes. Como por ejemplo Aloe Vera y otros componentes.

¿Podrías crearlo como categoría? Sí pero sería confuso crear categorías con distintos criterios.

Crear Filtros con Atributos en WooCommerce

En este tutorial aprenderemos a crear un filtro en nuestra web para que los clientes puedan filtrar por las características que queremos:

Captura de pantalla de una tienda en la que hemos añadido filtros por el atributo marca

Crear Atributos

Lo primero que tenemos que hacer es ir a Productos –> Atributos y crear el atributo que necesitamos:

Captura de pantalla en la opción Atributos dentro de Productos

Dentro de Atributos creamos nuestro atributo o filtro general que queremos crear:

Captura de pantalla dentro del atributo que estamos creando con el botón Añadir atributo resaltado

Una vez creado el atributo lo que tenemos que hacer es crear los términos dentro de ese atributo. Esto se hace desde dentro de la opción Configurar Términos:

Captura de pantalla de la opción Configurar términos de nuestro atributo

Los términos son cada una de las opciones que vamos a usar para nuestros filtros:

Captura de pantalla de cada término de nuestro atributo

Una vez hecho tenemos que ir a nuestros productos, editarlos y añadir el atributo y los términos o filtros que necesitemos.

Editamos nuestro producto y bajamos hasta la zona Datos del producto y seleccionamos Atributos:

Captura de pantalla creando un producto en WooCommerce con la sección Datos del producto resaltada

Ahora añadimos nuestro nuevo atributo:

Captura de pantalla añadiendo un atributo a un producto

Una vez añadido el atributo, elegimos el término que vamos a usar como filtro:

Captura de pantalla añadiendo el término por el que queremos crear un filtro

Importante: No marcaremos la opción Usado para variaciones si no queremos que se convierta en una opción por la que queremos que el cliente pueda elegir. (Esta opción solo aparece si estamos creando un producto variable)

No marcaremos la opción usado para variaciones

Añadir los filtros a la tienda

Ahora que ya tenemos creados los filtros tenemos que añadirlos a nuestra tienda.

Esto lo haremos gracias a los Widgets.

Captura de pantalla del backend de WordPress con la opción Widgets remarcada

Nos vamos a los widgets y añadirmos el Widget Filtrar por atributo:

Captura de pantalla añadiendo el widget Filtrar por atributo

Y elegimos el término por el que queremos filtrar:

Captura de pantalla del widget filtrar por atributo con el término Tamaño seleccionado

Si todo ha ido bien, ahora puedes ir a tu tienda y verás los filtros plenamente funcionales:

captura de pantalla de la tienda con el resultado final de crear filtros con atributos en WooCommerce

Si has llegado hasta aquí ya tienes filtros con los atributos de tus productos. Todo ello sin añadir plugins adicionales.

También podemos añadir un widget para ver que filtros tenemos activados

Mejores plugins para crear Filtros Avanzados con WooCommerce

Si necesitas funcionalidades más avanzadas existen extensiones o plugins que mejoran la funcionalidad de filtros avanzados.

Aquí tienes algunos de ellos.

  • Yith WooCommerce Ajax Search
  • Advanced AJAX Product Filters
  • WOOF – Product Filter para WooCommerce

Espero que este tutorial te haya sido útil

Publicado en: Woocommerce

Acerca de Oscar martin

Me llamo Óscar y me dedico al Marketing Online. Me gano la vida gracias a internet y a herramientas como Wordpress. ¿Te puedo ayudar? Contáctame

Deja una respuesta Cancelar la respuesta

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

Carrito

Categorías

Contenido Premium

¿Quieres Aprender WordPress y Ganar dinero? Cópiame

¿Necesitas Ayuda?

  • Contacto
  • Blog

Más Información

  • Condiciones de Uso
  • Condiciones generales de venta
  • Aviso Legal
  • Pólitica de Privacidad
  • Política de cookies

Buscador

Funciono con el Theme Genesis · Acceder

Este sitio web instalará en tu navegador cookies analíticas y publicitarias propias y de terceros si continúas navegando.
Encontrará más información en nuestra Política de Cookies...Configuración de CookiesAceptar
Privacy & Cookies Policy

Privacy Overview

This website uses cookies to improve your experience while you navigate through the website. Out of these, the cookies that are categorized as necessary are stored on your browser as they are essential for the working of basic functionalities of the website. We also use third-party cookies that help us analyze and understand how you use this website. These cookies will be stored in your browser only with your consent. You also have the option to opt-out of these cookies. But opting out of some of these cookies may affect your browsing experience.
Necessary
Siempre activado
Las cookies estrictamente necesarias tiene que activarse siempre para que podamos guardar tus preferencias de ajustes de cookies.
Básicamente el blog no funcionará bien si no están activas.
Estas cookies son:
- Comprobación de inicio de sesión.
- Cookies de seguridad imprescindibles.
- Saber si ya has aprobado/rechazado las cookies.
Non-necessary
Esta web utiliza las siguientes cookies adicionales:
- Mautic: Recordar si ya estás suscrito al boletín de noticias.
- Google Analytics: un servicio de analítica web desarrollada por Google, que permite la medición y análisis de la navegación en las páginas web.
GUARDAR Y ACEPTAR