The above image is of top-links. I wanted to add a drop-down for My Account. When the user click or hover on it, My Account should show My account option For example orders.
Magento – How to add dropdown menu
magento-2.1magento2menutoplinks
Related Solutions
Create your extension with it's own layout file and block that adds links to the top menu.
Let's call that Easylife_Locale. You will need the following files:
app/etc/modules/Easylife_Locale.xml - the declaration file
<?xml version="1.0"?>
<config>
<modules>
<Easylife_Locale>
<codePool>local</codePool>
<active>true</active>
<depends>
<Mage_Core />
</depends>
</Easylife_Locale>
</modules>
</config>
app/code/local/Easylife/Locale/etc/config.xml - the configuration file
<?xml version="1.0"?>
<config>
<modules>
<Easylife_Locale>
<version>1.0.0</version>
</Easylife_Locale>
</modules>
<global>
<blocks>
<easylife_locale>
<class>Easylife_Locale_Block</class>
</easylife_locale>
</blocks>
</global>
<frontend>
<layout>
<updates>
<easylife_locale>
<file>easylife_locale.xml</file>
</easylife_locale>
</updates>
</layout>
</frontend>
</config>
app/design/frontend/base/default/layout/easylife_locale.xml - the frontend layout file
<?xml version="1.0"?>
<layout>
<default>
<reference name="top.links">
<block type="easylife_locale/stores" name="stores_links">
<action method="addStoreLinks"></action>
</block>
</reference>
</default>
</layout>
app/code/local/Easylife/Locale/Block/Stores.php - the block that adds the links to the top.
<?php
class Easylife_Locale_Block_Stores extends Mage_Page_Block_Switch {
public function addStoreLinks() {
$parentBlock = $this->getParentBlock();
if ($parentBlock) {
$position = 200; //start position
foreach ($this->getStores() as $store) {
$params = null;
if ($store->getId() == $this->getCurrentStoreId()) {
$params = 'class="current-store"';
//if you want to skip the current store view just uncomment the next line
//continue;
}
//Print the language code (en, fr)
$text = substr(Mage::app()->getLocale()->getLocaleCode(), 0, 2);
//if your want to display the store name comment the line above and uncomment the one below
//$text = $store->getName();
$title = $store->getName();
$parentBlock->addLink($text, $store->getCurrentUrl(), $title, false, array(), $position, null, $params);
$position += 10;
}
}
return $this;
}
}
Clear the cache and try it out.
As mentioned before you can edit your local.xml file. It should be in your theme folder e.g.: app/design/frontend/yourpackage/yourversion/layout/local.xml If it´s not there you can create it. It`s a very good way to edit the layout xml for a theme.
Remove "My Account" for the default handle
<default>
<reference name="top.links">
<action method="removeLinkByUrl">
<url helper="customer/getAccountUrl"/>
</action>
</reference>
</default>
Add "Register" for the logged out handle
<customer_logged_out>
<reference name="top.links">
<action method="addLink" translate="label title">
<label>Register</label>
<url helper="customer/getLogInUrl"/>
<prepare/>
<urlParams/>
</action>
</reference>
</customer_logged_out>
Add "My Account" for the logged in handle
<customer_logged_in>
<reference name="top.links">
<action method="addLink" translate="label title">
<label>Your Account</label>
<url helper="customer/getAccountUrl" />
<prepare/>
<urlParams/>
<liParams>
<id>header-account-link</id>
</liParams>
<aParams/>
<beforeText/>
<afterText/>
</action>
</reference>
</customer_logged_in>
In app/design/frontend/base/default/layout/customer.xml you can find the possible handles and url helper etc.
Best Answer
Create phtml template file
Call block out in XML where you want
Add design into less file
Move your links into dropdown with xml (example: my account link)