NB: Make sure you do a back up of your theme, files and database before attempting the tutorials
Last modified : Sep 06 2022
Estimated reading time : 1 minute, 16 seconds - 110 words
Share the post "Display WooCommerce Products"
This tutorial will show you how to display your featured WooCommerce products with a query.
It is a simply query, however however our arguments we need to fetch the WooCommerce product post type. The ‘meta_key’ &=> ‘_featured’ will return featured products. We will also have the WooCommerce pagination hook.
With our first argument, we will create a variable that will store the product ID:
$id = $product->id;. This will allow use to fetch the product ID within the add_to_cart WooCommerce shortcode:
<?php echo do_shortcode('[add_to_cart id="'.$id.'"]'); ?>You can stylized your products as you see fit via the CSS files.
Display WooCommerce Products
<div class="woocommerce columns-3"> <ul class="products"> <?php $id = $product->id; $args = array( 'post_type' => 'product', 'meta_key' => '_featured', 'posts_per_page' => 3, 'columns' => '3', 'meta_value' => 'yes' ); $loop = new WP_Query( $args ); while ( $loop->have_posts() ) : $loop->the_post(); global $product; ?> <li class="product"></li> <?php endwhile; ?> <?php wp_reset_postdata(); ?> </ul> </div>
You can implement it in any template you want.