Kadence WooCommerce Elementor Pro – Product Loop Template

The latest update to Kadence WooCommerce Elementor Pro plugin adds the ability to customize your product loop layout in your shop archive pages.  Quickly create awesome custom product layouts with the simplicity of Elementor Page builder.

Install Required Plugins

To get started, be sure that you have the required plugins installed on your site.

  1. Download and install Elementor
  2. Download Kadence WooCommerce Elementor
  3. And after purchasing, download Kadence WooCommerce Elementor Pro from My Account
  4. For the pro plugin to work properly, you must have both free and pro installed and active on your site.

If you’re not familiar with Elementor plugin, this tutorial will introduce you and help get you started.

Activate Product Loop

Go to Elementor> Settings, and activate the product loop

[columns] [span4]

Elementor Settings


Enable Product Loop


Create a New Template

Navigate to Products> WooTemplates, and create a new product loop template

Products WooTemplates

Create New Product Loop Template

Name Your Template and Edit With Elementor

Give your template a name, and click on the “Edit with Elementor” button:

Name Loop Template and Edit

Once you’re editing your template, locate the product loop elements under WooCommerce:

Product Loop Elements

Edit your product loop layout. You can make this as simple or as complex as you like. For this example, I’ve just rearranged the regular product loop elements in a simple way:

Custom Product Loop

Once you’re happy with the configuration, navigate to WooCommerce> Template Builder, and assign your new template to Product Loop:

WooCommerce Templates

Assign Loop Template

View your shop archive to verify that you’re happy with the results:

Product Loop Front End