2

I am developing a custom theme in magento 2.1.7. Everything goes fine till I reached checkout page. There were no header and footer found in checkout page. It seems like magento 2's default behavior. But here in my case I need to show the menu bar and other header links in header and footer. I managed to bring up minicart and search in header. But I couldn't add navigation menu. This is my

app/design/frontend/vendor/theme/Magento_Checkout/layout/checkout_index_index.xml

file

     <referenceContainer name="page.messages" remove="false"/>
    <move element="logo" destination="header-wrapper"/>
     <move element="minicart" destination="header-wrapper" before="top.links"/>
    <referenceContainer name="catalog.topnav" remove="false"/>
    <move element="catalog.topnav" destination="header-wrapper" after="top.search"/>
    <referenceContainer name="page.wrapper">
        <container name="header.container" as="header_container" label="Page Header Container" htmlTag="header" htmlClass="page-header container" before="main.content">
        </container>
        <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>
</body>

I have checked many websites and some of them suggested it would be hidden in css. But I couldn't find the DOM for menu in page source. Can any one helps me out?

Improve this question

2 Answers 2

Reset to default
2

Please copy checkout_index_index.xml from path vendor/magento/module-checkout/view/frontend/layout/ to your theme path app/design/frontend/vendor/theme/Magento_Checkout/layout/.

In the default file you can see layout="checkout". See below.

<?xml version="1.0"?>
<!--
/**
 * Copyright © 2013-2017 Magento, Inc. All rights reserved.
 * See COPYING.txt for license details.
 */
-->
<page xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" layout="checkout" xsi:noNamespaceSchemaLocation="urn:magento:framework:View/Layout/etc/page_configuration.xsd">

So just need to replace that layout="1column". So it looks like below.

<?xml version="1.0"?>
<!--
/**
 * Copyright © 2013-2017 Magento, Inc. All rights reserved.
 * See COPYING.txt for license details.
 */
-->
<page xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" layout="1column" xsi:noNamespaceSchemaLocation="urn:magento:framework:View/Layout/etc/page_configuration.xsd">

After this clean your cache folders manually (var/page_cache and var/cache). Now visit the checkout page. You can see both header and footer are coming now.

Improve this answer
3
  • I tried it. But when I change the layout my entire header and footer removed.
    – hakkim
    Aug 25, 2017 at 10:48
  • It is working fine for me with default Magento 2.1.8 Luma theme. So you need to modify as per your custom theme.
    – Bhavin iFlair
    Aug 25, 2017 at 10:53
  • Thanks brother. I removed <referenceContainer name="page.wrapper"> from my layout/checkout_index_index.xml and your trick is worked. Thank you so much.
    – hakkim
    Aug 25, 2017 at 11:09
0

This works, but I also had to add the following .css to make the menu show up ( I am inheriting from Magento_Blank)...

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

Improve this answer

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.