How to add custom link in main menu in Magento 2?

copy file from 

vendor/magento/module-theme/view/frontend/templates/html/topmenu.phtml

and put this file in your theme location

app/design/frontend/Vendor/YourTheme/Magento_Theme/templates/html/topmenu.phtml

Add below <li> structure just after <?php /* @escapeNotVerified */ echo $block->getChildHtml(); ?> line in topmenu.phtml

<li class="level0 level-top ui-menu-item">
    <a href="<?php echo $this->getBaseUrl()."yourlink"; ?>" class="level-top ui-corner-all"  role="menuitem">
        <span><?php echo __("Your Custom Menu")?></span>
    </a>
</li>

Another alternative is to use a new template file via layout xml.

./app/design/frontend/Company/Yourtheme/Magento_Theme/layout/default.xml

<?xml version="1.0"?>
<!--
/**
 * Copyright info.
 */
-->
<page xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:framework:View/Layout/etc/page_configuration.xsd">
    <body>
        <referenceBlock name="catalog.topnav">
            <block name="custom.menu.links" template="Magento_Theme::html/topmenu_custom.phtml"/>
        </referenceBlock>
    </body>
</page>

Then use this template file to create link html.

./app/design/frontend/Company/Yourtheme/Magento_Theme/templates/html/topmenu_custom.phtml

<?php
/** @var \Magento\Framework\View\Element\Template $block */
?>
<li class="level0 level-top ui-menu-item">
    <a href="<?php echo $this->getBaseUrl()."faq"; ?>" class="level-top ui-corner-all"  role="menuitem">
        <span><?= __("FAQ")?></span>
    </a>
</li>
<li class="level0 level-top ui-menu-item">
    <a href="<?php echo $this->getUrl('custom/index/index'); ?>" class="level-top ui-corner-all"  role="menuitem">
        <span><?= __("Custom Designs")?></span>
    </a>
</li>

When you clear the layout and block_html caches, these will show in the menu. Note:

  • This way we won't touch the original topmenu.phtml
  • This will use topmenu.phtml's $block->getChildHtml() to render the output
  • In layout xmls if you ignore the class="" attribute for a block, then \Magento\Framework\View\Element\Template class will be used by default.

Hope that helps

Tags:

Submenu

Magento2

Cms Pages

Link

Topmenu

Recent Posts