How to Add Top Link in Magento 2
Website header is the best place to show links of the important pages. Top links on a website effectively engage users and ease the access to pages like “My Account”, “My Wishlist”, “My Cart”, etc. It helps to redirect the users to particular pages such as wishlist page or cart page, where chances of the conversions are high! The top links must be configured in such a way that it serves multi-purpose of easy navigation and boost sales.
Magento 2 has various default top links as My Account, Wishlist, etc. Sometimes, store owners require to add custom Magento 2 top links to strategize improved user experience and sales boost.
Today I’ve come up with the tutorial to add top link in Magento 2. Use the code as per your requirement.
Method to Add Top Link in Magento 2:
Go to app/code/Vendor/Extension/view/frontend/layout/default.xml and paste the below code.
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 |
<page xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:framework:View/Layout/etc/page_configuration.xsd"> <body> <referenceBlock name="header.links"> <!-- Contact us Link --> <block class="Magento\Framework\View\Element\Html\Link" name="contactus.link" after="register-link"> <arguments> <argument name="label" xsi:type="string" translate="false">Constact Us</argument> <argument name="path" xsi:type="string" translate="false">contact-us</argument> </arguments> </block> <!-- CMS Page Link Link --> <block class="Magento\Framework\View\Element\Html\Link" name="aboutus.link" after="contactus.link"> <arguments> <argument name="label" xsi:type="string" translate="false">about Us</argument> <argument name="path" xsi:type="string" translate="false">about-us</argument> </arguments> </block> </referenceBlock> </body> </page> |
Once you implement the above code, you are able to redirect users to any CMS page focussed on specific information, with the help of top links.
This is it to adding top links in a Magento 2 store. However, if you face any difficulty in the code, just drop your query in the comments section below and I’ll help you out ?
For the programmatic method to remove the top link, refer our blog toremove top link in Magento 2.
Flash 5 stars if the post is helpful to you ?
Happy Coding ?
Sanjay Jethva
Sanjay is the co-founder and CTO of Meetanshi with hands-on expertise with Magento since 2011. He specializes in complex development, integrations, extensions, and customizations. Sanjay is one the top 50 contributor to the Magento community and is recognized by Adobe.
His passion for Magento 2 and Shopify solutions has made him a trusted source for businesses seeking to optimize their online stores. He loves sharing technical solutions related to Magento 2 & Shopify.
2 Comments
Thank you very much for the information but how can I order the menu I have 6 links but it does not come out in the order I want
For example
my account
My orders
My address
my wish list
compare products
sign out
Hello Jhorck,
Do you want to set in the my account dropdown when the customer gets logged in?
Thank You