Seleccione más de un elemento en la navegación en capas (selección múltiple / casillas de verificación)

12

¿Cómo convierte la navegación en capas estándar para usar casillas de verificación o entradas de selección múltiple para atributos de tipo desplegable o multiselección ?

Por ejemplo, si un usuario selecciona azul y rojo para el atributo de color, la navegación en capas muestra todos los elementos que coinciden con azul O rojo.

~~Vea el ejemplo en la barra de herramientas de esta página:~~

attributes layered-navigation product-list

— Alizain Prasla
fuente

¿Cómo te fue con este? ¿Qué decidiste usar?

— jharrison.au

@ jharrison.au .. Bueno, he cambiado el menú desplegable de selección en INTERRUPTOR DE COLOR y TAMAÑO. No es múltiple todavía.

— Alizain Prasla

10

Existen muchas extensiones que le brindarán esta funcionalidad (busque "navegación en capas mejorada"). He probado todas las extensiones que se enumeran a continuación, pero mi favorito es el equipo de comercio electrónico : me gusta por su naturaleza minimalista, no trata de hacer demasiado, pero es muy potente y funciona bien de inmediato. También tiene soporte para muestras de color como las que describiste.

Algunos otros en ningún orden en particular:

Tenga en cuenta que esto puede causar conflictos con otros módulos de terceros.

Si está buscando hacer esto principalmente con muestras de color, le sugiero que consulte esta extensión de Chad Morgan.

Aquí hay un artículo de Inchoo sobre cómo mantener visibles los filtros no utilizados.

Si está buscando codificar esto usted mismo, creo que la respuesta a su pregunta podría ser demasiado larga para este foro. No tengo un enlace a una publicación de blog / tutorial que le enseñe cómo hacer esto, pero sugiero comenzar con la extensión de los bloques de navegación en capas.

— jharrison.au
fuente

66

He usado el módulo Amasty y recomendaría echarle un vistazo. El módulo Aitoc, sin embargo, no tocaría con un poste de 10 '... o cualquiera de sus módulos para el caso.

— davidalger

El módulo Amasty no funcionará con ningún atributo personalizado que use una fuente respaldada por un modelo eav personalizado. Esto fue un problema para nosotros ya que nuestros atributos se rellenan a través de una API externa.

— greatwitenorth

8

Si solo está interesado en convertir la navegación por capas predeterminada en casillas de verificación, la solución es muy fácil y colocarla aquí.

Edite el código del app/design/frontend/ourpackage/ourtheme/template/catalog/layer/filter.phtmlarchivo de la siguiente manera:

<ol>
<?php foreach ($this->getItems() as $_item): ?>
    <li>
        <?php if ($_item->getCount() > 0): ?>
            <form>
                <span class="check-box">
                    <input type="checkbox" name="vehicle" onclick='window.location.assign("<?php echo $this->urlEscape($_item->getUrl()) ?>")'/>
                </span>
                <a href="<?php echo $this->urlEscape($_item->getUrl()) ?>">
                    <?php echo $_item->getLabel() ?>
                    <?php if ($this->shouldDisplayProductCount()): ?>
                    <span class="count">(<?php echo $_item->getCount() ?>)</span>
                    <?php endif; ?>
                </a>
            </form>
        <?php else: ?>
            <form>
                <span class="check-box">
                    <input type="checkbox" name="vehicle" onclick='window.location.assign("<?php echo $this->urlEscape($_item->getUrl()) ?>")'/>
                </span>
                <span>
                    <?php echo $_item->getLabel(); ?>
                    <?php if ($this->shouldDisplayProductCount()): ?>
                        <span class="count">(<?php echo $_item->getCount() ?>)</span>
                    <?php endif; ?>
                </span>
            </form>
        <?php endif; ?>
    </li>
<?php endforeach ?>
</ol>

La solución es la versión mejorada de esto . Así que el crédito también va para esta persona.

— Imran Zahoor
fuente