Magento 2: Setting div position on category page

magento.stackexchange https://magento.stackexchange.com/questions/296723

  •  21-03-2021
  •  | 
  •  

Question 

<div class="alocolumns clearfix">
       <div class="column main"></div>
       <div class="sidebar sidebar-main"></div>
</div>

I need this way

<div class="alocolumns clearfix">
       <div class="sidebar sidebar-main"></div>
       <div class="column main"></div>
</div>**strong text**

I checked 2columns-left.xml,but here it shown only sidebar

<?xml version="1.0"?>
<layout xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:framework:View/Layout/etc/page_layout.xsd">
     <update handle="1column"/>
     <referenceContainer name="columns">
        <container name="div.sidebar.main" htmlTag="div" htmlClass="sidebar sidebar-main" after="main">
            <container name="sidebar.main" as="sidebar_main" label="Sidebar Main"/>
        </container>
        <container name="div.sidebar.additional" htmlTag="div" htmlClass="sidebar sidebar-additional" after="div.sidebar.main">
            <container name="sidebar.additional" as="sidebar_additional" label="Sidebar Additional"/>
        </container>
    </referenceContainer>
</layout>

How to change the position of the div ?

Was it helpful?

Solution

You can add this line in your catalog_category_view.xml layout file

app/design/frontend/Vendor/Theme/Magento_Catalog/layout/catalog_category_view.xml

<move element="div.sidebar.main" destination="columns" before="-" />

Like

<?xml version="1.0"?>
<page xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" layout="2columns-left" xsi:noNamespaceSchemaLocation="urn:magento:framework:View/Layout/etc/page_configuration.xsd">
    <body>
        <move element="div.sidebar.main" destination="columns" before="-" />
    </body>
</page>

After adding this line please run below command once

php bin/magento cache:clean layout
php bin/magento cache:flush layout

Hope this will help you!

Licensed under: CC-BY-SA with attribution
Not affiliated with magento.stackexchange
scroll top