Create a WooCommerce Featured Products Loop of Featured Images

October 13, 2020| 1 comment

Here is a guide on how to create a WooCommerce featured products loop of featured images. The featured product option is chosen from the star column in the WordPress dashboard backend of the WooCommerce products, ‘featured‘ it is a term that belongs to the taxonomy named ‘product_visibility‘.

Woocommerce Featured Product Loop

	<?php
	add_shortcode ('woo_featured_products', 'woo_featured_products' );
	/**
	* Create WooCommerce Image Loop of Featured Products
	* @link https://wordpress.stackexchange.com/questions/195425/display-featured-products-through-custom-loop-in-woocommerce-on-template-page
	*/
	function woo_featured_products() {
	ob_start();

	$meta_query = WC()->query->get_meta_query();
	$tax_query = WC()->query->get_tax_query();

	$tax_query[] = array(
	'taxonomy' => 'product_visibility',
	'field' => 'name',
	'terms' => 'featured',
	'operator' => 'IN',
	);

	$args = array(
	'post_type' => 'product',
	'post_status' => 'publish',
	'ignore_sticky_posts' => 1,
	'posts_per_page' => -1,
	'orderby' => 'date',
	'order' => 'ASC',
	'meta_query' => $meta_query,
	'tax_query' => $tax_query,
	);
	$loop = new WP_Query( $args );

	while ( $loop->have_posts() ) : $loop->the_post();
	?>

	<div>
	<a href="<?php echo get_permalink( $loop->post->ID ) ?>">
	<?php the_post_thumbnail('large'); ?>
	</a>
	</div>

	<?php
	endwhile;

	wp_reset_query();

	return ob_get_clean();
	}

view raw featured-loop.php hosted with ❤ by GitHub

So in the above a shortcode is created; [woo_featured_products] ready to place anywhere on the site, the featured term is set in the taxonomy query and passed into the WP_Query arguments. The loop is output with just the featured image wrapped in the product page link.

This makes adding a featured Product Category unnecessary and makes is easier to change which products are output. You can cap the amount of products output by adjusting the post_per_page value.

1 comment

Bart

4 years ago Reply

Hello Neil,

I would like to add short description and a (custom) translatable button (with link to product) to this featured product shortcode. Button text need to be something like: “More about this product”. Is that possible? Thanks for your help and great blog posts!

Kind Regards,
Bart

Leave your comment (Cancel Reply)

ACF apache archive beaver beaver builder beaver theme beaver themer bootstrap cache category checkout cpt css customizer filter flexbox form genesis header homebrew htaccess iconfonts image javascript jquery loop markup menu mysql php repeater runcloud search filter pro serverpilot shortcode slider taxonomy template twentytwelve ubuntu UI/UX while widget woocommerce wp-cli
Donate
If you found something that helped you out and would like to make a donation, that's great, click below

Create a WooCommerce Featured Products Loop of Featured Images

Related Posts

Related Posts

1 comment

Bart

Leave your comment (Cancel Reply)

Donate