Monday, May 28, 2012

Magento Add Custom links to Top menu

Sometime we don't require to show categry in the top navigation but we require to show our customlinks at the top menu
for example we are taking all footer links to be shown in the top menu where category is showing

How to add footer page links into the header i.e top menu

So first things first login to you admin Backend



1) go to cms and then to Static Blocks >> Add new Block

Title Top Navigation Links
Identifier top_nav_links

Then add this code

<ul id="nav">
<li><a href="{{store url=""}}">Link1</a></li>
<li><a href="{{store url=""}}link1">Link2</a></li>
<li class="last"><a href="{{store url=""}}link3">Link3</a></li>
<li class="last"><a href="{{store url=""}}link4">Link4</a></li>
<li class="last"><a href="{{store url=""}}link5">Link5</a></li>
</ul>

you will also need to create pages to reflect CMS BLOCK links above

go to cms and then to MANAGE PAGES >> ADD NEW PAGE

2)Now go to apps/design/frontend/your_interface/your_theme/layout/page.xml

 after   <block type="core/text_list" name="top.menu" as="topMenu"/>

 add this line
<block type="page/html_nav" name="nav" as="nav" template="page/html/nav.phtml">
                <block type="cms/block" name="top_nav_links">
                    <action method="setBlockId"><block_id>top_nav_links</block_id></action>
               </block>
      </block>

3) Now go to apps/design/frontend/your_interface/your_theme/template/page/html and create one file called
nav.phtml

<div class="header-nav">
<div>
<?php $this->getChildHtml()?> 
<?php if($this->hasSeoLinks()>0):?>
<ul id="nav">
<!--edit this out as these links not needed-->
   <?php foreach($this->getSeoLink() as $item):?>
<li><a href="<?php $item['url'];?>"><?php $item['title'];?></a></li>
<?php endforeach;?>
<!--edit finish-->
</ul>
<script type="text/javascript">decorateList('footer:seo-links')</script>
</div>
<?php endif;?>     
</div>




4) Now create one file in local apps/code/core/Mage/Page/Block/Html
and name as Nav.php

and add the following code
<?php

class Mage_Page_Block_Html_Nav extends Mage_Core_Block_Template

{

    protected $_seolinks; 
    protected function _prepareLayout()
    {
        parent::_prepareLayout();
        $this->initSeoLink();
    }
    public function setCopyright($copyright)
    {
        $this->_copyright = $copyright;
        return $this;
    }
  public function getCopyright()
    {
        if (!$this->_copyright) {
            $this->_copyright = $this->getDesignConfig('page/nav/copyright');
        }
        return $this->_copyright;
    }
    public function getSeoLink()
    {     
        return $this->_seolinks; 
    }
    public function setSeoLink(array $varName)
    {
        $this->_seolinks=$varName;
    }
    public function addSeoLink(array $varName)
    {
        $this->_seolinks[]=$varName;

    }
    public function hasSeoLinks()
    {
        return count($this->_seolinks);
    } 
    public function initSeoLink()
    {
        if(Mage::getStoreConfig('catalog/seo/site_map')){

            $seolink['title']=$this->__('Site Map');

            $seolink['url']=$this->helper('catalog/map')->getCategoryUrl();

            $this->_seolinks[]=$seolink;           

        }
        if(Mage::getStoreConfig('catalog/seo/search_terms')){

            $seolink['title']=$this->__('Search Terms');

            $seolink['url']=$this->helper('catalogSearch/data')->getSearchTermUrl();
            $this->_seolinks[]=$seolink;           
        }   
    }

}?>

5)Now go to in your template/page/html/header.phtml

just comment the line <?php echo getchildhtml('topmenu')?>
and add the new line <?php echo getchildhtml('nav')?>

6) Now last part i.e css
#nav { padding:0 50px; font-size:1.1em; z-index:999;  margin-left:200px;}

that's it now your custom links will be shown in top menu whereas categroy will not come as we have commented the top menu

4 comments:

  1. i am familiar with magento and also wrote some widget for magento as ... You can begin extention development here ... The best resource


    Magento Developer

    ReplyDelete
  2. I think, it is more easy to solve using the extension for work with menu. Try this Menu Manager Pro http://mirasvit.com/magento-extensions/magento-advanced-menu-manager-pro.html

    ReplyDelete
  3. thx alxendar for the extension link....

    ReplyDelete

Thankyou for your Comments

LinkWithin

Blog has moved, searching new blog...