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
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>
You don't need to code anything; just change the 2-column design to 1-column design, from the category admin panel and it will automatically move to the top of the product grid.
[
1
Or You can change 1 colomn design from xml also.
<catalog_product_view>
<reference name="root">
<action method="setTemplate"><template>page/1column.phtml</template>
</action>
</reference>
</catalog_product_view>
