If you are looking for an effective way to create a WooCommerce shortcode for random products to display the products from the WooCommerce database in a random way, this post will guide you and help you create the shortcode for the random products display.

In the previous post, I shared how you can create the random WooCommerce products query and how to use it in the custom page template.

I also created a random WooCommerce products display demo that showcases the random products when the browser is refreshed.

If you missed that post you can check it out here – How to Create WooCommerce Random Products Display.

Now we can take this code snippet shared in that article to the next level and create a shortcode that will be used to display the random products.

First, you need to remember how to create a WordPress shortcode as I explained in the tutorial – how to create WordPress shortcode and the other tutorial on how to use WordPress shortcode.

Table of Contents

1 WooCommerce Shortcode Random Products
- 1.1 Conclusion
- 1.2 Similar Articles

WooCommerce Shortcode Random Products

To create the shortcode we can use the following code that allows us to add a shortcode in WordPress :

[php]
// Shortcode Callback function
function display_random_products_shortcode() {

}
// register shortcode
add_shortcode(‘display_random_products_woocommerce’, ‘display_random_products_shortcode’);

[/php]

This code helps us to create the shortcode that we will use to display the random products. Now we can use the code I shared in the previous tutorial but in this case, we do not need to add the custom page template code.

We only need the following code that we can use along with the shortcode created above to display the random products using the shortcode.

The following is the code you should return in the shortcode and this should work.

[php]
$args = array(
‘post_type’ => ‘product’,
‘posts_per_page’ => 4,
‘orderby’ => ‘rand’,
);?>
<div class="test-loop">
<?php

$loop = new WP_Query( $args );
while ( $loop->have_posts() ) : $loop->the_post();
global $product;
?>

<div class="test-loop-item">
<a href="<?php the_permalink(); ?>" id="id-<?php the_id(); ?>" 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="product placeholder Image" width="65px" height="115px" />’; ?>

<?php
endwhile;
wp_reset_query(); ?>

</div>

[/php]

Conclusion

In this post, we have looked at how to create a shortcode that displays random WooCommerce products. There are two steps involved in creating the shortcode and the second step is to get the data from the WordPress database and display it after looping through. If you need a custom solution to display WooCommerce products, I have several other solutions I have created and I would be glad to help you. Feel free to reach out for further assistance.

Joe

Joe is an experienced full-stack web developer with a decade of industry experience in the LAMP & MERN stacks, WordPress, WooCommerce, and JavaScript – (diverse portfolio). He has a passion for creating elegant and user-friendly solutions and thrives in collaborative environments. In his spare time, he enjoys exploring new tech trends, tinkering with new tools, and contributing to open-source projects. You can hire me here for your next project.

WooCommerce Shortcode Random Products

Conclusion

Similar Articles