Si utiliza Temas WoodMarty planea hacer un sitio web de comercio electrónico, entonces no se puede perder el hecho de que viene con un AJAX Filtros de productos Función. Este filtro permite a los clientes filtrar rápidamente los productos por marca, precio, color, categoría y otras dimensiones sin actualizar la página, lo que mejora la eficacia de la navegación y reduce las tasas de rebote.
![Image[1]-Configuración del tema WoodMart Tutorial de filtrado de productos AJAX](https://www.361sale.com/wp-content/uploads/2025/06/20250609163542696-image.png)
Paso 1: ¡Asegúrate de tener WooCommerce y el plugin WoodMart Core habilitados!
Para utilizar el filtro AJAX, su sitio debe tener primero dos cosas en su lugar:
- Instalado y activado WooCommerce plug-in (componente de software)
- Instalado y activado Núcleo WoodMart Plug-ins (que constituyen el núcleo de la funcionalidad de WoodMart)
![Image[2]-Configuración del tema WoodMart Tutorial de filtrado de productos AJAX](https://www.361sale.com/wp-content/uploads/2025/06/20250609164226931-image.png)
Si estos dos no están instalados, ve primero al backend [Plugins → Instalar Plugins] para buscarlos y habilitarlos.
Paso 2: Configurar atributos y categorías de productos
Los filtros se basan en los "Atributos" y "Categorías" de un producto. Hay que definirlos para que el sistema sepa qué filtrar.
El procedimiento es el siguiente:
- Vaya a [Productos → Propiedades] en segundo plano.
- Nuevos atributos: color, tamaño, marca, etc.
![Image[3]-Configuración del tema WoodMart Tutorial de filtrado de productos AJAX](https://www.361sale.com/wp-content/uploads/2025/06/20250609165304256-image.png)
- Haga clic en "Configurar entrada" para cada atributo, por ejemplo, añada rojo, azul, blanco para los colores.
![Imagen[4]-Configuración del tema WoodMart Tutorial de filtrado de productos AJAX](https://www.361sale.com/wp-content/uploads/2025/06/20250609165112888-image.png)
- Al editar un producto, en "Datos del producto → Propiedades", seleccione "Datos del producto → Propiedades".aumentarademásgarrapataLos valores de los atributos "para variantes de productos" (en el caso de productos variables) y "visible".
![Image[5]-Configuración del tema WoodMart Tutorial de filtrado de productos AJAX](https://www.361sale.com/wp-content/uploads/2025/06/20250609165509835-image.png)
Nota: Las opciones correspondientes sólo se mostrarán en el filtro si el artículo utiliza realmente estos atributos.
Paso 3: Crear una barra lateral de widgets con filtros
WoodMart recomienda utilizar Elementor o el panel de widgets predeterminado para añadir el widget(máquina) filtro. Aquí está el WordPress nativouna barra lateral (en software)A modo de ejemplo:
- Ve a [Apariencia → Widgets] en segundo plano.
- localice Barra lateral de la tienda(barra lateral de la tienda) o crea tu propio widget.
- Arrastre los siguientes gadgets (siempre que WoodMart Core esté activado):
- WOODMART Filtrar por atributo(para filtrar por atributos como color, marca, etc.)
- WOODMART Filtrar por precio(para filtrar por rango de precios)
- Widget de categorías de WOODMART(para filtrar por productos)
![Image[6]-Configuración del tema WoodMart Tutorial de filtrado de productos AJAX](https://www.361sale.com/wp-content/uploads/2025/06/20250609165803130-image.png)
- Cada filtro puede tener un título, un método de visualización (lista, desplegable, selección múltiple) y otras opciones de estilo.
- Guardar ajustes
Paso 4: Aplicar esta barra lateral a la página de la tienda
Ahora tienes que conseguir que este filtro aparezca en la posición correcta de la página.
Modo de funcionamiento:
- Ve al backend [WoodMart → Configuración del tema → Diseño→ Barra lateral].
- Seleccione Izquierda o Derecha en "Posición de la barra lateral de la tienda".
![Image[7]-Configuración del tema WoodMart Tutorial de filtrado de productos AJAX](https://www.361sale.com/wp-content/uploads/2025/06/20250609170558561-image.png)
- Guardar ajustes
Actualice la página de listado de productos de su sitio y verá la barra lateral con filtros.
Paso 5: Activar el filtrado AJAX
por defecto (ajuste) WoodMart El filtro es AJAX, lo que significa que el producto se actualizará automáticamente cuando haga clic en la opción de filtro, y no necesitará actualizar la página. Sin embargo, también puede comprobar manualmente si la función está activada.
- Vaya a [WoodMart → Configuración del tema → Archivo de productos] en el backend.
- Compruebe que las siguientes opciones están activadas:
- Tienda AJAX
- AJAX añadir al carrito
- Conmutación de la red de productos (opcional)
![Image[8]-Configuración del Tema WoodMart AJAX Filtro de Producto Tutorial](https://www.361sale.com/wp-content/uploads/2025/06/20250609171615583-image.png)
Estas características hacen que toda la página del producto sea más fluida y sin saltos, mejorando la experiencia del usuario.
Paso 6: Configurar el filtrado de móviles colapsados
para equilibrarmóvilPara acceder a la experiencia, WoodMart ofrece un botón "Filtro" para dispositivos móviles que despliega una barra lateral al pulsarlo.
Ve a [Configuración del tema → Diseño] desplázate hasta el final y ábrelo:
- Botón de filtros en el móvil
- Filtros fuera del lienzo para tabletas (activa la barra lateral emergente)
![Imagen[9]-Configuración del tema WoodMart Tutorial de filtrado de productos AJAX](https://www.361sale.com/wp-content/uploads/2025/06/20250609172046682-image.png)
Esto permite a los usuarios de teléfonos móviles pulsar un botón para llamar al panel de filtrado, lo que hace que la página sea más limpia y fácil de manejar.
Solución de problemas
- ¿Los clics del filtro no responden?
Comprueba si la página tiene activado el modo AJAX o si un plugin de caché intercepta las peticiones JS. - ¿No se muestran las opciones de filtrado?
Asegúrese de que el atributo o categoría correspondiente se ha aplicado al producto, de lo contrario el sistema no generará el elemento de filtro. - ¿Te equivocas de estilo?
Prueba a borrar la memoria caché o a desactivar CSS Actualice la página después de comprimir la función de fusión.
resúmenes
WoodMart viene con filtros de producto AJAX que son realmente muy potentes, y cuando se utilizan bien, es una herramienta de conversión eficiente. Es necesario configurar los atributos y las categorías de los productos de antemano, y luego configurar el filtro de producto en la secciónuna barra lateral (en software)Puede añadir los widgets adecuados a su sistema y crear un sistema de detección totalmente funcional en unos minutos.
| Contacte con nosotros | |
|---|---|
| ¿No puede leer el tutorial? Póngase en contacto con nosotros para obtener una respuesta gratuita. Ayuda gratuita para sitios personales y de pequeñas empresas |
Servicio de atención al cliente WeChat
|
| ① Tel: 020-2206-9892 | |
| ② QQ咨询:1025174874 | |
| (iii) Correo electrónico: info@361sale.com | |
| ④ Horario de trabajo: de lunes a viernes, de 9:30 a 18:30, días festivos libres | |
Enlace a este artículo:https://www.361sale.com/es/58560El artículo está protegido por derechos de autor y debe ser reproducido con atribución.






















![Emoji[wozuimei]-Photonflux.com | Servicio profesional de reparación de WordPress, en todo el mundo, respuesta rápida](https://www.361sale.com/wp-content/themes/zibll/img/smilies/wozuimei.gif)
![Emoticono [baoquan] - Photon Wave Network | Servicios profesionales de reparación de WordPress, cobertura mundial, respuesta rápida](https://www.361sale.com/wp-content/themes/zibll/img/smilies/baoquan.gif)

Sin comentarios