Show Latest Woocommerce Products In Your Template

If you want to display some latest products if your Woocommerce store in another template file, add this to achieve just that!

<?php
$args = array(
'post_type' => 'product',
'stock' => 1,
'posts_per_page' => 4,
'orderby' =>'date',
'order' => 'DESC' );
$loop = new WP_Query( $args );
while ( $loop->have_posts() ) : $loop->the_post(); global $product; ?>
<div class="span3">
<a id="id-<?php the_id(); ?>" href="<?php the_permalink(); ?>" title="<?php the_title(); ?>">
<?php if (has_post_thumbnail( $loop->post->ID )) echo get_the_post_thumbnail($loop->post->ID, 'shop_catalog'); else echo '<img src="'.woocommerce_placeholder_img_src().'" alt="My Image Placeholder" width="65px" height="115px" />'; ?>
<h3><?php the_title(); ?></h3>
<span class="price"><?php echo $product->get_price_html(); ?></span>
</a>
<?php woocommerce_template_loop_add_to_cart( $loop->post, $product ); ?>
</div><!-- /span3 -->
<?php endwhile; ?>
<?php wp_reset_query(); ?>

Useful post? Share it

26 comments on “Show Latest Woocommerce Products In Your Template

  1. Hello Phil,

    I want to show the products on my homepage as well as my products page. Should I add this code as a short code to be able to use it?

    I wonder why woocommerce shortcodes don’t work well like [product sku="1"], it shows product image two times and very big.

    Thank you,
    Azadeh

    1. Hi Azadeh,

      The code above shows the products in any PHP template, so could be homepage if you wanted it to. This varies on the theme, so you may have a homepage template or if not (ie, just a page template), you could wrap the above in a conditional statement which only targets the front / home page. More on conditional statements here: http://codex.wordpress.org/Conditional_Tags

      Hope this helps!

    1. You will need to find out how your theme creates grid. My example has a class on the product here:

      <div class="span3">

      …but your theme may vary. Bootstrap for example would most likely be:

      <div class="col-sm-4">

      for example. You can get the products in a grid easy once the correct class has been added for your theme. Hope this helps!

    1. In the args list, you could filter by custom field with set values like this:

      'key' => $custom_field_key_here,
      'value' => $value

      You would need to set the $custom_field_key_here and $value to the field name and desired value of that field.

  2. This was perfect! Just what I needed. Implemented on my site in under 5 minutes. All I had to add was a class and then I could style everything.

  3. I have lots of products in my site but most of them are sold-out. I want to show some of the sold out and hide some of them. How do i write a function for child theme to achieve this. Currently I am using flatsome theme premium.
    Thanks

    1. Hi Shahid. There are a few ways to accomplish this. None are so quick to explain, but you could try adding a custom field value to products to show/hide and wrap the product loop within this check for the custom field value.

  4. How can I make it show some custom field I have in my product? I have this meta I want to show

    woocommerce_wp_select(
    array(
    ‘id’ => ‘_select1’,

Leave a Reply

Your email address will not be published. Required fields are marked *