Hire a web Developer and Designer to upgrade and boost your online presence with cutting edge Technologies

Monday, October 27, 2025

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.

<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.

No comments:

Post a Comment