El widget Filtro de productos – Categorías que forma parte de la extensión Búsqueda de productos de WooCommerce proporciona un filtro de categorías de productos en vivo para su tienda. Mientras sus clientes eligen la categoría deseada, encuentra los productos coincidentes y los muestra en la página de la tienda.

Este filtro en vivo muestra las categorías de productos en las que el cliente puede hacer clic. Actualizará la página de la tienda para incluir los productos dentro de la categoría elegida.

Estilos Volver al principio

El filtro de categorías ofrece varios estilos que proporcionan una vista y una experiencia de usuario alternativas. Estos estilos se pueden personalizar e incluyen la opción de mostrar miniaturas para cada término.

El estilo de lista muestra los términos de forma vertical y los términos principales se pueden expandir para mostrar los términos secundarios cuando el visitante pasa por encima de ellos. Se puede utilizar la configuración para ajustar la apariencia y el comportamiento.

De forma similar al estilo Lista, el estilo En línea muestra los términos de forma más horizontal.

El estilo Desplegable también permite realizar búsquedas y ofrece ajustes para mostrar miniaturas tanto en la lista como en los términos elegidos. Puede ampliarse con la interacción del usuario o utilizarse con una altura flexible o fija.

El estilo más tradicional Select es más sencillo pero similar al Dropdown. También se puede especificar su tamaño, por lo que se puede utilizar una versión más compacta o ampliada para mostrar un número de términos.

Todos estos estilos tienen ajustes específicos que permiten personalizar su aspecto y crear una experiencia de usuario adecuada. Además, los filtros de atributos también ofrecen estos estilos.

Configuraciones Volver arriba

Las configuraciones que se indican aquí determinan la apariencia y el comportamiento del widget de filtro.

• El campo Título permite establecer el título del widget. Recomendamos dejarlo vacío y hacer que el widget muestre su título automáticamente en su lugar, ya que se ocultará cuando no haya categorías coincidentes que mostrar y se mostrará cuando las haya automáticamente. Si utiliza este título, este no será el caso.

Cabecera Volver arriba

• Mostrar cabecera – Esta opción mostrará la cabecera de este filtro.
• Cabecera – Puede introducir una cabecera personalizada aquí o dejarla vacía para utilizar la predeterminada. El encabezamiento no se mostrará cuando no haya términos que mostrar.
• Encabezamiento para sin resultados – Puede introducir el texto de un encabezamiento alternativo que se mostrará cuando no haya resultados.

Mostrar Volver arriba

Dependiendo del Estilo elegido, algunas opciones pueden o no estar disponibles.

• Mostrar sólo en las páginas de la tienda – Utilice esta opción para mostrar el widget sólo en las páginas relevantes de la tienda. Esto incluye la página de la tienda, la etiqueta del producto y las páginas de la categoría del producto, etc.
• Estilo – Ofrece opciones sobre cómo mostrar los términos: Lista, En línea, Seleccionar o Desplegable.
• Mostrar miniaturas / Padres – Habilite esta opción para mostrar miniaturas para los términos. Se proporciona una opción separada para mostrar las miniaturas de los términos padre.
• Mostrar miniaturas de los seleccionados – Disponible cuando se elige Desplegable como Estilo. Si se activa, muestra las miniaturas también para los términos seleccionados.
• Mostrar nombres / Padres – Active esta opción para mostrar los nombres de los términos. Se proporciona una opción separada para mostrarlos para los términos padres.
• Mostrar recuentos de productos – Si se activa, se mostrará el número de productos relacionados por término.
• Ocultar términos sin productos – Esto ocultará automáticamente los términos que no tienen productos relacionados.
• Texto para sin selección – Esta opción está disponible cuando se selecciona Desplegable como Estilo y determina el texto que se muestra en el campo Desplegable cuando no se selecciona ningún elemento.
• Número de términos – Si se da un número, esto limita el número de términos mostrados.
• Tamaño – Disponible cuando se elige Seleccionar como Estilo. Determina el tamaño de la caja de selección.
• Altura – Disponible cuando se elige Desplegable como Estilo. Si se deja vacío, las opciones del desplegable se muestran abajo cuando el campo gana el foco. Si se introduce un número simple, por ejemplo 5, el desplegable adoptará una altura fija para mostrar el número de entradas indicado. Si se utiliza un número con una unidad CSS*, por ejemplo 120px, el desplegable adoptará una altura fija según la unidad indicada. *Unidades CSS permitidas: px, mm, cm, in, pt, pc, em , ex, ch, rem, vw y vh.
• Alternar el componente – Ocultar el componente del filtro cuando no tiene opciones, «sí» (por defecto) o «no».
• Alternar el widget – Oculta el widget cuando el componente no tiene opciones, «sí» (por defecto) o «no».

Ordenar Volver arriba

• Ordenar por … – Utilice esta opción para determinar el orden en que se muestran los términos. Puede elegir ordenarlos por uno de varios criterios, como por ejemplo el Nombre del término para una ordenación alfabética o el Orden de los términos para mostrarlos según lo establecido en la lista de categorías de productos.

Navegación Volver arriba

Las opciones de esta sección determinan cómo se presenta la jerarquía de categorías de productos al visitante y cómo interactuará.

Si utiliza los valores predeterminados, las categorías raíz se mostrarán y sus hijos estarán ocultos.

Si pasa el ratón por encima de una categoría con hijos, ésta se expandirá y revelará sus hijos. Esto continúa mientras haya hijos más abajo en la jerarquía.

En los dispositivos con tecnología táctil, puede tocar el símbolo de expansión de una categoría para mostrar sus hijos.

Aquí hay un ejemplo que muestra sólo las categorías raíz con sus expansores:

Aquí está la misma área pero ahora los hijos de ambas categorías se han expandido:

Las opciones que controlan la experiencia de navegación a través de las categorías de productos son:

• Expandir términos hijos – Aquí puede determinar en qué nivel las categorías ocultarán sus hijos. Por defecto, sólo se muestran las categorías raíz y si tienen hijos, se muestra un símbolo de expansión.
• Expandir automáticamente – Esta opción está activada por defecto para que las categorías expandibles revelen sus hijos al pasar el ratón automáticamente. Si lo desactiva, deberá hacer clic explícitamente en el expansor para ver los hijos, al igual que debe tocarlo en los dispositivos táctiles.
• Retraer automáticamente – Cuando se desplace fuera del área donde se muestran las categorías, los hijos se ocultarán automáticamente. Esto está activado por defecto.
• Mostrar expansores – Esto mostrará expansores y retractores para las categorías con hijos.
• Mostrar la jerarquía de ancestros – Esto determina si se muestra la jerarquía de ancestros basada en el contexto actual.
• Mostrar la navegación de los padres – Si se activa, se muestran enlaces adicionales para los ancestros que permiten navegar hacia atrás en la jerarquía.

Términos Volver al principio

• Profundidad – Esta opción permite limitar la profundidad dentro de la jerarquía de términos.
• Filtro – Esta opción debe estar habilitada para el filtrado en vivo.
• Jerárquico – Si los términos deben mostrarse como una jerarquía.
• Múltiple – Si desea permitir a los visitantes seleccionar más de un término, habilite esta opción.
• Mostrar – Esto determinará si a) Se muestran todos los términos, o b) con Set, sólo se muestran los que están dentro de la jerarquía del término seleccionado.
• Términos a incluir – Aquí puede indicar los términos que deben ser incluidos. Si se deja vacío, se muestran todos los términos. Indique los términos por ID, slug o nombre y separados por coma.
• Términos a excluir – Indique aquí los términos que deben ser excluidos por ID, slug o nombre y separados por coma. Si se indican los términos a incluir, éstos anulan completamente este campo – utilice cualquiera de ellos pero no ambos.
• Término padre – Esto limitará los términos mostrados a los hijos del indicado. Se puede utilizar el token {actual} para limitarlo a los hijos del término actual.

Avanzadas Volver al principio

Las opciones avanzadas deben dejarse en sus valores predeterminados a menos que sea necesario abordar un caso específico con este filtro.

• ID del encabezado – Establece el ID del elemento del encabezado.
• Clase de encabezado – Esto establece la clase del elemento de encabezado.
• Elemento de encabezado – Aquí puede elegir qué etiqueta HTML se utiliza como elemento de encabezado.
• ID de contenedor – Esto establece el ID del elemento contenedor div principal del filtro.
• Clase de contenedor – Esto añade a la clase del elemento contenedor div principal del filtro.