0

I need to add additional wrapper inside page.wrapper so that other containers will be inside by custom wrapper.

app/design/frontend/Vendor/Theme/Magento_Theme/page_layout/1column.xml

<?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="empty"/>
    <referenceContainer name="page.wrapper">

        <container name="my-custom-wrapper" htmlClass="my-custom-wrapper" htmlTag="div">

        <container name="header.container" as="header_container" label="Page Header Container" htmlTag="header" htmlClass="page-header" before="main.content"/>
        <container name="page.top" as="page_top" label="After Page Header" after="header.container"/>
        <container name="footer-container" as="footer" before="before.body.end" label="Page Footer Container" htmlTag="footer" htmlClass="page-footer" />

        </container>

    </referenceContainer>
</layout>

Expected HTML

<div class="page-wrapper">
  <div class="my-custom-wrapper">
     ... all other containers ....
  </div>
</div>

How do I do it ?

1

in your layout file, you can add using code below :

<referenceContainer name="content">
            <container name="container-name" htmlTag="div" htmlClass="container-class">
   </container>
</referenceContainer>
  • The above snippet is generic. Could you post wrt to my code? – Slimshadddyyy Jan 17 '18 at 11:25
  • What if it is not working? This xml is loaded into the page tree, but there is no div.container-class created – TheKitMurkit May 24 at 14: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.