Im trying to add a secondary div wrapper if you like underneath the .page-wrapper, for example:

<div class="page-wrapper">
  <div class="my-new-wrapper-div">
    <!-- ALL OTHER CONTAINERS, header, main.content etc -->

Is there a supported way of doing this by just creating a new container? Im able to get a new container to show on the page but it doesn't wrap the rest of the contents.

1 Answer 1


This is how i do this for some of the projects i work on.

<!--   Move all nessecery elements   -->
<move element="header.container" destination="my.new.wrapper.div" as="header_container"/>
<move element="main.content" destination="my.new.wrapper.div" as="main_content"/>

<referenceContainer name="page.wrapper">
    <!--    ofcourse make this html file in the right directory  -->
    <block class="Magento\Framework\View\Element\Template" name="my.new.wrapper.div" before="-" template="Magento_Theme::html/my-new-wrapper-div.phtml" />

You might need to echo these blocks inside you html files

<?php echo $block->getChildHtml('header_container'); ?>
<?php echo $block->getChildHtml('main_content'); ?>

You also need to move your footer the same way as main.content and header.container

Hope this helps!

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.