Jump to content
  • Checkout
  • Login
  • Get in touch

osCommerce

The e-commerce.

How to Change CSS Sub-Categories


Guest

Recommended Posts

This is a small guide on how to change the sub-categories to a seperate CSS class/ID or to add extra bits of code in that won't effect the rest of the main categories.

 

This had me stumped for quite a while and couldn't find a lot of help for it so here's a run down of it. I'm certainly not a PHP guy but this is what I've learnt and seems to work.

 

Also every part contains a '$categories_string .= "edit here";' part, the part to edit is in the speechmarks and it's all HTML :)

 

In the file catalog/includes/boxes/categories.php find the following bit of code (it's at the top)

 

function tep_show_category($counter) {
global $tree, $categories_string, $cPath_array;

for ($i=0; $i<$tree[$counter]['level']; $i++) {
  $categories_string .= "  ";
}

$categories_string .= '<a href="';

if ($tree[$counter]['parent'] == 0) {
  $cPath_new = 'cPath=' . $counter;
} else {
  $cPath_new = 'cPath=' . $tree[$counter]['path'];
}

$categories_string .= tep_href_link(FILENAME_DEFAULT, $cPath_new) . '">';

if (isset($cPath_array) && in_array($counter, $cPath_array)) {
  $categories_string .= '<b>';
}

// display category name
$categories_string .= $tree[$counter]['name'];

if (isset($cPath_array) && in_array($counter, $cPath_array)) {
  $categories_string .= '</b>';
}

if (tep_has_category_subcategories($counter)) {
  $categories_string .= '->';
}

$categories_string .= '</a>';

if (SHOW_COUNTS == 'true') {
  $products_in_category = tep_count_products_in_category($counter);
  if ($products_in_category > 0) {
	$categories_string .= ' (' . $products_in_category . ')';
  }
}

$categories_string .= '<br>';

if ($tree[$counter]['next_id'] != false) {
  tep_show_category($tree[$counter]['next_id']);
}
 }
?>

 

All of this effects the sub-categories section of the left column and it works in an order too which is handy. Basically everything before the '// display category name' allows you to place things in front of the sub-category name and everything after this is placed after it.

 

Now lets look at each bit a bit better

 

function tep_show_category($counter) {
global $tree, $categories_string, $cPath_array;

for ($i=0; $i<$tree[$counter]['level']; $i++) {
  $categories_string .= "  ";
}

 

This bit adds in 2 spaces (" " or in HTML " ") so it makes the sub-category seem more indented. If you use CSS classes/ids, heres a good place to add a <div> or <span>

 

$categories_string .= '<a href="';

Fairly self explanatory,opens the link for the sub-category name to link through to the right page, good idea not to touch it.

 

$categories_string .= tep_href_link(FILENAME_DEFAULT, $cPath_new) . '">';

This creates the link location for the sub-category name, good idea not to touch this either.

 

if (isset($cPath_array) && in_array($counter, $cPath_array)) {
  $categories_string .= '<b>';
}

This effects the top category name of all the sub-categories, the default here is that it makes it bold

 

$categories_string .= $tree[$counter]['name'];

This displays the name of the top category and sub-categories, probably not a good idea to touch

 

if (isset($cPath_array) && in_array($counter, $cPath_array)) {
  $categories_string .= '</b>';
}

This is placed at the end of the top category, the default here is closing the bold tag.

 

if (tep_has_category_subcategories($counter)) {
  $categories_string .= '->';
}

This is the symbol used at the end of a main category name to signal that there is sub-categories, the default is -> or '->' in HTML

 

$categories_string .= '</a>';

This closes the link of the sub-category, if your using <div> or <span>, good place to close is at the end, so it would be '</a></div>' for example.

 

$categories_string .= '<br>';

This adds a break at the end of the sub-category link.

 

I'm not telling how to do some of the cool things in CSS for this, but you should be off and running on this now, hope that helped and any questions, please ask away :)

 

Oh and if I have got anything wrong, please please correct me, but making the changes to this has worked for me.

Link to comment
Share on other sites

  • 5 weeks later...
  • 7 months later...

I have in my shop this scructure:

 

 

Categorie
  -Sub Categorie
   -Sub Sub Categorie

 

The problem is, althought I did that structure right in admin, in categories box it appears like this:

 

Categorie
  -Sub Categorie
  -Sub Sub Categorie

 

And that is not the right tree since the Sub Sub Categories should appear "inside" the sub categories.

 

 

Can you help me with this?

 

Thanks in advance

Link to comment
Share on other sites

I have in my shop this scructure:

 

 

Categorie
  -Sub Categorie
   -Sub Sub Categorie

 

The problem is, althought I did that structure right in admin, in categories box it appears like this:

 

Categorie
  -Sub Categorie
  -Sub Sub Categorie

 

And that is not the right tree since the Sub Sub Categories should appear "inside" the sub categories.

 

 

Can you help me with this?

 

Thanks in advance

Can you give a link to your shop? To see this in action?

Link to comment
Share on other sites

  • 1 month later...
  • 2 months later...

Can anybody tell me where the code is that controls the font size of the CURRENT category?

 

I have all my CSS in place, to change the font type and size and color... but can't seem to change the current category font size.

 

Thanks in advance.

 

~jp

Link to comment
Share on other sites

  • 2 months later...

Moleiro,

You have a very good looking site; I like it very much and am trying to make mine very similar to yours. I've been trying to add some buttons or menu items at the top of my site the way you have it on yours but have been unsuccessful. There's one menu tab contrib that I tried to implement but it won't work for me and I couldn't find any body to answer my questions. I'd appreciate it very much if you'd share the code you use to implement those buttons "Inicio", "Novidades", etc.

 

Thanks in advance

Link to comment
Share on other sites

  • 1 month later...
	for ($i=0; $i<$tree[$counter]['level']; $i++) {
  $categories_string .= tep_image(DIR_WS_IMAGES . 'icons/pointer_blue.gif');
}

If I suggest you edit any file(s) make a backup first - I'm not perfect and neither are you.

 

"Given enough impetus a parallelogramatically shaped projectile can egress a circular orifice."

- Me -

 

"Headers already sent" - The definitive help

 

"Cannot redeclare ..." - How to find/fix it

 

SSL Implementation Help

 

Like this post? "Like" it again over there >

Link to comment
Share on other sites

  • 1 year later...

Sorry to bring back and old thread but perhaps my question can help others as well.

 

I succesfully applies the CSS as suggested in the thread, such as <div class="LeftNavBg">, however in my CSS I also have onmouseover, classe, I tried putting <div class="LeftNavBg" onmouseover="this.class='LeftNavMouseOver'"> but it did not work and gave me an error. Im I going about it the wrong way, is it supported or what can anyone suggest?

Link to comment
Share on other sites

Archived

This topic is now archived and is closed to further replies.

×
×
  • Create New...