Create a left hand navigation / verticle category in Magento
Using the modern theme to create a menu like http://www.cl-floraldesigns.co.uk

1)
Create vert_nav.phtml in app / design / frontend / default / default / template / catalog / navigation
<div> <div> <div> <h4><?php echo $this->__(‘Categories’) ?></h4> </div> <h4><?php echo $this->__(‘Category Navigation:’) ?></h4> <ul id=”nav_vert”> <?php foreach ($this->getStoreCategories() as $_category): ?> <?php echo $this->drawItem($_category) ?> <?php endforeach ?> </ul> </div> <?php echo $this->getChildHtml(‘topLeftLinks’) ?> </div>
2)
in app / design / frontend / default / modern / layout / catalog.xml
change
<!– Category default layout –>
<catalog_category_default>
<reference name=”root”>
<action method=”setTemplate”><template>page/2columns-left.phtml</template></action> </reference> <reference name=”left”>
<block type=”catalog/navigation” name=”catalog.leftnav” after=”currency” template=”catalog/navigation/left.phtml”/>
<block type=”catalog/navigation” before=”-” name=”catalog.vertnav” template=”catalog/navigation/vert_nav.phtml”/>
…….
3) in skin/frontend/default/modern/css/menu.css
/**********************************************Vertical Nav ****************************************/
#nav_vert { padding:0 20px; font-size:1em; z-index:999; width:180px; background-color: #F6F6F6; }
/************** ALL LEVELS *************/ /* Style consistent throughout all nav levels */
#nav_vert li {
width:200px;
list-style:none;
position:relative;
text-align:left;
background-color: #F6F6F6;
border-bottom-width: thin;
border-bottom-style: solid;
border-bottom-color: #CCCCCC;
}
#nav_vert li.over { z-index:999; }
#nav_vert li.active { z-index:999; } /* to prevent the li separator from showing through on mouseover on li */
#nav_vert a { line-height:1.3em; }
#nav_vert a, #nav_vert a:hover { display:block; text-decoration:none; }
#nav_vert span { display:block; cursor:pointer; color: #000; }
/************ 1ST LEVEL ***************/
#nav_vert li { float:left; background:url(../images/nav_bg.gif) repeat-x 50%; height:30px; margin-right:1px; }
#nav_vert li.active a { color:#4c6a16; }
#nav_vert a {
float:left;
padding:5px 12px 6px 8px;
color:#4c6a16;
font-weight:bold;
font-family:Trebuchet MS;
font-size:13px;}
#nav_vert li.over a, #nav_vert a:hover { color:#CCCCCC; }
/************ 1ST LEVEL RESET ************/
#nav_vert ul li, #nav_vert ul li.active {
float:none;
height:auto;
background:none;
margin:0;
}
#nav_vert ul a, #nav_vert ul a:hover {
float:none;
padding:0;
background:none;
}
#nav_vert ul li a { font-weight:normal !important; }
/************ 2ND LEVEL ***********/
#nav_vert ul {
position: absolute;
width:200px;
margin-left:180px;
top:0px;
left:-10000px;
border:1px solid #666666;
}
/* Show menu */
#nav_vert li.over ul { left:0; }
#nav_vert li.over ul ul { left:-10000px; }
#nav_vert li.over ul li.over ul { left:100px; }
#nav_vert ul li a { background:#FFFFFF/*#ecf3f6*/; }
#nav_vert ul li a:hover { background: #F2F1D2; /*#d5e4eb;*/ }
#nav_vert ul li a span { background:url(../images/nav_divider.gif) repeat-x 0 100%; }
#nav_vert ul li a, #nav_vert ul li a:hover { color:#2f2f2f !important; }
#nav_vert ul span, #nav_vert ul li.last li span { padding:6px 15px 6px 15px; }
#nav_vert ul li.last span { background:none; }
/************ 3RD+ LEVEL ************/
#nav_vert ul ul { top:5px;}
#nav_vert ul ul ul { left:-10000px;}
#nav_vert li.over ul li.over ul ul { left:-10000px;}
#nav_vert li.over ul li.over ul li.over ul { left:100px; }
/* Fix for the IE bug */
#nav_vert iframe {
position: absolute;
left: -1px;
top: 0;
z-index: -1;
filter: progid:DXImageTransform.Microsoft.Alpha(style=0,opacity=0);
}
Display on home page
add
<reference name=”content”> <block type=”catalog/product_new” before=”-” name=”home.catalog.product.new” alias=”product_new” template=”catalog/product/new.phtml” after=”cms_page”>
<action method=”addPriceBlockType”><type>bundle</type><block>bundle/catalog_product_price</block>
<template>bundle/catalog/product/price.phtml</template></action></block>
<block type=”reports/product_viewed” name=”home.reports.product.viewed” alias=”product_viewed” template=”reports/home_product_viewed.phtml” after=”product_new”>
<action method=”addPriceBlockType”><type>bundle</type>
<block>bundle/catalog_product_price</block><template>bundle/catalog/product/price.phtml</template></action></block>
<block type=”reports/product_compared” name=”home.reports.product.compared” template=”reports/home_product_compared.phtml” after=”product_viewed”>
<action method=”addPriceBlockType”><type>bundle</type>
<block>bundle/catalog_product_price</block><template>bundle/catalog/product/price.phtml</template></action></block>
</reference>
<reference name=”left”> <block type=”catalog/navigation” before=”-” name=”catalog.vertnav” template=”catalog/navigation/vert_nav.phtml”/>
<action method=”unsetChild”><alias>right.reports.product.viewed</alias></action>
<action method=”unsetChild”><alias>right.reports.product.compared</alias></action> </reference>
No comments yet.
No trackbacks yet.
Fix missing Layered navigation in Magento
January 25, 2010 - 10:58 pm
Tags: disspeared, e-commerce, layered navigation, Magento, missing
Posted in Magento | No comments
If you find that when you look at your Magento powered e-commerce site and all your layered navigation sub categories have vanished! Don’t panic. Simply log onto your back end System > cache management > Layered Navigation Indices > rebuild now.
hey presto all should be well again.
Fix Invalid Category error in Magento.
January 21, 2010 - 11:46 am
Tags: error, invalid category, Magento
Posted in Magento | No comments
This is a trick error with very little information floating around on it. There are various reasons why it happens but essentially something has caused your default store view to forget what the default category is.
magento may throw up a
Mage::throwException(’Invalid categor…’)
error in the diagnostic info.
The fix is easy. Log into admin which will still be [...]
Dx3webs at Mage Benchmark the Magento hosting benchmark.
January 17, 2010 - 11:04 am
Tags: benchmark, e-commerce, hosting, Magento, speed
Posted in Magento | No comments
Our entry level e-commerce solution using the amazing Magento e-commerce package is currently in 4th place on the Magento benchmark site. At Dx3webs we have configured our hosting environment to ensure that your business is running at optimal speed so all you have to do is to provide the products.
Magento is a powerful e-commerce package [...]
Change Payment method titles in magento
January 1, 2010 - 6:01 pm
Tags: e-commerce, Magento, payment methods
Posted in Magento | No comments
You can call payment methods what ever you like just by changing the title in the Payment method admin section…
Remove side_logo_promo.gif from header in modern theme for Magento
January 1, 2010 - 5:59 pm
Tags: e-commerce, Magento, side_logo_promo.gif
Posted in Magento | No comments
in
/app/design/frontend/default/modern/template/page/html/header.phtml
comment out
<!– <img src=”<?php echo $this->getSkinUrl(‘images/side_logo_promo.gif’) ?>” alt=”” class=”side-logo-promo”/> –>
Magento: Move Related Products to centre column in Modern theme
January 1, 2010 - 12:00 pm
Tags: Magento, modern theme, related products
Posted in Magento | No comments
The modern theme made available by the good folks at Varian for their free e-commerce product Magento is a great template and a good starting point for anyone looking to customise magento for their own look and feel. However, the default layout has the Related products block in the left hand menu which unless you have very long product descriptions can leave the page unbalanced.
Correct Paypal errors in Magento.. double grand total, customer paid double, complete rather than processing.
December 31, 2009 - 7:20 pm
Tags: complete, e-commerce, grand total, Magento, paypal, processing
Posted in Magento | No comments
For reasons know onlyto Varien the last 2 versions of Magento have contained serious Paypal bugs which either create inaccurate accounting errors (seen only by the admin not the customer) or defaults to Order Complete instead of Processing Order.
Create a left hand navigation / verticle category in Magento
December 5, 2009 - 8:00 pm
Tags: e-commerce, left hand, Magento, modern theme, navigation, verticle
Posted in Magento | No comments
Using the modern theme to create a menu like http://www.cl-floraldesigns.co.uk
