How do i get a category pulldown menu????

Hi all

What am trying to do is create drop down menus across the top of my site. I want to have some of the category across the top and when scrolled over the drop down to display the subcategories in that category.

I know how to create a drop down menu but i don't know what bit of coding i need to add the the drop down to display the subcategories for that category.

like i said i want about 4 main categories going across the top then when scrolled over the sub categories to display for that category.

the sort of thing am after can be seen on this website

http://www.missguided.co.uk/

so if some one can tell me what bit of coding is needed to extract the sub categories I should then be able to sort it.

Thanks in advance

use following css

/******************************* menu structure *******************************/
.zcwd_menu a, .zcwd_menu a:link, .zcwd_menu a:visited, .zcwd_menu a:hover {
	text-align: left;
	text-decoration: none;
	outline: none;
	letter-spacing: normal;
	word-spacing: normal;
	float:left;
}

.zcwd_menu, .zcwd_menu ul {
	margin: 0;
	padding: 0;
	border: 0;
	list-style-type: none;
	display: block;
	background-image: url('../images/nav_bg.png');
}
.zcwd_menu li {
	margin: 0;
	padding: 0;
	border: 0;
	display: block;
	float: left;
	position: relative;
	z-index: 5;
	background: none;
}
.zcwd_menu li:hover {
	z-index: 10000;
	white-space: normal;
}
.zcwd_menu li li {
	float: none;
}
.zcwd_menu ul {
	visibility: hidden;
	position: absolute;
	z-index: 10;
	left: 0;
	top: 0;
	background: none;
}
.zcwd_menu li:hover>ul {
	visibility: visible;
	top: 100%;
}
.zcwd_menu li li:hover>ul {
	top: 0;
	left: 100%;
}
.zcwd_menu:after, .zcwd_menu ul:after {
	content: ".";
	height: 0;
	display: block;
	visibility: hidden;
	overflow: hidden;
	clear: both;
}
.zcwd_menu, .zcwd_menu ul {
	min-height: 0;
}
.zcwd_menu ul {
	background-image: url(../images/spacer.gif);
	padding: 10px 30px 30px 30px;
	margin: -10px 0 0 -30px;
}
.zcwd_menu ul ul {
	padding: 30px 30px 30px 10px;
	margin: -30px 0 0 -10px;
}
/******************************* menu structure *******************************/

.zcwd_menu {
	padding: 0 0 0 0;
}
.zcwd_nav {
	position: relative;
	height: 29px;
	z-index: 100000;
}
.zcwd_nav .l, .zcwd_nav .r {
	position: absolute;
	z-index: -1;
	top: 0;
	height: 33px;
}
.zcwd_nav .l {
	left: 0;
	right: 0;
}
.zcwd_nav .r {
	right: 0;
	width: 1000px;
	clip: rect(auto, auto, auto, 1000px);
}
/******************************* end Menu *******************************/

/******************************* begin MenuItem *******************************/
.zcwd_menu a {
	position: relative;
	display: block;
	overflow: hidden;
	height: 29px;
	margin-top:2px;
	cursor: pointer;
	text-decoration: none;
}
.zcwd_menu ul li {
	margin:0;
	clear: both;
}
.zcwd_menu a .r, .zcwd_menu a .l {
	position: absolute;
	display: block;
	top: 0;
	z-index: -1;
	height: 87px;
	background-image: url('../images/menuitem.png');
}
.zcwd_menu a .l {
	left: 0;
	right: 0;
}
.zcwd_menu a .r {
	width: 400px;
	right: 0;
	clip: rect(auto, auto, auto, 400px);
}
.zcwd_menu a .t {
	margin-right: 10px;
	margin-left: 10px;
	color: #FFFFFF;
	padding: 0 22px;
	margin: 0 0;
	line-height: 29px;
	text-align: center;
}
.zcwd_menu a:hover .l, .zcwd_menu a:hover .r {
	top: -29px;
}
.zcwd_menu li:hover>a .l, .zcwd_menu li:hover>a .r {
	top: -29px;
}
.zcwd_menu li:hover a .l, .zcwd_menu li:hover a .r {
	top: -29px;
}
.zcwd_menu a:hover .t {
	color: #E7E9E7;
}
.zcwd_menu li:hover a .t {
	color: #E7E9E7;
}
.zcwd_menu li:hover>a .t {
	color: #E7E9E7;
}
.zcwd_menu a.active .l, .zcwd_menu a.active .r {
	top: -58px;
}
.zcwd_menu a.active .t {
	color: #FFFFFF;
	padding: 0 22px;
}
.zcwd_menu a.active .l, .zcwd_menu a.active .r {
	top: -87px;
}
.zcwd_menu a.active .t {
	color: #FFFFFF;
}
/******************************* end MenuItem *******************************/

/******************************* begin MenuSeparator *******************************/


.zcwd_menu .zcwd_menu-li-separator {
	display: block;
	width: 1px;
	height: 29px;
}
.zcwd_nav .zcwd_menu-separator {
	display: block;
	margin:0 auto;
	width: 1px;
	height: 29px;
/*	background-image: url('../images/menuseparator.png');	*/
}
/******************************* end MenuSeparator *******************************/

/******************************* begin MenuSubItem *******************************/
.zcwd_menu ul a {
	display: block;
	text-align: center;
	white-space: nowrap;
	height: 20px;
	width: 260px;
	overflow: hidden;
	line-height: 20px;
	background-image: url('../images/subitem.png');
	background-position: left top;
	background-repeat: repeat-x;
}
.zcwd_menu li ul {
	border-width: 1px;
	border-style: solid;
	border-color: #000;
	margin:0;
	padding:0;
}
.zcwd_nav ul.zcwd_menu ul span, .zcwd_nav ul.zcwd_menu ul span span {
	display: inline;
	float: none;
	margin: inherit;
	padding: inherit;
	background-image: none;
	text-align: inherit;
	text-decoration: inherit;
}
.zcwd_menu ul a, .zcwd_menu ul a:link, .zcwd_menu ul a:visited, .zcwd_menu ul a:hover, .zcwd_menu ul a:active, .zcwd_nav ul.zcwd_menu ul span, .zcwd_nav ul.zcwd_menu ul span span {
	text-align: left;
	text-indent: 12px;
	text-decoration: none;
	line-height: 20px;
	color: #000000;
	margin-right: 10px;
	margin-left: 10px;
	margin:0;
	padding:0;
}
.zcwd_menu ul li a:hover {
	color: #F8F7F1;
	border-color: #8E988B;
	background-position: 0 -20px;
}
.zcwd_menu ul li:hover>a {
	color: #F8F7F1;
	border-color: #8E988B;
	background-position: 0 -20px;
}
.zcwd_nav .zcwd_menu ul li a:hover span, .zcwd_nav .zcwd_menu ul li a:hover span span {
	color: #000000;
}
.zcwd_nav .zcwd_menu ul li:hover>a span, .zcwd_nav .zcwd_menu ul li:hover>a span span {
	color: #000000;
}
/******************************* end MenuSubItem *******************************/

Then edit tpl_modules_categories_tabs.php and save it to your overide template folder i.e. includes/templates/TEMPLATENAME/template

<?php
/**
 * Module Template - categories_tabs with dropdown product menus
 *
 * Template stub used to display categories-tabs output
 *
 * @package templateSystem
 * @copyright Copyright 2003-2005 Zen Cart Development Team
 * @copyright Portions Copyright 2003 osCommerce
 * @license http://www.zen-cart.com/license/2_0.txt GNU Public License V2.0
 * @version $Id: tpl_modules_categories_tabs.php 3395 2006-04-08 21:13:00Z ajeh $
 */
?>
<?php
if (CATEGORIES_TABS_STATUS == '1') 
{

	echo '<ul class="zcwd_menu">';

	$categories_tab_query = "SELECT c.categories_id, cd.categories_name FROM ".TABLE_CATEGORIES." c, ".TABLE_CATEGORIES_DESCRIPTION . " cd WHERE c.categories_id=cd.categories_id AND c.parent_id= '0' AND cd.language_id='" . (int)$_SESSION['languages_id'] . "' AND c.categories_status='1' ORDER BY c.sort_order, cd.categories_name;";
	$categories_tab = $db->Execute($categories_tab_query);

	while (!$categories_tab->EOF) 
	{
	// currently selected category
		echo '<li>';
		echo '<a href="'.zen_href_link(FILENAME_DEFAULT,'cPath=' . (int)$categories_tab->fields['categories_id']).'"><span class="l"></span><span class="r"></span><span class="t">' . "\n"; 
		if((int)$cPath == $categories_tab->fields['categories_id']) 
		 echo ''.$categories_tab->fields['categories_name'].'</span>' . "\n";
		else 
		 echo $categories_tab->fields['categories_name'];

		echo '</a>';
		$subcategories_tab_query="SELECT c.categories_id, cd.categories_name FROM ".TABLE_CATEGORIES." c, ".TABLE_CATEGORIES_DESCRIPTION . " cd WHERE c.categories_id=cd.categories_id AND c.parent_id= '".(int)$categories_tab->fields['categories_id']."' AND cd.language_id='" . (int)$_SESSION['languages_id'] . "' AND c.categories_status='1' ORDER BY c.sort_order, cd.categories_name;";
		$subcategories_tab=$db->Execute($subcategories_tab_query);
		if($subcategories_tab->RecordCount()>0)
		{
			echo '<ul>';
			while (!$subcategories_tab->EOF) 
			{
				$cPath_new=zen_get_path($subcategories_tab->fields['categories_id']);
				$cPath_new=str_replace('=0_', '=', $cPath_new);
				$cPath_new="cPath=".$subcategories_tab->fields['categories_id'];
				echo '<li>'.'<a href="' . zen_href_link(FILENAME_DEFAULT, $cPath_new) . '">'.$subcategories_tab->fields['categories_name'].' -></a></li>' . "\n";
				$subcategories_tab->MoveNext();
			}
			echo '</ul>' . "\n";
		}
		$products_tab_query="SELECT p.`products_id`, pd.`products_name`, pd.`language_id` FROM ".TABLE_PRODUCTS." p, ".TABLE_PRODUCTS_DESCRIPTION." pd WHERE p.`master_categories_id`='".(int)$categories_tab->fields['categories_id']."' AND p.`products_id`=pd.`products_id` AND p.products_status='1' AND pd.`language_id`='".(int)$_SESSION['languages_id']."' ORDER BY p.`products_sort_order`;";
		$products_tab=$db->Execute($products_tab_query);
		if($products_tab->RecordCount()>0)
		{
			echo '<ul>';
			while (!$products_tab->EOF) 
			{	
				$cPath_new=zen_get_path($categories->fields['categories_id']);
				$cPath_new=str_replace('=0_', '=', $cPath_new);
				echo '<li>'.'<a href="'.zen_href_link(zen_get_info_page($products_tab->fields['products_id']),$cPath_new. '&products_id=' . $products_tab->fields['products_id']) . '">'.$products_tab->fields['products_name'].'</a></li>' . "\n";
				$products_tab->MoveNext();
			}
			echo '</ul>' . "\n";
		}
		echo '</li>' . "\n";
		$categories_tab->MoveNext();
	}
	echo '</ul>' . "\n";
}
?>

Then go to Admin >> Configuration >> Layout Settings

Turn On Categories-Tabs Menu

I think that should do it for you, you will need to play around with the CSS to get to look the way you want it to.

Hope this helps.

Hi thanks for your reply, this is no good for me as I do not want all the categories across the top just some of them, also i want other drop down links to be in there like a help one with a drop down to other pages in my shop.

Like i said i know how to create a drop down i just need to know what code do i need to add to the drop down to display the subcategories.

for example if i add this to the drop down menu

<div id="dropmenu1" class="dropmenudiv">
<?php for ($i=0, $n=sizeof($links_list); $i<$n; $i++) { ?>
  <li><?php echo $links_list[$i];?></li>
<?php } ?>
</div>

it displays all the main categories, but what code is needed to display subcategories for that category.

The code I provided will display all top level categories and then it will also display the sub categories as well in a drop down menu

kiddieshop:

The code I provided will display all top level categories and then it will also display the sub categories as well in a drop down menu

I know this but this is no good for what i want, as i do not want to display all my categories across the top, I only want to display some of them, and i want other links to be in there like home, help, contact us.......

Try the category flyout addon as inspiration.

DrByte:

Try the category flyout addon as inspiration.

I have looked at this but i cant find what code extracts the subcategories that's why i opened this thread

anyone help??

Hi, can anyone tell me what bit of coding is needed to add to a file to extract all the subcategories from a particular category.

for example lets say i have 4 different main categories and each one have 3 different subcategories.

what code would be needed to extract the subcategories for each main category. ??? I was thinking i would probably have to include the category number in the coding so it knows what subcategories to extract.

Hope yous understand what it is am asking lol .

I have figured out that the following bit of coding extracts all the main categories

<?php for ($i=0, $n=sizeof($links_list); $i<$n; $i++) { ?>
  <li><?php echo $links_list[$i];?></li>

but am after the subcategories for a specific category.

Please can anyone help
thanks

Hi, can anyone tell me what bit of coding is needed to add to a file to extract all the subcategories from a particular category.
What are you attempting to do with this?
What is your end goal?

kobra:

What are you attempting to do with this?
What is your end goal?

I want to have them in a drop down menu, and be4 anyone says try this mod

http://www.zen-cart.com/index.php?main_page=product_contrib_info&products_id=1448

this is no good for what i want to do, as i do not want all the categories across the top, just some of them and also want other links in there like like help, contact us etc..

can any one help???

this is no good for what i want to do, as i do not want all the categories across the top, just some of them

Hi, can anyone tell me what bit of coding is needed to add to a file to extract all the subcategories from a particular category.
I guess you either changed your mind or mis-posted initially....
At any rate, most use parts of default code and as such get them all and is dynamic so that when added to it captures those also.

There are others that combine what you later state you want but all cats in the free software addons that do not spring board on native cat-tabs display

kobra:

I guess you either changed your mind or mis-posted initially....
At any rate, most use parts of default code and as such get them all and is dynamic so that when added to it captures those also.

There are others that combine what you later state you want but all cats in the free software addons that do not spring board on native cat-tabs display

Think you must have understood what am after..... I want all the subcategories from some of my main categories to show, but i do not want all my main categories across the top of my site.

so lets say i have 10 main categories but i only want 5 of them main categories across the top and when scrolled over the sub categories for that category display as a drop down.

I already no how to do the drop down, i just don't no what coding to use to display the subcategories for that category.

there must be a way of putting some PHP code in there using the main category number that then displays the subcategories for that category, i just dont no how to do this.

hope yous are understanding what it is am asking......

There are two addons that already do similarly:
http://www.zen-cart.com/index.php?main_page=product_contrib_info&products_id=75
http://www.zen-cart.com/index.php?main_page=product_contrib_info&products_id=479

Instead of just saying they won't help because they show all categories, if you study them you'll see the categories_ul_generator class, which shows you exactly how to pull the child categories from each desired top-level category.

This is very confusing....

so lets say i have 10 main categories but i only want 5 of them main categories across the top and when scrolled over the sub categories for that category display as a drop down.

If you only want 5 categories to be shown, then why create 10?

If this is how you want to do it - then why not just hard code it into the header - you will hVe to update it manually of course, but that is probably the fastest way to do it...?

It sounds like it would be very hard to do via the existing database format....

jill8026:

This is very confusing....

If you only want 5 categories to be shown, then why create 10?

If this is how you want to do it - then why not just hard code it into the header - you will hVe to update it manually of course, but that is probably the fastest way to do it...?

It sounds like it would be very hard to do via the existing database format....

because the side box will also be on some pages that will display all the categories, I didnt want to hard code it as it means always updating it when i have new products/ new sub cats and is products sell out etc... but looks like this is the only option

well anyways doesn't look like this is possible, but thanks everyone for your input
;)

DrByte:

There are two addons that already do similarly:
http://www.zen-cart.com/index.php?main_page=product_contrib_info&products_id=75
http://www.zen-cart.com/index.php?main_page=product_contrib_info&products_id=479

Instead of just saying they won't help because they show all categories, if you study them you'll see the categories_ul_generator class, which shows you exactly how to pull the child categories from each desired top-level category.

you say "if you study them you'll see the categories_ul_generator class, which shows you exactly how to pull the child categories from each desired top-level category"

but i have looked at them and can not find what it is i need to add the pull the child categories that is why i opened this thread to see if anyone new what part it is. as i have looked and tried things but nothing worked.

looks like it will have to be hard coded :(

paddy_uk2007:

well anyways doesn't look like this is possible, but thanks everyone for your input
;)

It's very possible ... I even pointed you to two usable tools which can be used as part of the guts to the solution you're after.
I guess it was a waste of my time digging up those links.

paddy_uk2007:

but i have looked at them and can not find what it is i need to add the pull the child categories
it builds a list of all categories and subcategories, starting with the children of "0" which is the very top level category in ZC v1.x.x.
For 4 specific categories that would mean you would just call it 4 times, each time feeding it the category number you want it to return results for.

paddy_uk2007:

but i have looked at them and can not find what it is
But you only remarked on this one....
paddy_uk2007:

I want to have them in a drop down menu, and be4 anyone says try this mod

http://www.zen-cart.com/index.php?ma...oducts_id=1448
Post the ul code you can not figure out & where it came from

DrByte:

it builds a list of all categories and subcategories, starting with the children of "0" which is the very top level category in ZC v1.x.x.
For 4 specific categories that would mean you would just call it 4 times, each time feeding it the category number you want it to return results for.

Thanks i will look into it now and see if i can figure it out, I will post back how i get on ;)