0

In Magento 2.2.5, Is there any way to display the top customer header links in Category navigation menu.

Like this

enter image description here

1
  • Customer header links are available 2 times in page, 1 is on top left side of page & second one is available in category navigation menu. 1st is used in desktop version & another is used in mobile/tab version. So make 2nd one visible using css in both desktop&mobile version& hide 1st one. Commented Jan 23, 2019 at 10:55

1 Answer 1

0

Add below code in Magento_Theme/layout/default.xml file

    <referenceContainer name="page.top">
                <container name="header.bottom" htmlTag="div" htmlClass="header-bottom" after="-">
                </container>
    </referenceContainer>

 <move element="top.links" destination="header.bottom"/>
 <move element="navigation.sections" destination="header.bottom" after="top.links"/>

and run below command

php bin/magento cache:clean & php bin/magento cache:flush
7
  • @Mohammed, Thanks for your suggestion. It is showing as one by one links. I need as it is with dropdown. Any possibilities. Commented Jan 24, 2019 at 13:08
  • Use below code to show links with dropdown, <container name="header.links" htmlTag="div" htmlClass="header-links" after="-"> <block class="Magento\Customer\Block\Account\Navigation" name="top.links"> <arguments> <argument name="css_class" xsi:type="string">header links</argument> </arguments> </block> </container> <referenceContainer name="page.top"> <container name="header.bottom" htmlTag="div" htmlClass="header-bottom" after="-"> </container> </referenceContainer> Commented Jan 25, 2019 at 7:03
  • <move element="header.links" destination="header.bottom"/> <move element="navigation.sections" destination="header.bottom" after="top.links"/> Commented Jan 25, 2019 at 7:03
  • I am geting this output. PLease check here. ibb.co/Xj1YLyW I have a doubt. Why you moving these elements. "<move element="header.links" destination="header.bottom"/> <move element="navigation.sections" destination="header.bottom" after="top.links"/>". Because of this, breadcrumbs are coming before the navigation links. Commented Jan 25, 2019 at 7:46
  • We are moving these elements to change the postion of Header links as you needed instead of default, if you are having issue with breadcrumbs then use below code to make the proper postion of breadcrumbs. <move element="breadcrumbs" destination="main.content" before="-"/> Commented Jan 25, 2019 at 8:49

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.