Display WooCommerce Latest Products Without a Shortcode

There are many ways to display Woocommerce Latest Products, such as use a shortcode, a wordpress plugin.

One of these shortcodes can be used to display woocommerce recent products like so:

[recent_products per_page="12" columns="4" orderby="date" order="desc"]

The above would output the featured products in a grid.

Display WooCommerce Latest Products Without a Shortcode

Display WooCommerce Latest Products Without a Shortcode

This is great, however, in many cases, you need display the recent products on any post or page without a shortcode or plugin. You can do it after read this tutorial:

You can drop this straight into your code and it should work – it returns four products, arranges the product via date and is bootstrap ready (if you use it):

<section id="recent">
    <h1>Recently Added</h1>
    <ul class="row-fluid">
            $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; ?>
                    <li 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="Placeholder" width="65px" height="115px" />'; ?>
                            <h3><?php the_title(); ?></h3>
                               <span class="price"><?php echo $product->get_price_html(); ?></span>
                        <?php woocommerce_template_loop_add_to_cart( $loop->post, $product ); ?>
                    </li><!-- /span3 -->
        <?php endwhile; ?>
        <?php wp_reset_query(); ?>
    </ul><!-- /row-fluid -->
</section><!-- /recent -->

Let me know your result after use above code. Good luck !

5 1 vote
Article Rating
Notify of
Inline Feedbacks
View all comments
6 years ago

Hi there!

I tried out your Recent Products code on my website but I’ve encountered a small issue. For some reason my site is displaying all my recent products in a single column, as the links for each item take up the entire width of the page. Is there anything I can do to make the products line up in rows of three like I have for my recent blog posts?

Thanks very much in advance!

– Danny

website: http://www.blueberryvintage.com.au/

6 years ago
Reply to  Ricky1990

Hey again!

I tried to add the css code to my theme’s style sheet, but nothing seems to be working. The style.css file in my theme’s directory has a comment that reads “This Document Contains only the Reset CSS Part. For Modifying the looks of the theme, please look into the css/skins/ folder.”

So I have added the code to both the style.css file and the default.css file in the aforementioned folder, unfortunately neither addition has triggered a response when I load the actual page. Is there likely to be something that I have overlooked? I have even tried adding the code to the home.php file, just in case, but still no luck.

Any advice would be greatly appreciated!

Thanks again!

– Danny

4 years ago

what is php code for best seller product ?

4 years ago

Where to add this code ?

3 years ago

Thank you very much for the code. However product are not displaying properly with thesis theme. Is there any solution?

3 years ago

Does it slide ?? If dont what code should I add to make it slide ??

Would love your thoughts, please comment.x