How to Get and Display Featured Products with Thumbnail in WP e-Commerce Plugin

Advertisement

WP e-Commerce is an e-Commerce plugin provided by Instinct Entertainment, A plugin that provides a WordPress Shopping Cart or all Downloadable products like mp3, pdf and etc, now you can turn your WordPress site into an e-Commerce or Shopping site, WP e-Commerce provided lots of built in widgets that you can drag to show it in your site sidebar like Latest Products Widget, Shopping Cart Widget, Product Specials Widget, Donations Widget, WP-e-Commerce Live Search where you can search products like in Apple site search and it’s amazing isn’t it? And much more, and one thing they forgot is the Featured Products and this time I will share you how to add Featured Products in your e-Commerce site.

In this tutorial we’re going to use shortcode.

Step 1:

Open functions.php in your theme directory or if you don’t have one please create functions.php file.

Step 2:

Copy and paste the PHP snippet below and paste it into yourfunctions.php, this script read all featured products that you’re being stared/featured.


<?php
	add_shortcode( 'featured_products', 'ryans_featured_products' );
	function ryans_featured_products( $atts )
	{
		global $post;
		$sticky = get_option( 'sticky_products' );

		extract(shortcode_atts( array(
			'post_type' => 'wpsc-product',
			'posts_per_page' => -1,
			'post__in' => $sticky,
			'orderby' => 'date',
			'order' => 'DESC',
			'post_status' => 'publish',
		), $atts ) );

		$args = array(
			'post_type' 	  => $post_type,
			'posts_per_page'  => $posts_per_page,
			'post__in'  	  => $post__in,
			'orderby'         => $orderby,
			'order' 	  => $order,
			'post_status'     => $post_status
		);
		$pro_query = new WP_Query( $args );

		?>
		<ul class="featured-list">
			<?php
				if ( $pro_query->have_posts() ) :
					while ( $pro_query->have_posts() ) : $pro_query->the_post(); ?>
						<li>
							<img class="alignleft featured-image" alt="<?php echo wpsc_the_product_title(); ?/>" src="<?php echo wpsc_the_product_thumbnail(get_option('product_image_width'), get_option('product_image_height'),'','single'); ?>" />
							<a href="<?phpthe_permalink() ?>" title="<?phpprintf(__('Permanent Link to %s','rys'), get_the_title()) ?>" rel="bookmark"><?phpthe_title(); ?></a>
						</li><?php
					endwhile;
				endif;

				/* Restore original Post Data */
				wp_reset_postdata();
			?>
		</ul>
		<?php
	}

?>

Want to display product from a category?

Thanks to Nicole Brooke for lettings us know for this solution.


<?php
$my_query = new WP_Query( array( 'post_type' => 'wpsc-product', 'wpsc_product_category'=>'mycategory' ) );
// "wpsc_product_category" is the custom taxonomy in WP Ecommerce plugin
?>

<?php while( $my_query->have_posts() ) : $my_query->the_post();?>
	<a href="<?php echo get_permalink( $product->ID ); ?>" title="<?php echo get_the_title( $product->ID ); ?>"><h2><?php the_title();?></h2>
	<img src="<?php echo wpsc_the_product_thumbnail(get_option('product_image_width'),get_option('product_image_height'),'','single'); ?/>" alt="<?php the_title();?>"/></a>
<?php endwhile; ?>

Confused?

Okay let’s define the functions we’re using above.

  • wpsc_the_product_title(): This will simply display the product title.
  • wpsc_the_product_thumbnail(): This function display the product thumbnail with size parameters.

How to use the shortcode?

To use the shortcode into your post, page or even in widget area just copy and paste this one line of code.


[ featured_products]

To add parameters, e.g. the numbers of post to display, update the code above to this.


[ featured_products posts_per_page=10]
/* where 10 is the number of posts to return. */

See above for more shortcode parameters.

Troubleshooting

If the shortcode didn’t work, visit this page for troubleshooting tips Display Posts in the Sidebar on Specific Category Only – WordPress.

Don’t want to get your hands dirty?

Not a problem, here I provided Featured Products plugin from other developer WP e-Commerce Featured Product.

That’s it, its easy right?

Advertisement