Product Loops for WooCommerce 1.7.2

Product Loops for WooCommerce is a specialized tool (primarily a plugin by XforWooCommerce) that allows you to break away from the standard, rigid product grids provided by your WordPress theme.

In WooCommerce, a "Loop" is the technical term for the code that cycles through your database and displays each product (Image, Title, Price, Button) on a shop or category page.

1. Key Capabilities

This plugin replaces the default WooCommerce loop with modern, high-converting designs.

100+ Pre-made Styles: Instantly switch between professional grid, list, or masonry layouts.

Assign Styles by Criteria: You can have a different design for "On Sale" products versus "New Arrivals" or "Featured" items.

Element Visibility: Fine-tune exactly what shows up in the loop (e.g., hide the price for specific categories, show product attributes, or add a "Quick View" button).

Advanced Querying: Beyond just "Recent Products," you can create loops based on specific tags, stock status, or custom metadata.

2. Integration with Page Builders

While the standalone plugin is powerful, "Product Loops" is also a major feature in modern page builders:

Elementor Loop Builder: If you use Elementor Pro, you can use the Loop Grid or Loop Carousel widgets to design a single "card" exactly how you want it (e.g., put the "Add to Cart" button over the image), and Elementor will repeat that design for every product.

WPBakery & Gutenberg: Most "Product Loop" plugins include dedicated blocks or elements for these builders, allowing you to drop a custom-styled loop onto any landing page.

3. Why Use a Custom Loop?

Standard WooCommerce Loop

Custom Product Loop Plugin

Fixed Design: Stuck with whatever your theme provides.

Unlimited Design: Complete control over typography, spacing, and buttons.

Basic Info: Usually just shows Image, Title, and Price.

Rich Data: Show SKU, Weight, Dimensions, or Custom Fields.

Uniformity: Every product looks identical.

Dynamic Styling: Highlight specific products with unique borders or badges.

Standard Loading: Basic pagination.

AJAX Loading: Supports "Infinite Scroll" or "Load More" buttons.

4. Technical Tip: Template Overrides

If you are a developer and don't want to use a plugin, the "Loop" lives in the WooCommerce template file:

wp-content/plugins/woocommerce/templates/content-product.php.

To customize it manually, you should copy this file to your child theme:

your-child-theme/woocommerce/content-product.php and edit the HTML structure there.

Would you like me to show you how to set up an "Infinite Scroll" for your product loops, or do you need help designing a custom product card using the Elementor Loop Builder?