1

Currently my Layered Navigation on mobile is under the products. On a large Category we have 60 Products displayed with additional filters for the layered navgiation. Since the users cant find the filter options I want to move it above the products to make it visible for everyone.

For some reason i dont know where to start, is there anyone who could help me with that?

Magento Version: 2.2.6

1

I haven't tested below code .. But should do the job. Basically we need to move "catalog.leftnav (catalog_category_view_type_layered.xml)" block from side to content.

Add below to your local theme Magento_LayeredNavigation/layout/catalog_category_view_type_layered.xml

<?xml version="1.0"?>
<!--
/**
 * Copyright © Magento, Inc. All rights reserved.
 * See COPYING.txt for license details.
 */
-->
<page xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:framework:View/Layout/etc/page_configuration.xsd">
    <body>
        <move element="catalog.leftnav" destination="content" before="category.products" />
    </body>
</page>
  • That works like a charm, but unfortunalty it also changed on the desktop layout. Is there a way to make that only for mobile? – Marcel H. Feb 18 at 8:54
  • If you only need to change order in Mobile, the you can do it via CSS order property, that's one ways of doing it . Or else using jquery/javascript we can move div container. I would prefer CSS order. – Rakesh Gangani Feb 18 at 10:26

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.