WP SITES

2948 Tutorials & 189 Plugins

Custom Product Loop – WooCommerce

This code uses WP_Query to give you the most basic starting point when developing a custom loop for display WooCommerce products in any WordPress theme.

Using a code editor, copy & paste the following PHP code to the end of your child themes functions file or custom functionality plugin and load a single product page on your WooCommerce powered site.

You’ll find a list of 3 products now display after your single product as seen in the following images :

Sample Products Loop

Installation

Copy and paste the PHP code to the end of your child themes functions file.

You can use any WP_Query parameters to control exactly which products are shown in this loop.

Let’s add a custom query argument to control the order in which products are displayed.

The arg we add, consists of a parameter orderby and value rand

The code producing this output on the front end which is 3 products, in random order from any category, in this case, the clothing & shoes categories because we have NOT added an arg to control which category the products come from.

woocommerce-wp_query-orderby-rand

Lets control which category products come from by adding an arg for 1 specific category named clothing.

The arg we add, consists of a parameter product_cat and value clothing. The value we use is the permalink slug for the clothing category.

The code producing this output on the front end which is 3 products, in random order from the clothing category only.

woocommerce-wp_query-product_cat

This tutorial gives you a basic understanding of how to use a new WP_Query to show any products you want in a custom loop using WooCommerce.

Positioning Your Products

The code includes the woocommerce_after_single_product hook which displays your product after the single product. To change this position, change the hook in the function to any other using WooCommerce Hooks

These solutions may also help :