Magento 2 – Move Navigation Sections into Page Header Element in XML

magento2xml

This is my code:

    <move element="navigation.sections" destination="page.header" />

But the navigation bar disappears then. Whats wrong here?

Best Answer

Solution was to use header.container. Found it via console:

grep -rl "navigation.sections" * to find out where this gets injected, because its close to the desired destination.

nano vendor/magento/module-theme/view/frontend/layout/default.xml to find the name of the container in which it gets injected. Suprise - its header.container instead of page.header.

 <move element="navigation.sections" destination="header.container" />

Related Solutions

Magento 2 – How to Move Search Bar in Navigation Div Using XML

Add the following line into yourtheme/layout/default.xml

<move element="top.search" destination="navigation.sections" after="catalog.topnav" />

Copy sections.phtml from module-theme/view/frontend/templates/html/sections.phtml to yourtheme/templates/html/sections.phtml

Now open this file and put the following line of code after class="section-items" DIV

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

This is working for me.

Magento 2 XML Layout – Move Element Not Working

Why you don't reference the page.wrapper container and create category.header inside:

<referenceContainer name="page.wrapper">
    <container name="category.header" as="categoryHeader" htmlTag="div" htmlClass="category-header" before="main.content" />
</referenceContainer>

Best Answer

Related Solutions

Magento 2 – How to Move Search Bar in Navigation Div Using XML

Magento 2 XML Layout – Move Element Not Working

Related Topic