Forums / Templates, Stylesheets, Page Layout / How to make clicking a category display all its items under the category name??

How to make clicking a category display all its items under the category name??

Views: 6,270

Results 1 to 20 of 45
5 Feb 2013, 11:46 PM
#1
tlyczko avatar

tlyczko

Zen Follower

Join Date:
Dec 2003
Location:
UPstate NY
Posts:
398
Plugin Contributions:
1

How to make clicking a category display all its items under the category name??

Customer wants clicking the category name in the category SIDEBOX to ALSO display list of category ITEMS underneath category name, how can this be done??

E.g. If I have two categories, Books and Shoes, clicking Books should open the category page AND show all the book items for sale underneath Books.

E.g.
CATEGORIES
Books
Socks

becomes

CATEGORIES
Books
For Whom The Bell Tolls
The Great Gatsby
The Godfather
Gone with the Wind
Socks

OR

CATEGORIES
Books
Socks
Argyle
Plaid
Polka Dot

How can this be done??

Thank you, Tom

6 Feb 2013, 12:07 AM
#2
tlyczko avatar

tlyczko

Zen Follower

Join Date:
Dec 2003
Location:
UPstate NY
Posts:
398
Plugin Contributions:
1

Re: How to make clicking a category display all its items under the category name??

Does anyone know how I could modify the "Expanded Category List" sidebox addon for my purpose??

http://www.zen-cart.com/downloads.php?do=file&id=255

I've tried it but it always displays all products in each category and we need to show the list only for the clicked / opened category...

In my example above the example product names are supposed to be indented...

Thank you, Tom

6 Feb 2013, 12:51 AM
#3
gjh42 avatar

gjh42

Black Belt

Join Date:
Jul 2005
Location:
Upstate NY
Posts:
21,876
Plugin Contributions:
8

Re: How to make clicking a category display all its items under the category name??

If we can see it installed, we can tell if it is possible to do with CSS. If that won't work, you would need to do some PHP recoding.

6 Feb 2013, 12:57 AM
#4
tlyczko avatar

tlyczko

Zen Follower

Join Date:
Dec 2003
Location:
UPstate NY
Posts:
398
Plugin Contributions:
1

Re: How to make clicking a category display all its items under the category name??

ZC is presently running on localhost...and clicking the category must toggle on only that category's product list and leave the other categories alone.

Expanded Categories always shows all products in each category, don't want this...

I had an idea, I could try modifying the code in this addon: Click-Show-Hide Category Menu
http://www.zen-cart.com/downloads.php?do=file&id=615

I will look at that one tomorrow -- the description seems to do what I need but the queries would have to be modified to return products instead of subcategories...I will look at it and make a new post asking help with the requisite php modifications...fingers crossed.

Thank you, Tom

6 Feb 2013, 1:11 AM
#5
tlyczko avatar

tlyczko

Zen Follower

Join Date:
Dec 2003
Location:
UPstate NY
Posts:
398
Plugin Contributions:
1

Re: How to make clicking a category display all its items under the category name??

It's categories_ul_generator.php in that addon which I'd like to know how to modify so it returns products per category instead of subcategories per category...anyone know???

I think all I need to do is change this line: var $document_types_list = ' (3) '; // acceptable format example: ' (3, 4, 9, 22, 18) '??????
but I do not know what number to put to have it return products not categories, what do the other possible values return??

class zen_categories_ul_generator {
  var $root_category_id = 0,
      $max_level = 6,
      $data = array(),
      $root_start_string = '',
      $root_end_string = '',
      $parent_start_string = '',
      $parent_end_string = '',
      $parent_group_start_string = '%s<ul>',
      $parent_group_end_string = '%s</ul>',
      $child_start_string = '%s<li>',
      $child_end_string = '%s</li>',
      $spacer_string = '',
      $spacer_multiplier = 1;
  var $document_types_list = ' (3) ';  // acceptable format example: ' (3, 4, 9, 22, 18) '

  function zen_categories_ul_generator() {
    global $languages_id, $db, $request_type;
    $this->server    = ((ENABLE_SSL == true && $request_type == 'SSL') ? HTTPS_SERVER : HTTP_SERVER);
    $this->base_href = ((ENABLE_SSL == true && $request_type == 'SSL') ? DIR_WS_HTTPS_CATALOG : DIR_WS_CATALOG);
    $this->data = array();
    $categories_query = "select c.categories_id, cd.categories_name, c.parent_id from " . TABLE_CATEGORIES . " c, " . TABLE_CATEGORIES_DESCRIPTION . " cd " .
                        "where c.categories_id = cd.categories_id and c.categories_status=1  and cd.language_id = '" . (int)$_SESSION['languages_id']  . "'" .
                        "order by c.parent_id, c.sort_order, cd.categories_name";
    $categories = $db->Execute($categories_query);
    while (!$categories->EOF) {
      $products_in_category = (SHOW_COUNTS == 'true' ? zen_count_products_in_category($categories->fields['categories_id']) : 0);
      $this->data[$categories->fields['parent_id']][$categories->fields['categories_id']] = array('name' => $categories->fields['categories_name'], 'count' => $products_in_category);
      $categories->MoveNext();
    }
// DEBUG: These lines will dump out the array for display and troubleshooting:
// foreach ($this->data as $pkey=>$pvalue) { 
//   foreach ($this->data[$pkey] as $key=>$value) { echo '['.$pkey.']'.$key . '=>' . $value['name'] . '<br>'; }
// }
  }

another related thread but I don't fully understand the code:
http://www.zen-cart.com/showthread.php?194099-Categories-tree-modifications

I just need to query the categories and return products instead of sub-categories, how do I do this??

Thank you, Tom -- please advise if I should start a new thread for the above question...

6 Feb 2013, 1:13 AM
#6
gjh42 avatar

gjh42

Black Belt

Join Date:
Jul 2005
Location:
Upstate NY
Posts:
21,876
Plugin Contributions:
8

Re: How to make clicking a category display all its items under the category name??

I do have a copy of the Expanded Category List (or Category List Box) files, so on looking at them, I see that there is code included in tpl_category_list_box.php to create the classes for tracking the current links, but it is not applied to the output. It would be a simpler matter to do this than to alter another mod which is not designed to handle products.

6 Feb 2013, 1:29 AM
#7
tlyczko avatar

tlyczko

Zen Follower

Join Date:
Dec 2003
Location:
UPstate NY
Posts:
398
Plugin Contributions:
1

Re: How to make clicking a category display all its items under the category name??

gjh42:

I do have a copy of the Expanded Category List (or Category List Box) files, so on looking at them, I see that there is code included in tpl_category_list_box.php to create the classes for tracking the current links, but it is not applied to the output. It would be a simpler matter to do this than to alter another mod which is not designed to handle products.

Would you please offer some guidance upon how to 'applied to the output'?? in this mod?? I read the template code and don't see how/where to do this -- show only products for the current category page, not all category products.

Maybe it is category_list.php to be modified somehow to only get products for the current category page??

I'm not a skilled PHP programmer per se -- my experience is mostly making minor modifications to code, not writing new code from scratch :(

I looked at Expanded Category -- it always shows all products per category, the requirement is to only show the products for the specific category PAGE -- that is if the category page is 1 (Books) show the book products but no other products in any other category, only other categories per se, if the category page is 2 (Socks) show only the sock products under Socks but no other products in any other category...to use the example I started with...

Thank you, Tom

6 Feb 2013, 1:56 AM
#8
gjh42 avatar

gjh42

Black Belt

Join Date:
Jul 2005
Location:
Upstate NY
Posts:
21,876
Plugin Contributions:
8

Re: How to make clicking a category display all its items under the category name??

The $div_class='category-subs-selected'; lines in the file I mentioned create the classname. You would need to add $div_class to the output in the bottom of the file, perhaps like```php
//add content

$content .= $indent.$separator.'<a class="'. $a_class . ' ' . $div_class .'" href="'. $link .'">'. $box_categories_array[$i]['name'] .'</a>'. $count .
'<br />';
It looks like the $div_class code is not smart enough to catch all of the active tree, so that may need modifying.
Once that appears correctly, you can style the links based on class tags like .category-top, .category-subs-selected, etc. and hide the ones you don't want to see.
6 Feb 2013, 2:25 AM
#9
tlyczko avatar

tlyczko

Zen Follower

Join Date:
Dec 2003
Location:
UPstate NY
Posts:
398
Plugin Contributions:
1

Re: How to make clicking a category display all its items under the category name??

Thank you...does this accomplish the desired objective of only showing PRODUCTS per CATEGORY PAGE??
We have no sub-categories, only categories and products, we only want to show the products for the current category page, not all products in all categories...only current category page products...
Meanwhile I will try this tomorrow...
Thank you, Tom

6 Feb 2013, 2:54 AM
#10
gjh42 avatar

gjh42

Black Belt

Join Date:
Jul 2005
Location:
Upstate NY
Posts:
21,876
Plugin Contributions:
8

Re: How to make clicking a category display all its items under the category name??

Because the output list has no actual heirarchical structure, the testing for $div_class will need to be modified to catch all of the products under the active category. Something like this (only good for a one-level category structure)```php
$div_class='';
if ($products_id){
if (($products_id)&&(($box_categories_array[$i]['products_id']==$products_id) or ($box_categories_array[$i]['category_id']==$cPath){
$div_class='category-subs-selected';
}
}else{
if(($current_category_id!=0)&&($box_categories_array[$i]['category_id']==$current_category_id)){
$div_class='category-subs-selected';
}
}

(zen_get_products_category_id($products_id) == $cPath)

You can check for this with a debug line:
echo ' products_cat=' . $box_categories_array[$i]['category_id'];
6 Feb 2013, 6:03 PM
#11
tlyczko avatar

tlyczko

Zen Follower

Join Date:
Dec 2003
Location:
UPstate NY
Posts:
398
Plugin Contributions:
1

Re: How to make clicking a category display all its items under the category name??

That code should work...I will test today...I am thinking the first case show the products, the second case hide the products...I will try to remember to update...

6 Feb 2013, 7:21 PM
#12
tlyczko avatar

tlyczko

Zen Follower

Join Date:
Dec 2003
Location:
UPstate NY
Posts:
398
Plugin Contributions:
1

Re: How to make clicking a category display all its items under the category name??

Upon testing per se I discovered the code you suggest has no effect.

The test must be done on the product links themselves not on the categories links like you suggested.

In other words if the product's categoryID = cPath or some similar test then display

$content .= '<span class="'. $div_class .'">'. 
	$indent.$separator.'<a class="'. $a_class .'" href="'. $link .'">'. $box_categories_array[$i]['name'] .'</a>'. $count .
'</span><br />';

otherwise don't display it...

Can I use the same test as in the other code??

<air code> $div_class = ''; If product's category ID != cPath of the current category page then $div_class = 'hide-this-product'; $content .= '<span class="'. $div_class .'">'. $indent.$separator.'<a class="'. $a_class .'" href="'. $link .'">'. $box_categories_array[$i]['name'] .'</a>'. $count . '</span><br />'; end If </air code>

Thank you, Tom

6 Feb 2013, 7:49 PM
#13
gjh42 avatar

gjh42

Black Belt

Join Date:
Jul 2005
Location:
Upstate NY
Posts:
21,876
Plugin Contributions:
8

Re: How to make clicking a category display all its items under the category name??

I suspected that the category id might not be directly available for products: > If $box_categories_array[$i]['category_id'] is not populated for a product, you will need an alternate test like

(zen_get_products_category_id($products_id) == $cPath) so try this: ```php
$div_class='';
if ($products_id){
if (($products_id)&&(($box_categories_array[$i]['products_id']==$products_id) or (zen_get_products_category_id($products_id) == $cPath))){
$div_class='category-subs-selected';
}
}else{
if(($current_category_id!=0)&&($box_categories_array[$i]['category_id']==$current_category_id)){
$div_class='category-subs-selected';
}
}

6 Feb 2013, 8:04 PM
#14
tlyczko avatar

tlyczko

Zen Follower

Join Date:
Dec 2003
Location:
UPstate NY
Posts:
398
Plugin Contributions:
1

Re: How to make clicking a category display all its items under the category name??

Additional note: I'm not using any of the css classes in the code, I don't need them, I do need that span class to be hidden-desktop or visible-desktop depending on whether the product's cPath matches the current page.

Thank you, Tom

6 Feb 2013, 8:22 PM
#15
gjh42 avatar

gjh42

Black Belt

Join Date:
Jul 2005
Location:
Upstate NY
Posts:
21,876
Plugin Contributions:
8

Re: How to make clicking a category display all its items under the category name??

You do need the CSS classes... to hide the unwanted links. Styling to display: none; allows you to modify the behavior at any time if you want to, whereas hard-coding to delete the non-active items can only be changed by re-editing the PHP file.

6 Feb 2013, 8:22 PM
#16
tlyczko avatar

tlyczko

Zen Follower

Join Date:
Dec 2003
Location:
UPstate NY
Posts:
398
Plugin Contributions:
1

Re: How to make clicking a category display all its items under the category name??

Basically what's happening is this:

Whatever code produces this HTML:

<span class="">   |_  <a class="category-products" href="http://localhost/index.php?main_page=product_info&cPath=&products_id=1"> Adjustable Rowing Rig (ARR) </a> </span>

is NOT getting the $div_class -- nothing is being put in there...

I'll try your suggestion though what would really work properly is for the above span to get a class put into it, the php code says it's supposed to get $div_class and it never does.

Thank you, Tom

6 Feb 2013, 8:26 PM
#17
gjh42 avatar

gjh42

Black Belt

Join Date:
Jul 2005
Location:
Upstate NY
Posts:
21,876
Plugin Contributions:
8

Re: How to make clicking a category display all its items under the category name??

Do you have my code in post #8 implemented, with $div_class?

...'<a class="'. $a_class . ' ' . $div_class .'" href="'...

If so, some debug lines are in order, to output relevant values directly so we can see what they are and adjust tests accordingly.

6 Feb 2013, 8:26 PM
#18
tlyczko avatar

tlyczko

Zen Follower

Join Date:
Dec 2003
Location:
UPstate NY
Posts:
398
Plugin Contributions:
1

Re: How to make clicking a category display all its items under the category name??

tlyczko:

Additional note: I'm not using any of the css classes in the code, I don't need them, I do need that span class to be hidden-desktop or visible-desktop depending on whether the product's cPath matches the current page.

Thank you, Tom

hidden-desktop does set display: none but $div_class is not being applied to the PRODUCTS!!

I need $div_class to be applied to the PRODUCTS not the categories, I don't care about the categories. :)

Thank you, Tom

6 Feb 2013, 9:01 PM
#19
tlyczko avatar

tlyczko

Zen Follower

Join Date:
Dec 2003
Location:
UPstate NY
Posts:
398
Plugin Contributions:
1

Re: How to make clicking a category display all its items under the category name??

gjh42:

Do you have my code in post #8 implemented, with $div_class?

...'<a class="'. $a_class . ' ' . $div_class .'" href="'...

If so, some debug lines are in order, to output relevant values directly so we can see what they are and adjust tests accordingly.

I've done this...but the SPAN is what must get a class for the products to be selectively hidden depending on if the product ID and cPath match up...the empty SPAN is never getting a class with the code you suggested...I made all the proper changes you suggested.

      // 2/6/13 new code to show/hide products
      $div_class='';
      if ($products_id){
          if (($products_id)&&(($box_categories_array[$i]['products_id']==$products_id) or ($box_categories_array[$i]['category_id']==$cPath))){
              $div_class='category-subs-selected';
          }
      }else{
          if(($current_category_id!=0)&&($box_categories_array[$i]['category_id']==$current_category_id)){
              $div_class='category-subs-selected';
          }
      }
<div id="categorylistboxContent" class="sideBoxContent">

<span class="category-subs-selected">
<a class="category-top category-subs-selected" href="http://localhost/index.php?main_page=index&cPath=1">Canoe Accessories</a></span><br>

<span class="">  |_ <a class="category-products " href="http://localhost/index.php?main_page=product_info&cPath=&products_id=1">Adjustable Rowing Rig (ARR)</a></span><br>

<span class="">  |_ <a class="category-products " href="http://localhost/index.php?main_page=product_info&cPath=&products_id=3">Aluminum Clamps (CL)</a></span><br>

<span class="">  |_ <a class="category-products " href="http://localhost/index.php?main_page=product_info&cPath=&products_id=2">Ash Motor Mount (AMM)</a></span><br>

<span class="">  |_ <a class="category-products " href="http://localhost/index.php?main_page=product_info&cPath=&products_id=4">Canvas & Ash Folding Camp Stool (CAST)</a></span><br>

<span class=""><a class="category-top " href="http://localhost/index.php?main_page=index&cPath=2">Canoe Backrests</a></span><br>

<span class="">  |_ <a class="category-products " href="http://localhost/index.php?main_page=product_info&cPath=&products_id=5">test</a></span><br>

<span class=""><a class="category-top " href="http://localhost/index.php?main_page=index&cPath=4">Canoe Yokes & Thwarts</a></span><br>

<span class=""><a class="category-top " href="http://localhost/index.php?main_page=index&cPath=3">Specialty Canoe Seats</a></span><br></div>	

</ul>
</div>

I hope this makes things clearer...I've been trying to figure out how to make the EMPTY SPAN get a class...

	//add content
	$content .= '<span class="'. $div_class .'">'. 
     $indent.$separator.'<a class="'. $a_class . ' ' . $div_class .'" href="'. $link .'">'. $box_categories_array[$i]['name'] .'</a>'. $count .
	'</span><br />';

Thank you, Tom

6 Feb 2013, 9:35 PM
#20
tlyczko avatar

tlyczko

Zen Follower

Join Date:
Dec 2003
Location:
UPstate NY
Posts:
398
Plugin Contributions:
1

Re: How to make clicking a category display all its items under the category name??

I put in this debug code: echo ' products_cat=' . $box_categories_array[$i]['category_id'];
nothing appears for the value regardless where the debug code is place

and the spans never get the $div_class value, I can't figure out why...

Thank you, Tom