Kia Ora All
Ok this is not as easy as One would have liked Advanced
I wanted to put all the footer page links into the top Navigation and move the Original top category
navigation links to the left hand column purely for SEO and user Functionality
see http://www.greenstone.maori.nz I have worked only on Layout will start Graphic Design next
you will also need to create pages to reflect CMS BLOCK links above
GO TO CMS AND THEN TO MANAGE PAGES >> ADD NEW PAGE
Name them as you Like eg About Us Privacy policy etc the key lay in the Identifier and the title (notice in the block above)
you do not have to create a page for the home Link
Ok this has now created another Block which we will attempt to put it into the header
this is complex so try to hang in there its worth it
Now go to apps/design/frontend/your_interface/your_theme/layout/page.xml
Now go to apps/design/frontend/your_interface/your_theme/template/page/html/
Create a new file called nav.phtml
Add this code
<?php /** * Magento * * NOTICE OF LICENSE * * This source file is subject to the Open Software License (OSL 3.0) * that is bundled with this package in the file LICENSE.txt. * It is also available through the world-wide-web at this URL: * http://opensource.org/licenses/osl-3.0.php * If you did not receive a copy of the license and are unable to * obtain it through the world-wide-web, please send an email * to license@magentocommerce.com so we can send you a copy immediately. * * @category design_default * @package Mage * @copyright Copyright (c) 2004-2007 Irubin Consulting Inc. DBA Varien (http://www.varien.com) * @license http://opensource.org/licenses/osl-3.0.php Open Software License (OSL 3.0) */ ?>
<div> <?=$this->getChildHtml()?> <?if($this->hasSeoLinks()>0):?> <ul id="nav"> <!--edit this out as these links not needed--> <!-- <?foreach($this->getSeoLink() as $item):?> <li><a href="<?=$item['url'];?>"><?=$item['title'];?></a></li> <?endforeach;?>--> <!--edit finish-->
now this is the bit that did my head and 40 hours later this is what I learnt
that the CMS Blocks are controlled thru
apps/code/core/Mage/Page/Block/Html
CREATE A new file in the block folder called Nav.php {note you must use a capital N IN Nav.php}
and paste the following code into it
<?php /** * Magento * * NOTICE OF LICENSE * * This source file is subject to the Open Software License (OSL 3.0) * that is bundled with this package in the file LICENSE.txt. * It is also available through the world-wide-web at this URL: * http://opensource.org/licenses/osl-3.0.php * If you did not receive a copy of the license and are unable to * obtain it through the world-wide-web, please send an email * to license@magentocommerce.com so we can send you a copy immediately. * * @category Mage * @package Mage_Page * @copyright Copyright (c) 2004-2007 Irubin Consulting Inc. DBA Varien (http://www.varien.com) * @license http://opensource.org/licenses/osl-3.0.php Open Software License (OSL 3.0) */
/** * Html page block * * @category Mage * @package Mage_Page */ class Mage_Page_Block_Html_Nav extends Mage_Core_Block_Template /* this needs to reflect the new name of the block file so for me Nav*/ { 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; } } }
Now go to in your template/page/html/header.phtml
these lines of Code reside at the bottom of the header.phtml file
Comment out the following line
<!--<?=$this->getChildHtml('topMenu')?> adds links into the top header-->
Add this new
line <?=$this->getChildHtml('nav')?></code>
<?php /** * Magento * * NOTICE OF LICENSE * * This source file is subject to the Open Software License (OSL 3.0) * that is bundled with this package in the file LICENSE.txt. * It is also available through the world-wide-web at this URL: * http://opensource.org/licenses/osl-3.0.php * If you did not receive a copy of the license and are unable to * obtain it through the world-wide-web, please send an email * to license@magentocommerce.com so we can send you a copy immediately. * * @category design_default * @package Mage * @copyright Copyright (c) 2004-2007 Irubin Consulting Inc. DBA Varien (http://www.varien.com) * @license http://opensource.org/licenses/osl-3.0.php Open Software License (OSL 3.0) */ ?>
<div class="header-top-container">
<div class="header-top"> <h1 id="logo"><a href="<?=$this->getUrl('')?>"><img src="<?=$this->getLogoSrc()?>" alt="<?=$this->getLogoAlt()?>"/></a></h1> <p class="no-show"><a href="#main"><strong><?=$this->__('Skip to Main Content')?> »</strong></a></p>
/** * Magento * * NOTICE OF LICENSE * * This source file is subject to the Open Software License (OSL 3.0) * that is bundled with this package in the file LICENSE.txt. * It is also available through the world-wide-web at this URL: * http://opensource.org/licenses/osl-3.0.php * If you did not receive a copy of the license and are unable to * obtain it through the world-wide-web, please send an email * to license@magentocommerce.com so we can send you a copy immediately. * * @copyright Copyright (c) 2004-2007 Irubin Consulting Inc. DBA Varien (http://www.varien.com) * @license http://opensource.org/licenses/osl-3.0.php Open Software License (OSL 3.0) */
/************** ALL LEVELS *************/ /* Style consistent throughout all nav levels */ #nav li { list-style:none; position:relative; text-align:left; } #nav li.over { z-index:99; } #nav li.active { z-index:999; } /* to prevent the li separator from showing through on mouseover on li */ #nav a { line-height:1.3em; width:} #nav a, #nav a:hover { display:block; text-decoration:none; } #nav span { display:block; cursor:pointer; }
/************ 1ST LEVEL ***************/ #nav li { float:left; } #nav li.active a { color:#d96708; } #nav a { float:left; padding:5px 12px 6px 8px; color:#A7C6DD; font-weight:bold; } #nav li.over a, #nav a:hover { color:#d96708; }
/************ 1ST LEVEL RESET ************/ #nav ul li, #nav ul li.active { float:none; height:auto; background:none; margin:0; } #nav ul a, #nav ul a:hover { float:none; padding:0; background:none; } #nav ul li a { font-weight:normal !important; }
/* Show menu */ #nav li.over ul { left:0; } #nav li.over ul ul { left:-10000px; } #nav li.over ul li.over ul { left:100px; }
#nav ul li a { background:#ecf3f6; } #nav ul li a:hover { background:#d5e4eb; } #nav ul li a span { background:url(../images/nav_divider.gif) repeat-x 0 100%; } #nav ul li a, #nav ul li a:hover { color:#2f2f2f !important; } #nav ul span, #nav ul li.last li span { padding:3px 15px 4px 15px;} #nav ul li.last span { background:none; }
/************ 3RD+ LEVEL ************/
#nav ul ul { top:5px; } #nav ul ul ul { left:-10000px; } #nav li.over ul li.over ul ul { left:-10000px; } #nav li.over ul li.over ul li.over ul { left:100px; }
Thanks for your time and effort in posting your findings! I’ve got a question to follow up with though.
This allows full control of the main navigation as a static block, right? So that requires anyone to go in and add a link to a product category (and or sublevel) each time they want to change the product categories...correct?
Would there be a way to allow product categories to automatically be updated (as Magento natively allows) while still adding links to the right of the product categories via a static block (in the main nav)?
Quick question, essentially this makes it so the top Nav is a static block. This is really useful, but does anyone know how to code it so if you redo the Nav Bar as a static block, it will still retain the ability to “sense” what page is being displayed, and “highlight” the nav correctly?
I’m trying to get this menu right underneath the “My Account | My Wishlist” menu.... I uncommented the part of the header which was for the regular category nav and moved the new get child line into the header itself. But my menu items don’t show!
