WP Shopp: List Categories and It's Products WordPress
- SOLVED
Hello developers,
I'm looking for a solution to the following problem:
The [[LINK href="https://shopplugin.net/"]]WP Shopp plugin[[/LINK]] provides a Widget that outputs a list of categories and it's children:
<ul>
<li><a href="">Cat 1</a></li>
<li><a href="" class="current">Cat 2</a>
<li><a href="">Sub cat 1</a>
<li><a href="">Sub cat 2</a>
<li><a href="">Sub cat 3</a>
</li>
<li><a href="">Cat 3</a></li>
</ul>
I'm looking for a snippet that outputs a list of categories and the underlying products as children:
<ul>
<li><a href="">Cat 1</a></li>
<li><a href="" class="current">Cat 2</a>
<li><a href="">Product 1</a>
<li><a href="">Product 2</a>
<li><a href="">Product 3</a>
</li>
<li><a href="">Cat 3</a></li>
</ul>
Note that the current class must work when a category is selected! I've added a image as a visual example how it should work. I'm looking forward to your solution(s).
Kind regards,
Melvin
Answers (3)
Jurre Hanema answers:
Hi Melvin,
Maybe this is what you were looking for?
class WPQCatProductsWidget extends WP_Widget
{
function WPQCatProductsWidget()
{
parent::WP_Widget(false,
$name = 'Shopp categories and products',
array(
'description' => 'A list of Shopp categories and their products.'
)
);
}
function widget($args, $options)
{
global $Shopp;
if(!isset($Shopp))
return;
extract($args);
$title = $before_title.$options['title'].$after_title;
// Get categories and products
$menu = '<ul class="shopp-cats-products">';
$current_cat = ($Shopp->Catalog->tag('is-category')) ? $Shopp->Category->tag('id') : 0;
$current_product = ($Shopp->Catalog->tag('is-product')) ? $Shopp->Product->tag('id') : 0;
if($Shopp->Catalog->tag('has-categories'))
{
foreach($Shopp->Catalog->categories as &$cat)
{
$cat_class = ($current_cat && $current_cat == $cat->id) ? ' class="current-category"' : '';
$menu .= '<li'.$cat_class.'><a href="'.$cat->tag('url').'">'.$cat->tag('name').'</a>';
if($cat->tag('has-products'))
{
$menu .= '<ul>';
foreach($cat->products as &$product)
{
$prod_class = ($current_product && $current_product == $product->id) ? ' class="current-product"' : '';
$menu .= '<li'.$prod_class.'><a href="'.$product->tag('url').'">'.$product->tag('name').'</a></li>';
}
$menu .= '</ul>';
}
$menu .= '</li>';
}
}
$menu .= '</ul>';
// Output widget
echo $before_widget.$title.$menu.$after_widget;
}
function update($new_instance, $old_instance)
{
return $new_instance;
}
function form($options)
{
?>
<p>
<label for="<?php echo $this->get_field_id('title'); ?>"><?php _e('Title','Shopp'); ?></label>
<input type="text" name="<?php echo $this->get_field_name('title'); ?>" id="<?php echo $this->get_field_id('title'); ?>" class="widefat" value="<?php echo $options['title']; ?>">
</p>
<?php
}
}
register_widget('WPQCatProductsWidget');
This code registers a new widget that should output the code you need.
- Jurre (& Ollie)
Melvin vd Ven comments:
Hi Jurre,
Amazing! This is exactly where I was looking for. You nailed it again ;-)
One thing only: It shows 1 product under a category at the moment. It should be max 10 or something. Is this possible?
Thanks,
Melvin
Jurre Hanema comments:
What do you mean exactly? Right now, it should display all categories and all products. Do you want to limit this number or does it show only one product per category in your case?
Melvin vd Ven comments:
Hi Jurre,
At the moment It only shows 1 product under a category, so something is going wrong. I have added 2 products under a category in the backend. Example: http://bit.ly/xSpzrU
Jurre Hanema comments:
I think this may happen because the widget is affected by Shopp's pagination settings. Try setting an explicit limit, by replacing this line:
if($cat->tag('has-products'))
with this:
if($cat->tag('has-products', array('limit' => 10)))
Melvin vd Ven comments:
Hi Jurre,
Thank you. That did the trick, it works exactly how it should work now!
Rowela Alzona answers:
Try this hope it works:
<blockquote>
<?php
if (is_category()) {
$this_category = get_category($cat);
}
?>
<?php
if($this_category->category_parent)
$this_category = wp_list_categories('orderby=id&show_count=0&title_li=&use_desc_for_title=1&child_of='.$this_category->category_parent."&echo=0"); else
$this_category = wp_list_categories('orderby=id&show_count=0&title_li=&use_desc_for_title=1&child_of='.$this_category->cat_ID."&echo=0");
if ($this_category) { ?>
<ul>
<?php echo $this_category; ?>
</ul>
<?php } ?>
</blockquote>
Melvin vd Ven comments:
Hi Rowela,
Thanks for posting. Unfortunatly this won't work with WP Shopp categories.
Sébastien | French WordpressDesigner answers:
send me the plugin with the widget
i look at that
maildeseb @ gmail . com
Melvin vd Ven comments:
Heya Sébastien,
Check your e-mail!
Sébastien | French WordpressDesigner comments:
1-create a file seb-categories.php with this content :
<?php
/**
* SebShoppCategoriesWidget class
* A WordPress widget that provides a navigation menu of Shopp categories
*
* @author sébastien french wordpressdesigner
* @version 1.0
* @copyright Ingenesis Limited, 8 June, 2009
* @package shopp
**/
if ( class_exists('WP_Widget') && ! class_exists('SebShoppCategoriesWidget') ) {
class SebShoppCategoriesWidget extends WP_Widget {
function SebShoppCategoriesWidget() {
parent::WP_Widget(false,
$name = __('Shopp Categories by Seb','Shopp'),
array('description' => __('A list of store categories with products, by sebastien french wordpressdesigner','Shopp'))
);
}
function widget($args, $options) {
global $Shopp;
extract($args);
$title = $before_title.$options['title'].$after_title;
unset($options['title']);
$sebshoppcategories = $Shopp->Catalog->categories;
echo $before_widget.$title;
foreach ($sebshoppcategories as $sebshoppcategory) {
echo $sebshoppcategory->name;
$args = array(
"title" => "",
"source" => "category",
"category" => $sebshoppcategory->id,
"limit" => 10,
"order" => "newest",
"product" => ""
);
$content = $Shopp->Catalog->tag('sideproduct',$args);
echo $content;
}
echo $after_widget;
}
function update($new_instance, $old_instance) {
return $new_instance;
}
} // class SebShoppCategoriesWidget
register_widget('SebShoppCategoriesWidget');
}
?>
put this file in /wp-content/plugins/shopp/core/ui/widgets
here /wp-content/plugins/shopp is the file Shopp.php
in this file you have this code
function widgets () {
global $wp_version;
include('core/ui/widgets/account.php');
include('core/ui/widgets/cart.php');
include('core/ui/widgets/categories.php');
include('core/ui/widgets/seb-categories.php');
include('core/ui/widgets/section.php');
include('core/ui/widgets/tagcloud.php');
include('core/ui/widgets/facetedmenu.php');
include('core/ui/widgets/product.php');
include('core/ui/widgets/search.php');
}
as you can see i have add the line : include('core/ui/widgets/seb-categories.php');
do the same thing
put this file in the ftp
and now go to your widget manager.
You have a widget "Shopp Categories by Seb"
This widget display 10 newest products of each category
Melvin vd Ven comments:
Hi Sébastien,
Thank you for the code, it looks really promising. I've uploaded all the files and dragged the widget in the specific widget area, but nothing is happening.
Here's a link to the page where the navigation widget should appear: http://bit.ly/zpregI
I don't get an error or something, so I don't know whats going wrong?
Ps. It doesn't have to be a widget percée, hardcoded can be a solution too if that's easier for you.
Thanks!
Sébastien | French WordpressDesigner comments:
maybe a problem with the copy/paste
i send you the file
Sébastien | French WordpressDesigner comments:
done
Sébastien | French WordpressDesigner comments:
Are you sure you have categories ?
if there is no category, the widget displays nothing
Melvin vd Ven comments:
Hey,
Yes I have 2 categories assigned to two products. I think it had something to do with copy/paste, because now I get the following error:
Parse error: syntax error, unexpected T_IF in /public_html/wp/wp-content/plugins/shopp/core/ui/widgets/seb-categories.php on line 1
Sébastien | French WordpressDesigner comments:
i send another file by mail
Melvin vd Ven comments:
Ah, ignore the error. My bad! It's still not working with the file you have send me though.
Melvin vd Ven comments:
The last file you send me don't work either. Still no errors and no output.
Sébastien | French WordpressDesigner comments:
it's ok on my test site : http://demo3.archiparmentier.com/?page_id=4
Sébastien | French WordpressDesigner comments:
do you use php5 ?
Melvin vd Ven comments:
Yea I'm using php5 and I'm try it locally and it don't work either.
I've found out something strange, but might be useful to solve the problem. When I add the default category widget above yours in the same widget area, your widget suddenly works.
For the record: I'm calling a dynamic sidebar in the shopp/category.php with the following code:
<?php if(shopp('category','hasproducts','load=prices,images')): ?>
<h1 id="Intro">Ontdek<br/> de <span>Norta</span><br/> collectie</h1>
<h2>Onze collecties</h2>
<p>The categories have to show up here...</p>
<nav id="Menu">
<?php dynamic_sidebar('Categorie'); ?>
</nav>
<div id="Producten" class="Clear">
<?php $counter = 0; ?>
<?php while(shopp('category','products')): ?>
<?php $counter = $counter + 1; ?>
<div class="BoxBlock <?php if($counter % 2 == 0) : ?>Last<?php endif; ?>">
<div class="BoxWrap">
<a href="<?php shopp('product','url'); ?>" class="BoxOverlay">
<div class="Wrap"><?php shopp('product','name'); ?></div></a>
<div class="BoxBack">
<?php shopp('product', 'image', 'size=290&fit=width&quality=100'); ?>
</div>
</div>
</div>
<?php endwhile; ?>
<div class="Clear"></div>
<div class="alignright"><?php shopp('category','pagination'); ?></div>
<?php else: ?>
<?php if (!shopp('catalog','is-landing')): ?>
<h3><?php shopp('category','name'); ?></h3>
<p>Er zijn geen producten gevonden.</p>
<?php endif; ?>
</div>
<?php endif; ?>
</div>
Sébastien | French WordpressDesigner comments:
i send you another file
Melvin vd Ven comments:
Nope it still not work. I've found another bug. I've activated TwentyEleven theme and the widget works on the homepage footer, but when I navigate to another page your widget won't show up.
In your demo site it displays on the shop page but not on the homepage. Hope this helps.
Melvin vd Ven comments:
Hi Sébastien,
Very nice, we're almost there. Your widget is working now:
http://bit.ly/zpregI
Only the markup needs some changes. I noticed that you are calling a sideproduct template, but what I need is a list of categories and products:
<ul>
<li><a href="http://www.website.com/linktocategory1/">Cat 1</a></li>
<li><a href="http://www.website.com/linktocategory2/" class="current">Cat 2</a>
<li><a href="http://www.website.com/linktoproduct/">Product 1</a>
<li><a href="http://www.website.com/linktoproduct/">Product 2</a>
<li><a href="http://www.website.com/linktoproduct/">Product 3</a>
</li>
<li><a href="http://www.website.com/linktocategory3/">Cat 3</a>
<li><a href="http://www.website.com/linktoproduct/">Product 4</a>
<li><a href="http://www.website.com/linktoproduct/">Product 5</a>
<li><a href="http://www.website.com/linktoproduct/">Product 6</a>
</li>
</ul>
Cheers!
Sébastien | French WordpressDesigner comments:
:-))
Melvin vd Ven comments:
Hey Sébastien,
Do you have any idea if you can change the output of your custom widget?
Cheer.
Sébastien | French WordpressDesigner comments:
yes you can probably custom the output of the function tag('sideproduct',$args);
Melvin vd Ven comments:
Hi Sébastien,
I know I can edit the output in the sideproduct.php and thats great, but I need the categories to link to it's category page.
When I click on one category it should get a .current class on the category page.
Can you fix this or is this to hard to develop?
Sébastien | French WordpressDesigner comments:
sideproduct.php doesn't exist :-)
i can probably do that but not for 15$ :-)
Melvin vd Ven comments:
I can raise the price a bit if you need some more time, but I need the exact solution as I described earlier. Let me know!
Sébastien | French WordpressDesigner comments:
I think that is a long task.
I have no time.
Melvin vd Ven comments:
Ok, thanks for your help anyway!