3

I want to add a new class inside column main div. Right now my layout in frontend is like this:

<div class="columns">
    <div class="column main">
        <div="MYDIV">
        </div>
    </div>
    <div class="sidebar sidebar-additional">
    </div>
</div>

this is my layout:

<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>
4
  • on your 2nd div where class is "column main".. you want to add one more class here , for example "test" ? Commented Nov 1, 2017 at 8:12
  • I want to be where is MYDIV
    – Robert
    Commented Nov 1, 2017 at 8:14
  • I want to be created
    – Robert
    Commented Nov 1, 2017 at 9:03
  • let me explain you again, this <div="MYDIV"> must be inside <div class="column main"> is the magento Blank theme
    – Robert
    Commented Nov 1, 2017 at 9:08

2 Answers 2

7

You can try it:

your_theme_root/Magento_Theme/layout/default.xml

<?xml version="1.0"?>
<page xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
      xsi:noNamespaceSchemaLocation="urn:magento:framework:View/Layout/etc/page_configuration.xsd">
    <body>
        <referenceContainer name="columns">
            <container name="columns.main" htmlTag="div" htmlClass="column main" before="-" />
        </referenceContainer>
        <referenceContainer name="main" htmlClass="class-example" />
        <move element="main" destination="columns.main" />
    </body>
</page>

Replace class-example to your css class.

4
  • and sidebar where is?
    – Robert
    Commented Nov 1, 2017 at 9:14
  • and what I post there is the 2columns-left layout
    – Robert
    Commented Nov 1, 2017 at 9:15
  • It is layout inside your theme, it extends standard 2columns-left layout. Sidebars remain on the same places. Commented Nov 1, 2017 at 9:19
  • I understand, is perfect thank you very much
    – Robert
    Commented Nov 1, 2017 at 9:22
3

You can try this.

Preferred way is to edit in theme's default.xml file. You may create or edit the default.xml file at path app/design/frontend/Vendor/theme/Magento_Theme/layout/default.xml

If one wants to add container div under column div, should try this.

<page xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:framework:View/Layout/etc/page_configuration.xsd">
        <body>
           <referenceContainer name="columns">
                <container name="container" label="" htmlTag="div" htmlClass="container" />
            </referenceContainer>        
           <move element="main" destination="container" before="-"/>
        </body>
</page>
1
  • I am getting this error : Element 'referenceContainer', attribute 'class': The attribute 'class' is not allowed. after upgrade from m2.3.3 to m 2.3.5 (EE) Commented Sep 21, 2020 at 16:31

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

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