CODEWITHSUNDEEP
magento2
user2733745
user2733745

Reputation: 220

How to move topmenu inside header wrapper in magento2?

How to move topmenu inside header wrapper reference [magentoroot]vendor/magento/module-theme/view/frontend/layout/default.xml

I want to move catalog.topnav inside header-wrapper 

<referenceContainer name="page.top">
            <block class="Magento\Theme\Block\Html\Topmenu" name="catalog.topnav" template="html/topmenu.phtml" ttl="3600"/>
</referenceContainer>
<referenceContainer name="header-wrapper">
</referenceContainer>

Thanks

Upvotes: 3

Views: 10784

Answers (3)

ekuusela
ekuusela

Reputation: 5282

To get this to work, I had to move the whole navigation.sections block. Otherwise the menu would look broken with mobile resolutions. I'm working with Magento 2.1.1 and my theme inherits from blank.

In /app/design/frontend/<Vendor>/<theme>/Magento_Theme/layout/default.xml add this:

<page xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:framework:View/Layout/etc/page_configuration.xsd">
    <body>
        <move element="navigation.sections" destination="header-wrapper" after="logo"/>
    </body>
</page>

Upvotes: 1

Flavio
Flavio

Reputation: 1

I suggest you create a structure in your app/design/frontend/yourVendor/yourTheme/Magento_Theme/page_layout

Inside create your default.xml and paste this:

<page xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:framework:View/Layout/etc/page_configuration.xsd">
    <body>
      <move element="catalog.topnav" destination="header-wrapper" after="logo"/>
    </body>
</page>

Upvotes: -2

Shivam
Shivam

Reputation: 2443

Add Following code in [magentoroot]vendor/magento/module-theme/view/frontend/layout/default.xml

<page xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:framework:View/Layout/etc/page_configuration.xsd">
    <body>
      <move element="catalog.topnav" destination="header-wrapper" after="logo"/>
    </body>
</page>

Upvotes: 4

Related Questions