0

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?

1

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.

  • I tried it. But when I change the layout my entire header and footer removed. – hakkim Aug 25 '17 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 '17 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 '17 at 11:09

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.