$30
How to alter WP e-commerce product query to change output?

I need a WP E-commerce ninja to help me here. :)

I'm using the category_query process to list product categories on the home page within some styled boxes I have set up. I'd like to bring in the subcategories as well under each parent category and I can, except the query gives all the subcategories the same styling as the parents and that's not what want - I want to be able to implement separate styling for the subcats.

Here's the code I'm using:

<ul>

   <?php wpsc_start_category_query($category_settings); ?><?php wpsc_start_category_query(array('category_group'=>  get_option('wpsc_default_category'), 'show_thumbnails'=> 1)); ?>

	<li class='latest_product'>

	    <a href="<?php wpsc_print_category_url();?>" title='<?php wpsc_print_category_name();?>'>

	      <?php wpsc_print_category_image(145, 105); ?></a>

		   <div class="product_info">

		      <a href="<?php wpsc_print_category_url();?>"><?php wpsc_print_category_name();?></a>

		       <?php wpsc_print_subcategory("<ul>", "</ul>"); ?>

		  </div>

  </li>

	<?php wpsc_end_category_query(); ?>

</ul>

A quick illustration of the output I want would be this:

<"latest_product" li>

      <parent category group thumbnail>

            <"product_info" div>

                 <parent category name with link>

                      <ul, perhaps with a class name so I can style it>

                           <li>any subcategories for this category</li>

                            <li>any more subcategories for this category</li>

                       </ul>

              </end "product_info div>

 </end "latest_product" li>

Can anyone tell me how to do this? Perhaps what to change in the defined function(s)?

tracyberna | 07/22/10 at 5:14pm | Edit

wp e-commerce

(2) Possible Answers Submitted...

Last edited:
07/29/10
1:57am
Oleg Butuzov says:
are you sure you want to get that?

if yeas just change the code in loop.
- 07/23/10 6:53pm
  
  Oleg Butuzov says:
```
<ul>



   <?php wpsc_start_category_query($category_settings); ?><?php wpsc_start_category_query(array('category_group'=>  get_option('wpsc_default_category'), 'show_thumbnails'=> 1)); ?>



	<li class='latest_product'>



	    <a href="<?php wpsc_print_category_url();?>" title='<?php wpsc_print_category_name();?>'>



	      <?php wpsc_print_category_image(145, 105); ?></a>



		   <div class="product_info">



		      <a href="<?php wpsc_print_category_url();?>"><?php wpsc_print_category_name();?></a>



		       <?php wpsc_print_subcategory("<ul>", "</ul>"); ?>



		  </div>



  </li>



	<?php wpsc_end_category_query(); ?>



</ul>
```
- 07/23/10 6:54pm
  
  Oleg Butuzov says:
  hm bad example...
  
  change </div>
  to </end "product_info div>
  
  to get
  
  </end "product_info div>
- 07/23/10 6:56pm
  
  Oleg Butuzov says:
  but thats code not nice, not validated, not even xml... have no idea why you need it. but just change the code in your loop.
- 07/24/10 2:48am
  
  tracyberna says:
```
have no idea why you need it.
```
  The reason I want it is because the "product_info" div has a Javascript rollup action associated with it. The "latest_product" li creates a square, 145px x 105px box with a picture in it, and just a tiny bit of "product_info" showing at the bottom with the category name in it. When you roll over it "product_info" rises up over the thumbnail with a semi-sheer background and more information.
  
  The extra information I want to show is the subcategories. However, if they all have "latest_product" and "product_info" around them, they're all 145 x 105 boxes (which I have managed to style out) then they ALL have a rollup associated with them. They're all spaced about 100px below each other and roll up and down confusingly with every twitch of the mouse.
  
  I just want one box to roll up, with the main category and then links to the subs in nice neat li's below, all grouped together.
  
  Does that make sense? If it doesn't, after all that verbage you can just go see it in action if you like: http://bit.ly/bfMCde Right now the subs aren't styled so that they even show up - they're too far below the main category to be seen, although in some cases you can see a little bit of their "product_info" background jutting out to the right side of the main one - but they're in the code if you look.
```
change </div>

to </end "product_info div>



to get



</end "product_info div>
```
  Sorry, but that I don't understand that - I can't put
```
</end "product_info div>
```
  in literally, and anyway I tried it just for the heck of it and nothing happened. :-/ Hope I'm not being dense. :-/
- 07/24/10 3:40am
  
  Oleg Butuzov says:
```
<li class='latest_product product<?php post->ID;?>'>
```
- 07/24/10 3:45am
  
  Oleg Butuzov says:
  this ne a bit better. sorry for prevoius
  replace this code
```
<li class='latest_product'>
```
  by this.. (i assume there is exist function wpsc_print_category_id(), if you will get blank screen change it to wpsc_print_category_name())
```
<li class='latest_product <?php wpsc_print_category_id();?>'>
```
  you will get uniq class for your code. so you will have posibility to design it.
- 07/24/10 3:53am
  
  Oleg Butuzov says:
  even better <li class='latest_product category<?php wpsc_print_category_id();?>'>
- 07/29/10 1:57am
  
  tracyberna says:
  Okay, I figured out a decent workaround using this suggestion. Thanks for your help. Oleg. :)
Last edited:
07/23/10
7:17pm
Pippin Williamson says:
Just give a class to the "ul" surrounding your sub category, like this:
```
<?php wpsc_print_subcategory("<ul class="subcats">", "</ul>"); ?>
```
Then style it like this:
```
ul.subcats {



your styles here



}
```
- 07/24/10 2:52am
  
  tracyberna says:
  When I do that, it generally just puts in that ul code along with the "latest_product" and "product_info" code I don't want. As I explained above (and probably should have mentioned initially), "product_info" has a Javascript rollup action associated with it, and if the subcats do too it just kind of creates chaos. I just want one box to roll up with all the info inside.