A?adir filtrado multinivel a artículos y productos en Elementor Tutorial

En este tutorial, mostramos cómo el Elementor ha dado en el clavo Elementos ilimitados Plugin para a?adir filtros multinivel a productos o entradas. Este artículo se basa en el WooCommerce Rejilla de productos con el widget "Filtros de pesta?as" como ejemplo. Este es un escenario de aplicación común. De hecho, los filtros multinivel pueden aplicarse a muchos tipos de artículos, galerías y otros contenidos.

A continuación encontrará una guía detallada paso a paso para aplicar el filtrado multinivel:

Imagen[1]-Elementor Multilevel Filter Feature Setting Tutorial completo

Paso 1: Creación de categorías y subcategorías

Antes de empezar, establezca categorías y subcategorías para el artículo o producto y asígnelas a las categorías correctas.

Esto permite que el filtro muestre el contenido según una lógica jerárquica preestablecida.

Imagen [2]-Elementor Filtro multinivel Configuración Tutorial completo

Paso 2: Instalar los widgets necesarios

Primero tenemos que instalarElementos ilimitados Complementos.

Este ejemplo utiliza el Ficha Filtros Gadgets y WooCommerce Rejilla de productos Gadgets.

Abre la biblioteca de widgets de Unlimited Elements y busca estos dos widgets. Cuando pase el ratón por encima de los widgets, verá un botón "Instalar", haga clic en él para completar la instalación.

Imagen [3]-Elementor Filtro multinivel Configuración Tutorial completo
Imagen [4]-Elementor Multi-Level Filter Feature Setting Tutorial completo

Paso 3: A?adir la cuadrícula de productos a la página

A?ada el WooCommerce Widget de cuadrícula de productos y establezca los criterios de consulta de productos. Por ejemplo, puede mostrar solo productos de la categoría "Hombre" o "Mujer".

Tenga en cuenta que la Relación de términos se establece en "O" al configurar la consulta; de lo contrario, los resultados no se mostrarán correctamente en la cuadrícula cuando se seleccionen varias categorías.

Imagen [5]-Elementor Multi-Level Filter Feature Setting Tutorial completo

Antes de continuar con el siguiente paso, abra el widget Product Grid en la ventana Ajax función de filtración.

Paso 4: Activar el filtrado

Habilite el filtrado Ajax en la configuración de gadgets de la cuadrícula de productos, como se muestra aquí.

Imagen [6]-Elementor Multi-Level Filter Feature Setting Tutorial completo

Paso 5: A?adir el filtro principal

Arrastre un widget Filtros de pesta?a a la página y establezca su función de filtro en Filtro principal (Main).

Imagen [7]-Elementor Filtro multinivel Configuración Tutorial completo

A continuación, vaya a la sección "Selección de términos" y personalice la consulta para mostrar las categorías que desee en la pesta?a principal, como "Ropa de hombre", "Ropa de mujer", "Ropa de mujer", etc. ".

Imagen [8]-Elementor Multi-Level Filter Feature Setting Tutorial completo

Paso 6: A?adir subfiltros

Debajo del filtro principal, a?ade otro widget de filtros de pesta?a y establece su "Función de filtro" en Ni?o.

Imagen [9]-Elementor Multi-Level Filter Feature Setting Tutorial completo

A continuación, vaya a la sección "Selección de términos" y configure las subcategorías que desea mostrar. En este ejemplo, seleccione "Hombres" como categoría principal y marque "Mostrar hijos de".

Imagen [10]-Elementor Multi-Level Filter Feature Setting Tutorial completo

Con esta configuración, el subfiltroSe actualiza dinámicamente según la selección del filtro principalcategorizaciónEtiquetas.

resúmenes

Una vez completados los ajustes, previsualice la página para comprobar si la función de filtrado multinivel funciona como se espera. Al hacer clic en la categoría principal (por ejemplo, "Ropa de hombre"), las subcategorías correspondientes se mostrarán dinámicamente debajo; al hacer clic en una subcategoría, la parrilla de productos filtrará automáticamente los productos coincidentes.

Siguiendo estos pasos, el Elementor En la implementación de la función de filtrado multinivel, para que el contenido de la página se muestre más organizado, y facilitar a los visitantes encontrar rápidamente la información de destino.


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
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
? Declaración de reproducción
Este artículo fue escrito por: ladrones serán ratas y ratones coraje
EL FIN
Si le gusta, apóyela.
felicitaciones7212 compartir (alegrías, beneficios, privilegios, etc.) con los demás
comentarios compra de sofás

Por favor, inicie sesión para enviar un comentario

    Sin comentarios