2

Using Magento 2 with my child theme of Luma I would rather the checkout pages showed the header and footer. Thanks to this thread I have found how to add most of it back in. The only bit I am struggling with adding back in is the main menu. Presumably this also needs adding in my checkout_index_index.xml file? It currently looks like this:

<?xml version="1.0"?>
<page xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" layout="1column" xsi:noNamespaceSchemaLocation="urn:magento:framework:View/Layout/etc/page_configuration.xsd">
    <body>
        <referenceBlock name="minicart" remove="false"/>
        <referenceContainer name="header.panel" remove="false"/>
        <referenceBlock name="top.search" remove="false"/>
        <referenceBlock name="catalog.compare.link" remove="true"/>
        <referenceBlock name="catalog.topnav" remove="false"/>
        <referenceContainer name="footer-container" remove="false"/>
    </body>
</page>
3

In your theme directory create file app/design/frontend/Sims/luma/Magento_Checkout/layout/checkout_index_index.xml

Menu container should be added here like it being done for 1column.xml layout

<?xml version="1.0"?>

<page layout="checkout" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
      xsi:noNamespaceSchemaLocation="urn:magento:framework:View/Layout/etc/page_configuration.xsd">
    <body>
        <referenceContainer name="page.wrapper">
            <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"/>
        </referenceContainer>
        <move element="logo" destination="header-wrapper" before="-"/>
    </body>
</page>

In this example header and footed added also but "page.top" is responsible for navigation menu

In second step should be rewritten styles

.checkout-index-index .nav-sections, .checkout-index-index .nav-toggle {
    display: none;
}

With something like this:

.checkout-index-index {
    .nav-sections {
        display: block;
    }
}
2

Actually I have just noticed that by default this is added:

.checkout-index-index .nav-sections, .checkout-index-index .nav-toggle {
    display: none;
}

Which obviously can be overridden. So if anyone has the same problem just change that to display block instead.

-1

Change: layout="checkout" to "1column" Remove the css because allready exist and Done!

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.