What’s the point of having the chance to “star” some products in your WooCommerce backend, if you can’t really use these featured products properly on the frontend? Yes, you can use a shortcode or a block to return the featured products only… or maybe you want to keep reading for a better (imho) solution!
Highlighting key products can significantly enhance user experience, driving sales by capturing the attention of potential buyers right from the start.
So, if you’re managing a WooCommerce shop, prioritizing featured products can help create a curated shopping experience that emphasizes your best offerings. In this tutorial, I’ll walk you through a simple yet effective code snippet that will help you display featured products first on various pages of your WooCommerce store.
This customization not only boosts visibility for selected items but also encourages shoppers to explore and engage with your inventory. Follow along to optimize your product display and maximize your store’s potential!
PHP Snippet: Display Featured Products First on WooCommerce Shop, Category, Tag, and Search Pages
A few notes before we take a look at the code.
First, the most obvious one – you need to have at least one featured product! Go to “Products” and star the product/s you wish to show first:
If you have many featured products, you can add a backend filter to see them all with this snippet.
Also, this works for “classic” WooCommerce, and it’s not compatible with blocks yet.
Finally, we’ve already seen a way to “sort by featured” in the frontend, but in this case I want to actually show them first in an existing product loop, as long as the products belong to that shop / category / tag / search result page.
/**
* @snippet Featured Products First @ Woo Product Loop
* @how-to businessbloomer.com/woocommerce-customization
* @author Rodolfo Melogli, Business Bloomer
* @compatible WooCommerce 9
* @community https://businessbloomer.com/club/
*/
add_filter( 'posts_orderby', 'bbloomer_woocommerce_sticky_products_first', 9999, 2 );
function bbloomer_woocommerce_sticky_products_first( $order_by, $query ) {
global $wpdb;
if ( ! is_admin() && $query->is_main_query() && is_woocommerce() ) {
$sticky_product_ids = wc_get_featured_product_ids();
$order_by = "FIELD(" . $wpdb->posts . ".ID,'" . implode( "','", $sticky_product_ids ) . "') DESC, " . $order_by;
}
return $order_by;
}
