Navegación por capas
La navegación por capas facilita la búsqueda de productos en función de la categoría, el intervalo de precios o cualquier otro atributo disponible. La navegación por capas suele aparecer en la columna izquierda de los resultados de búsqueda y las páginas de categoría y, a veces, en la página de inicio. La navegación estándar incluye una lista de categorías y un rango de precios de Comprar por. Puede configurar la visualización de la navegación por capas, incluido el recuento de productos y el intervalo de precios.
Atributos filtrables
La navegación por capas se puede utilizar para buscar productos por categoría o por atributo. Por ejemplo, cuando un comprador elige la categoría Hombres/Pantalones cortos de la barra de navegación superior, los resultados iniciales incluyen todos los productos de la categoría. La lista se puede filtrar aún más eligiendo un estilo, un clima, un color, un material, un patrón o un precio específicos, o una combinación de valores. Los atributos filtrables aparecen en una sección en expansión que enumera cada valor de atributo. Como opción, la lista de productos con resultados coincidentes se puede configurar para incluir productos con o sin coincidencia.
Las propiedades del atributo, combinadas con el tipo de entrada del producto, determinan qué atributos se pueden utilizar para la navegación por capas. La navegación por capas solo está disponible para anclaje categorías, pero también se puede agregar a las páginas de resultados de búsqueda. El tipo de entrada de catálogo para el propietario de tienda de cada atributo debe establecerse en Yes/No
, Dropdown
, Multiple Select
o Price
. Para que los atributos se puedan filtrar, la propiedad Usar en navegación por capas de cada uno debe establecerse en Filterable (with results)
o Filterable (no results)
.
Ejemplo: atributos filtrables con resultados
Ejemplo: valores de muestra filtrables mostrados sin resultado
Las siguientes instrucciones muestran cómo configurar la navegación básica por capas con atributos que se pueden filtrar. Para obtener información sobre la navegación por niveles avanzada con pasos de precio, consulte Navegación por precios.
Paso 1: Configurar las propiedades del atributo
-
En la barra lateral Admin, vaya a Stores > Attributes>Product.
-
Examine o utilice la búsqueda filtrada para buscar un atributo en la lista y abrirlo en modo de edición.
{width="700" modal="regular"}
-
En el panel izquierdo, elija Storefront Properties y establezca Use In Layered Navigation en una de las siguientes opciones:
-
Filterable (with results)
: la navegación por capas incluye solo los filtros para los que se pueden encontrar productos coincidentes. Cualquier valor de atributo que ya se aplique a todos los productos mostrados en la lista debe aparecer como filtro disponible. Los valores de atributo con un recuento de cero (0) coincidencias de producto se omiten de la lista de filtros disponibles. La lista filtrada incluye solo los productos que coinciden con el filtro. La lista de productos se actualiza únicamente si los filtros seleccionados cambian lo que se muestra. -
Filterable (no results)
: la navegación por capas incluye filtros para todos los valores de atributo disponibles y sus recuentos de productos, incluidos los productos con cero (0) coincidencias de productos. Si el valor del atributo es una muestra, el valor aparece como un filtro, pero se tachará. Esta opción no admite el filtrado por niveles de precio y no afecta a los filtros de precio.
-
-
Establezca Use In Search Results Layered Navigation en
Yes
.{width="600" modal="regular"}
-
Repita estos pasos para cada atributo que desee incluir en la navegación por capas.
No
, no se muestra la configuración de_Use in Search Results Layered Navigation_ y no se usa el atributo de producto en la búsqueda con ningún valor de configuración de Use in Layered Navigation.Paso 2: Hacer de la categoría un anclaje
-
En la barra lateral Admin, vaya a Catalog > Categories.
-
En el árbol de categorías, seleccione la categoría en la que desea utilizar la navegación por capas.
-
Expanda en la sección Display Settings y establezca Anchor en
Yes
.{width="600" modal="regular"}
-
Haga clic en Save.
Paso 3: Prueba de los resultados
Para probar la configuración, visite su tienda y vaya a la categoría desde el menú principal. La selección de atributos filtrables aparece en la navegación por capas de la página de categoría.
Busque, filtre y revise los productos mostrados.
Eliminación de valores de atributos filtrables de la navegación por capas
La navegación por capas incluye filtros para todos los valores de atributos disponibles y sus recuentos de productos, incluidos los productos con cero (0) coincidencias de productos (como se muestra en la siguiente imagen).
Este resultado puede dificultar que los clientes seleccionen un producto preferido y no es necesario mostrar valores de atributo con 0 productos en el front-end.
Puede seguir los siguientes pasos para eliminar de la navegación por capas los valores de atributos que se pueden filtrar con 0 productos:
-
En la barra lateral Admin, vaya a Stores > Attributes>Product.
-
Examine o utilice la búsqueda filtrada para buscar un atributo en la lista y abrirlo en modo de edición.
-
En Attribute Information, haga clic en Storefront Properties.
-
Para Layered Navigation, elija
Filterable (with results)
.{width="600" modal="regular"}
-
Haga clic en Save Attribute.
Navegación de precios
La navegación de precios se puede utilizar para distribuir productos por rango de precios en la navegación por capas. También puede dividir cada intervalo en intervalos. Existen varias formas de calcular la navegación de precios:
- Automático (Igualar intervalos de precios)
- Automático (ecualizar recuentos de productos)
- Manual
Con los dos primeros métodos, los pasos de navegación se calculan automáticamente. El método manual permite especificar un límite de división para los intervalos de precio. El siguiente ejemplo muestra la diferencia entre los pasos de navegación de precios de 10 y 100.
La división iterativa proporciona la mejor distribución de productos entre rangos de precios. Con la división iterativa, después de elegir el rango de 0,00 a 99 dólares, el cliente puede explorar en profundidad varios subrangos de precios. La división del intervalo de precios se detiene cuando el número de productos alcanza el umbral establecido por el límite de división de intervalo.
Ejemplo: Pasos de navegación de precios
Configuración de la navegación de precios
Excluding Tax
o Including Tax
). Para Calculation Settings, compruebe el valor Catalog Prices. Y para_Price Display Settings_, compruebe el valor Display Product Prices in Catalog. Si estos tienen valores diferentes, es posible que los filtros de precio de la navegación por capas no filtren y ordenen correctamente los productos por precio.-
En la barra lateral Admin, vaya a Stores > Settings>Configuration.
-
En el panel izquierdo, expanda Catalog y elija Catalog debajo.
-
Expanda en la sección Navegación por capas.
De manera predeterminada, Display Product Count está establecido en
Yes
. Si es necesario, anule la selección de la casilla de verificación Use system value para cambiar esta configuración.{width="600" modal="regular"}
Para obtener una lista detallada de estas opciones de configuración, consulte Navegación por capas en la Referencia de configuración.
-
Establezca Price Navigation Steps Calculation para uno de los métodos de las secciones siguientes.
-
Una vez finalizado, haga clic en Save Config.
Método 1: Automático (igualar intervalos de precios)
Deje Price Navigation Steps Calculation establecido en Automatic (Equalize Price Ranges)
(predeterminado). Esta configuración utiliza el algoritmo estándar para la navegación de precios.
Método 2: automático (igualar los recuentos de productos)
-
Establezca Price Navigation Steps Calculation en
Automatic (equalize product counts)
. -
Para mostrar un solo precio cuando hay varios productos con el mismo precio, establezca Display Price Interval as One Price en
Yes
. -
Para Interval Division Limit, introduzca el umbral para el número de productos dentro de un rango de precios.
El rango no se puede dividir más allá de este límite. El valor predeterminado es
9
.{width="600" modal="regular"}
Método 3: manual
-
Establezca Price Navigation Steps Calculation en
Manual
. -
Escriba un valor que determine Default Price Navigation Step.
-
Escriba el Maximum Number of Price Intervals permitido, hasta
100
.{width="600" modal="regular"}
Configuración de la navegación por capas
La configuración de navegación por capas determina si aparece un recuento de productos entre paréntesis después de cada atributo y el tamaño del cálculo del paso que se utiliza en la navegación de precios.
-
En la barra lateral Admin, vaya a Stores > Settings>Configuration.
-
En el panel izquierdo, expanda la sección Catalog y elija Catalog debajo.
-
Expanda la sección Layered Navigation.
note note NOTE Si es necesario, anule primero la selección de la casilla de verificación Use system value para cambiar esta configuración. -
Para mostrar el número de productos encontrados para cada atributo, establezca Display Product Count en
Yes
. -
Establezca Price Navigation Step Calculation en
Automatic (equalize price ranges)
. -
Una vez finalizado, haga clic en Save Config.