1

I've been trying to figure out how to add links to the top navigation for Magento 2.

In 1.x we'd just URL rewrites, however, that doesn't seem to work in Magento 2.x at this point. I added a new category Home. Then, I went to: Marketing > URL Rewrites, and edited the URL rewrite (changing the Redirect Type to 301) and saved it. Next, I clicked Add URL Rewrite, type Custom and used request path of "catalog/category/view/id/23" and target path /. I tried the redirect type as none and 301.

Is this done differently in Magento 2? Or is there another way to add links to the top navigation menu ? My problem is, I don't just need to add one link, I need to add multiple links, and they need to be drop-downs.

  • have you got solution ? – Pawan Aug 5 '17 at 16:40
1

1- Create topmenu.phtml in design/frontend/magento/you_theme/Mageto_Theme/templates/html/topmenu.phtml

<?php
/**
 * Top menu for store
 *
 * @see \Magento\Theme\Block\Html\Topmenu
 */
?>
<?php $columnsLimit = $block->getColumnsLimit() ?: 0; ?>
<?php $_menu = $block->getHtml('level-top', 'submenu', $columnsLimit) ?>

<nav class="navigation" role="navigation">
    <ul data-mage-init='{"menu":{"responsive":true, "expanded":true, "position":{"my":"left top","at":"left bottom"}}}'>
        <?php /* @escapeNotVerified */ echo $_menu; ?>
        something...
    </ul>
</nav>

2- Refresh cache

0

I had the same question and followed this official Magento tutorial:

http://devdocs.magento.com/guides/v2.1/frontend-dev-guide/layouts/layout-practice.html

It gives a good view on how you can achieve what you want.

I ended up with making my own links template to generate a dropdown ([Your_Theme]/Magento_Theme/templates/header/links.phtml):

<?php
/** @var \Magento\Framework\View\Element\Html\Links $this*/

enter preformatted text here

if ($this->getLinks()): ?>

<div class="switcher account switcher-account <?php echo $this->escapeHtml($this->getCssClass()); ?>" data-ui-id="account-switcher" id="switcher-account">
    <strong class="label switcher-label"><span><?php echo __('Account') ?></span></strong>
    <div class="actions dropdown options switcher-options">
        <div class="action toggle switcher-trigger" id="switcher-account-trigger">
            <strong>
                <span><?php echo __('Account') ?></span>
            </strong>
        </div>
        <ul class="dropdown switcher-dropdown"
            data-mage-init='{"dropdownDialog":{
            "appendTo":"#switcher-account > .options",
            "triggerTarget":"#switcher-account-trigger",
            "closeOnMouseLeave": false,
            "triggerClass":"active",
            "parentClass":"active",
            "buttons":null}}'>
            <?php foreach ($this->getLinks() as $link) : ?>
                <?php echo $this->renderLink($link); ?>

            <?php endforeach; ?>
        </ul>
    </div>
</div>

And use it like this (i added this in [Your_Theme]/Magento_Theme/layout/default.xml):

<referenceContainer name="header.panel">
        <block class="Magento\Framework\View\Element\Html\Links" name="header.links" template="Magento_Theme::header/links.phtml"/>
</referenceContainer>

Then i moved every existing link into this one:

<move element="top.links" destination="header.links"/>

Now you can add extra links to that block

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

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