本节不打算翻译,留给自己需要的时候Copy用
Add Home Link with functional active state to Menu Bar (Alternative Method) |
Find the file called top.phtml in app/design/frontend/default/yourtheme/template/catalog/navigation/ and make the following change:
<div class="header-nav-container"> <div class="header-nav"> <h4 class="no-display"><?php echo $this->__('Category Navigation:') ?></h4> <ul id="nav"> <!-- ALTERNATIVE HOME BUTTON HACK --> <li class="home"><a href="<?php echo $this->getUrl('')?>"><?php echo $this->__('Home') ?></a></li> <!-- ALTERNATIVE HOME BUTTON HACK --> <?php foreach ($this->getStoreCategories() as $_category):?> <?php echo $this->drawItem($_category) ?> <?php endforeach ?> </ul> </div> <?php echo $this->getChildHtml('topLeftLinks') ?> </div>
Add the following to the menu.css file in skin/frontend/default/yourtheme/css/. This example is for a CMS home page which uses cms-home class in its body tag.
body.cms-home #nav li.home a { color:#d96708; }
NOTE: The following comments refer to the following methods.
:::: TRIED THIS AND IT ADDS THE LINK, BUT THE ACTIVE STATE DOES NOT FUNCTION CORRECTLY ::::
Special Note to the person(s) responsible for this page. Myself and many others have attempted to use this code snippet to get the result explained with an active state, but have been unable to get the active state to work. The link does work as far as pointing to exsisting cms page or external pages, but the “active” state does not work at all. Page refreshes and all links adjust back to original state.
FOR HOME LINK ONLY ACTIVE STATE I use the following as it’s the simplist way to get the active state working correctly on the home link.
<div class="header-nav-container"> <div class="header-nav"> <h4 class="no-display"><?php echo $this->__('Category Navigation:') ?></h4> <ul id="nav"> <!-- WORKING ACTIVE STATE HOME BUTTON HACK --> <li class="home<?php if (Mage::helper('core/url')->getCurrentUrl() === Mage::helper('core/url')->getHomeUrl()):?> active<?php endif;?>"><a href="<?php echo $this->getUrl('')?>"><?php echo $this->__('Home') ?></a></li> <!-- WORKING ACTIVE STATE HOME BUTTON HACK --> <?php foreach ($this->getStoreCategories() as $_category):?> <?php echo $this->drawItem($_category) ?> <?php endforeach ?> </ul> </div> <?php echo $this->getChildHtml('topLeftLinks') ?> </div>
For the Home link in the menu bar of the main template you can add some code to one of the template files.
Find the file called top.phtml in app/design/frontend/default/default/template/catalog/navigation/ and make the following change:
div class="header-nav-container"> <div class="header-nav"> <h4 class="no-display"><?php echo $this->__('Category Navigation:') ?></h4> <ul id="nav"> <!-- HOME BUTTON HACK --> <?php $_anyActive = false; foreach ($this->getStoreCategories() as $_category) { $_anyActive = $_anyActive || $this->isCategoryActive($_category); } ?> <li class="<?php echo !$_anyActive ? 'active' : '' ?>"><a href="<?php echo $this->getUrl('')?>"><?php echo $this->__('Home') ?></a></li> <!-- HOME BUTTON HACK --> <?php foreach ($this->getStoreCategories(10) as $_category):?> <?php echo $this->drawItem($_category) ?> <?php endforeach ?> </ul> </div> <?php echo $this->getChildHtml('topLeftLinks') ?> </div>
:x:x:x: Tried several on this page. The one directly above worked best. I modified it a little bit to contain a link title. Just paste
<li class="home<?php if (Mage::helper('core/url')->getCurrentUrl() === Mage::helper('core/url')->getHomeUrl()):?> active<?php endif;?>"><a href="<?php echo $this->getUrl('')?>" title="Home">Home</a></li>
just before
<?php echo $_menu; ?>
if you’re using the default theme or a top.phtml that is based on it. :x:x:x:
The correct way to do this is to open the theme/layout/customer.xml file and then modify the section that shows customer links on all pages, to include a link home and also a link to other customer service pages that you have deemed necessary, e.g. ‘returns’ (if you get a lot of those enquiries...).
By way of example, this modified XML file includes a ‘Home’ link and ‘Deliveries’, ‘Returns’ and ‘Contact Us’:
<!-- Default layout, loads most of the pages --> <default> <!-- Mage_Customer --> <reference name="top.links"> <action method="addLink" translate="label title" module="customer"><label>Home</label><url></url><title>Home</title><prepare>true</prepare><urlParams/><position>5</position></action> <action method="addLink" translate="label title" module="customer"><label>My Account</label><url helper="customer/getAccountUrl"/><title>My Account</title><prepare/><urlParams/><position>94</position></action> <action method="addLink" translate="label title" module="customer"><label>Deliveries</label><url>deliveries</url><title>Deliveries</title><prepare>true</prepare><urlParams/><position>95</position></action> <action method="addLink" translate="label title" module="customer"><label>Returns</label><url>returns</url><title>Returns</title><prepare>true</prepare><urlParams/><position>96</position></action> <action method="addLink" translate="label title" module="customer"><label>Contact Us</label><url>contacts</url><title>Contact Us</title><prepare>true</prepare><urlParams/><position>97</position></action> </reference> </default>
This will allow you to add a Home link in the Top Links (My Account | My Wishlist | Etc.) before the My Account.
Find the file called links.phtml in app/design/frontend/default/default/template/page/template/ and make the following change:
<?php $_links = $this->getLinks(); ?> <?php if(count($_links)>0): ?> <div> <ul<?php if($this->getName()): ?>):?> id="<?php echo $this->getName() ?>"<?php endif;?>> <!-- HOME BUTTON HACK --> <li class="first"><a href="<?php echo $this->getUrl('')?>"><?php echo $this->__('Home') ?></a></li> <!-- HOME BUTTON HACK --> <?php foreach($_links as $_link): ?> <li <?php if($_link->getIsLast()): ?> class="last"<?php endif; ?><?php echo $_link->getLiParams() ?>><?php echo $_link->getBeforeText() ?><a href="<?php echo $_link->getUrl() ?>" title="<?php echo $_link->getTitle() ?>" <?php echo $_link->getAParams() ?>><?php echo $_link->getLabel() ?></a><?php echo $_link->getAfterText() ?></li> <?php endforeach; ?> </ul> </div> <?php endif; ?>
NOTE: The if statement in the foreach loop has changed since “Home” will always be first, it wasn’t needed. Also note that the <li> for the “Home” link automatically gets the class “first”.
This allows for space between Home | My Account