251 replies to this topic

[php4ever]

kewns1, on May 7 2007, 07:42 AM, said:

ive tired so many times i cant install
this css menu
its a really pain nothing works

www.kewns.co.uk

if you can give any help iwould be gratful thank you

cheers
ste

Honestly I finally got frustrated with it and decided to use a smaller simpler CSS Menu and have my programmer start working on it. I'll post it as a contribution when its done but the idea is to take this MUCH LIGHTER CSS MENU and its cleaner and make it a stand alone that can operate as a menu on any page with dynamic oscommerce data and work in oscommerce too. If it works like I know it will I'll have him then take the menu manager he did for open-realty which is based on the Typo3 menu manager and make it work for osCommerce. Then with an admin based menu management you get to add what code is used for your menu markup.

I'll post more on it today on my blog. I just can't get this contribution to work even on a bare naked fresh install of oscommerce.

~ Jared

[craigf]

Has anyone been able to make custom links to other pages with this contribution?

I would like to link to internal pages like products_new.php and specials.php.

[php4ever]

craigf, on May 14 2007, 06:14 AM, said:

Has anyone been able to make custom links to other pages with this contribution?

I would like to link to internal pages like products_new.php and specials.php.

You know there is a cleaner easier to use menu I have in my snippets DB but My PHP skills are not quite there and if anyone can comprehend the PHP for this CSS menu and alter it for my CSS Menu I know it will work cleaner and faster. This one WILL allow you to add items to custom pages or even custom links.

If anyone can step up and assist I'd be happy to get this rolling.


~ Jared

[radders]

Yes I added custom links. As it was too complicated to mess about with the programming I just did this by creating a second copy of the menu as it indicated in the code. It was a bit tricky to get it working in I.E. but I finally managed it. It went something like this:

in categories_css.php

var menuids=["suckertree1","suckertree2"] //Enter id(s) of SuckerTree UL menus, separated by commas

Then near the bottom of the page for the second menu repeating the code about $info_box_contents, working from the example of the html generated by the original css menu, changing the links to tep_href_link and checking to see if the resulting code was correct.

 $info_box_contents[] = array('text' =>'<div class="suckerdiv"><ul id="suckertree2"><li>........

[heinzsight]

radders, on May 14 2007, 09:56 PM, said:

Yes I added custom links. As it was too complicated to mess about with the programming I just did this by creating a second copy of the menu as it indicated in the code. It was a bit tricky to get it working in I.E. but I finally managed it. It went something like this:

in categories_css.php

var menuids=["suckertree1","suckertree2"] //Enter id(s) of SuckerTree UL menus, separated by commas

Then near the bottom of the page for the second menu repeating the code about $info_box_contents, working from the example of the html generated by the original css menu, changing the links to tep_href_link and checking to see if the resulting code was correct.

 $info_box_contents[] = array('text' =>'<div class="suckerdiv"><ul id="suckertree2"><li>........

Would you be able to post your whole categories_css.php file. I want to do the same thing but can't work out how.

Thanks,

Lyle

[heinzsight]

If javascript is turned off in the browser preferences then this menu doesn't really work. Is there any way to get it to revert back to the original categories box or has someone come up with another solution?

Lyle

[jaberize]

Hi Guys,

Ive searched for several hours but I cant seem to find what I need, Im looking for something very very simple. Most of the drop-down menu's ive seen till now are Categories, Products, etc... what I need is a drop down menu for one of my navigation buttons in oscommerce (I know how that can be done in HTML, but I cant figure it out in PHP) - so a menu similar to the one on top of this page , thus if you put your mouse over 'Community' you would get a list of other links under it.

Any help, or redirection to a contribution would be extremely great & I would be grateful

Thanks

AJ

[heinzsight]

heinzsight, on May 28 2007, 04:09 PM, said:

Would you be able to post your whole categories_css.php file. I want to do the same thing but can't work out how.

Thanks,

Lyle

Thanks David for sending me the file. I have my menu working now and the code is below.

var menuids=["suckertree1","suckertree2","suckertree3"] //Enter id(s) of SuckerTree UL menus, separated by commas

<?php
  $info_box_contents = array();
  $info_box_contents[] = array('text' => BOX_HEADING_CATEGORIES);

//  new infoBoxHeading($info_box_contents, true, false);

  $info_box_contents = array();

  $info_box_contents[] = array('text' => //'<div class="suckerdiv"><ul id="suckertree3"><li><a href='.tep_href_link("index.php").'>Home</a></ul>' .
	'<a ' . tep_image(DIR_WS_IMAGES . 'infobox/Pictures.jpg', 'Galleries') . '</a>'
	. PrintSubMenus( 0, $languages_id, '' ). '<a ' . tep_image(DIR_WS_IMAGES . 'infobox/TravelInfob.jpg', 'Galleries') . '</a>'
	. '<div class="suckerdiv"><ul id="suckertree2"><li><a href='.tep_href_link("Tips.php").'>Travel Tips</a><a href='.tep_href_link("Tips.php").'>Culture</a><a href='.tep_href_link("Tips.php").'>Language</a><a href='.tep_href_link("Tips.php").'>History</a></ul></div>');

  $info_box_contents[] = array('text' => '<div class="suckerdiv"><ul id="suckertree3"><li><a href='.tep_href_link("links.php").'>Links</a><ul><li><a href="http://www.lonelyplanet.com/" target="_blank">Lonely Planet</a></li><li><a href="http://www.danheller.com/" target="_blank">Dan Heller</a></li><li><a href='.tep_href_link("rss.php").'>RSS Feed</a></li></ul>');


//  $info_box_contents[] = array('text' => PrintSubMenus( 0, $languages_id, '' ));
//  $info_box_contents[] = array('align' => 'center',
//							  'text'  => '<a href="' . tep_href_link(FILENAME_ALLPRODS, '', 'NONSSL') . '">' . BOX_INFORMATION_ALLPRODS . '</a>');
//  $info_box_contents[] = array('align' => 'center',
//							   'text'  => '<a href="' . tep_href_link(FILENAME_SPECIALS, '', 'NONSSL') . '">' . BOX_SPECIALS_ALLPRODS . '</a>');
//  $info_box_contents[] = array('align' => 'center',
//							   'text' => '<a href="' . tep_href_link(FILENAME_PRODUCTS_NEW) . '">' . BOX_WHATSNEW_ALLPRODS .'</a>');							   

  new infoBox($info_box_contents);

?>
			</td>
		  </tr>

<!-- MenuConfigategories_eof //-->

As I am using a picture for my header I commented out new infoBoxHeading.

Hopefully it's be helpful to someone.

[Zekk]

how would you get this to work with sts? where would you call it?

[Zekk]

never mind I got it to work I followed the earlier directions,

Edited by Zekk, 21 June 2007, 03:46.

[Kuujiryo]

Hi, I was looking at coolMenu and came across CSS Menu and I decided to choose this one instead.
When I was looking at a store with coolMenu running (http://www.geraeteland.de/shop/catalog/index.php) I noticed that the Subcategory cells had less padding than the main Category cells (go to the link to see what I mean). I was just wondering how that could be done in CSS Menu for each individual subcategory level? Basically I'll be having Categories -> Subcategories -> Sub-subcategories, and I want the Sub-subcategories to be thinner (so there's less chance of stretching the page down)

[Kuujiryo]

Or if that can't be done just resizing all the Subcategories would be fine with me

Edited by Kuujiryo, 30 June 2007, 07:10.

[Kuujiryo]

Anyone?

[Kuujiryo]

Thankyou anyway.

[Kopite]

Is there a tutorial to get this to work with STS?

[Kopite]

Ok, I've got it installed with STS.

However, my left column is 150px. The menu is 200px. I have tried changing some variables in categores_css.php but it has no effect.

Any ideas?

<?php
/*
  $Id: categories.php,v 1.25 2003/07/09 01:13:58 hpdl Exp $

  osCommerce, Open Source E-Commerce Solutions
  http://www.oscommerce.com

  Copyright (c) 2003 osCommerce

  Released under the GNU General Public License
*/
?>
<style type="text/css">

/*Credits: Dynamic Drive CSS Library */
/*URL: http://www.dynamicdrive.com/style/ */

.suckerdiv ul{
margin: 0;
padding: 0;
list-style-type: none;
width: 100%; /* Width of Menu Items */
border-bottom: 1px solid #ccc;
font-family: arial;
font-size: 11px;
}
	
.suckerdiv ul li{
position: relative;
background-color: #eee;
}
	
/*1st level sub menu style */
.suckerdiv ul li ul{
left: 100%; /* Parent menu width - 1*/
position: absolute;
width: 100%; /*sub menu width*/
top: 0;
display: none;
}

/*All subsequent sub menu levels offset */
.suckerdiv ul li ul li ul{ 
left: 100%; /* Parent menu width - 1*/
}

/*All subsequent sub menu levels offset */
.suckerdiv ul li ul li a{ 
left: 100%; /* Parent menu width - 1*/
background-color: #ddd;
}

/*All subsequent sub menu levels offset */
.suckerdiv ul li ul li ul li a{ 
background-color: #bbb;
}

/*All subsequent sub menu levels offset */
.suckerdiv ul li ul li ul li ul li a{ 
background-color: #aaa;
}

/* menu links style */
.suckerdiv ul li a{
display: block;
color: black;
text-decoration: none;
background-color: #eee;
padding: 1px 5px;
border: 1px solid #ccc;
border-bottom: 0;
line-height: 2em;
}

.suckerdiv ul li a:visited{
color: black;
}

.suckerdiv ul li a:hover{
background-color: yellow;
color: black;
text-decoration: none;
}

.suckerdiv ul li ul li a:hover{
background-color: yellow;
color: black;
text-decoration: none;
}

.suckerdiv ul li ul li ul li a:hover{
background-color: yellow;
color: black;
text-decoration: none;
}

/* The main categories with sub-categories */
.suckerdiv .subfolderstyle{
background: url(images/arrow-list.gif) no-repeat center right;
}

/* This one colors the sub-folder with other sub-folders */
.suckerdiv ul li ul .subfolderstyle {
background-color: #ddd;
}

/* This one colors the sub-folder with other sub-folders */
.suckerdiv ul li ul li ul .subfolderstyle {
background-color: #bbb;
}

/* This one colors the sub-folder with other sub-folders */
.suckerdiv ul li ul li ul li ul .subfolderstyle {
background-color: #aaa;
}
	
/* Holly Hack for IE \*/
* html .suckerdiv ul li { float: left; height: 1%; }
* html .suckerdiv ul li a { height: 1%; }
/* End */

</style>

<script type="text/javascript">

//SuckerTree Vertical Menu (Aug 4th, 06)
//By Dynamic Drive: http://www.dynamicdrive.com/style/

var menuids=["suckertree1"] //Enter id(s) of SuckerTree UL menus, separated by commas

function buildsubmenus(){
for (var i=0; i<menuids.length; i++){
  var ultags=document.getElementById(menuids[i]).getElementsByTagName("ul")
	for (var t=0; t<ultags.length; t++){
	ultags[t].parentNode.getElementsByTagName("a")[0].className="subfolderstyle"
	ultags[t].parentNode.onmouseover=function(){
	this.getElementsByTagName("ul")[0].style.display="block"
	}
	ultags[t].parentNode.onmouseout=function(){
	this.getElementsByTagName("ul")[0].style.display="none"
	}
	}
  }
}

if (window.addEventListener)
window.addEventListener("load", buildsubmenus, false)
else if (window.attachEvent)
window.attachEvent("onload", buildsubmenus)

</script>
<?
  function PrintSubMenus( $parentID, $languageID, $start_path ){
	  $returnval = '';
	  if (($start_path == '') && ($parentID > 0)) {
		$start_path = $parentID;
	  } else {
		if ($parentID > 0) $start_path .= "_" . $parentID;
	  }
	  if ($parentID != 0) {
		$returnval .= "<ul>";
	  } else {
		$returnval .= "<div class='suckerdiv'>";
		$returnval .= "<ul id='suckertree1'>";
	  }
	  $categories_query = tep_db_query("select c.categories_id, cd.categories_name, c.parent_id from " . TABLE_CATEGORIES . " c, " . TABLE_CATEGORIES_DESCRIPTION . " cd where c.parent_id = '".$parentID."' and c.categories_id = cd.categories_id and cd.language_id='" . (int)$languageID ."' order by sort_order, cd.categories_name");
	  while ($categories = tep_db_fetch_array($categories_query))  {
		if ($start_path == "") {
		  $grouppath = $categories['categories_id'];
		} else {
		  $grouppath = $start_path . "_" . $categories['categories_id'];
		}
		$cPath_new = 'cPath=' . $grouppath;
		$categories_string = tep_href_link(FILENAME_DEFAULT, $cPath_new);
		$returnval .= "<li><a href='".$categories_string."'>".$categories['categories_name']."</a>";
		if ( tep_has_category_subcategories($categories['categories_id'] ) ) {
		   $returnval .= PrintSubMenus( $categories['categories_id'], $languageID, $start_path );
		}
		$returnval .= "</li>";
	  }
	  $returnval .= "</ul>";
	  if ($parentID == 0) $returnval .= "</div>";
	  return $returnval;
  }
?>
<!-- categories //-->
		  <tr>
			<td>
<?php
  $info_box_contents = array();
  $info_box_contents[] = array('text' => BOX_HEADING_CATEGORIES);

  new infoBoxHeading($info_box_contents, true, false);

  $info_box_contents = array();
  $info_box_contents[] = array('text' => PrintSubMenus( 0, $languages_id, '' ));

  new infoBox($info_box_contents);

?>
			</td>
		  </tr>
<!-- categories_eof //-->

[lenamtl]

Hi,

this menu is very slow to load...for 200 products it's took 7 seconds to load on every page.


I hope other menu will be implemented only few menu are available and they are slow to load.

for now i'll stay with dynamenu

[radders]

That sounds odd. Mine takes less than a second for the complete page load including the menu with more products than that (but I only go down to category level not product level).

[Maverick529]

Hi Guys

some troubles with this css menu few weeks ago, i had to change for the old ms2 menu...
It worked perfectly for a year and troubles appeared suddenty, without code modification...

Now, I get these errors

Warning: Invalid argument supplied for foreach() in /home/Www/xxxxxx/includes/boxes/categories.php on line 243

line 243: foreach($categories_start as $key => $value) {

Warning: Invalid argument supplied for foreach() in /home/Www/xxxxxx/includes/boxes/categories.php on line 251

line 251: foreach ($cat_subs[$parentID] as $v) { //$categories = tep_db_fetch_array($categories_query)

Can't explain this problem... Any ideas?

For information: PHP Version 4.4.6 used

[Kopite]

Is there anyway to make the subcategories apear on the top of this menu ie underneatht he main categories?

Thanks