---
title: "How to Create a WooCommerce Product Comparison Page in Elementor?"
url: https://theplusaddons.com/docs/create-a-woocommerce-product-comparison-page-in-elementor/
date: 2024-07-02
modified: 2026-09-27
lang: en
author: "Aditya Sharma"
description: "A compare button and count are only useful if there's somewhere for the shopper to actually see the side-by-side comparison once they've picked products. Woo Compare's List mode renders that..."
image: https://theplusaddons.com/wp-content/uploads/2024/07/How-to-Add-Animated-Headings-In-Elementor-3-3-1024x565.jpg
word_count: 425
---

# How to Create a WooCommerce Product Comparison Page in Elementor?

## 

- Woo Compare’s List mode renders a side-by-side comparison table, with every product the shopper added and its attributes lined up in rows.
- The Plus Addons for Elementor Pro requires Elementor (free) and WooCommerce to be installed and active, plus at least one published product, before the Woo Compare widget is enabled under The Plus Addons > Widgets.
- The List page shows “Loading...” indefinitely because the admin-ajax.php request returns 403 Forbidden, while Button and Count modes are confirmed working.

A compare button and count are only useful if there's somewhere for the shopper to actually see the side-by-side comparison once they've picked products.

Woo Compare's **List** mode renders that page - a table of every product the shopper added, with their attributes lined up in rows.

For the full settings tour of every Woo Builder widget, see [Woo Builder Settings Overview](https://theplusaddons.com/docs/woo-builder-settings-overview/).

***Requirement - This widget is a part of The Plus Addons for Elementor Pro, make sure it's installed & activated to enjoy all its powers.***

[LIVE WIDGET LINK](https://theplusaddons.com/elementor-builder/woocommerce-builder/?utm_source=tpae&utm_medium=docs&utm_campaign=text)

## Before You Start

- **Prerequisite:** [Elementor](https://wordpress.org/plugins/elementor/) (free) installed and active.- **Prerequisite:** [WooCommerce](https://wordpress.org/plugins/woocommerce/) installed and active, with at least one published product.- **Edition:** all Woo Builder widgets are part of **The Plus Addons for Elementor Pro** - a Pro licence is required.- **Widget to enable:** go to **The Plus Addons > Widgets**, search for **Woo Compare** and turn its toggle on.- A dedicated page (for example "Compare") to place this widget on.

## Steps

- Create (or choose) a page to serve as your comparison page.- Add the **Woo Compare** widget to it.- From **Type**, choose **List**.- Use the **Field** repeater to choose which product attributes/fields appear as rows in the comparison table (for example price, rating, stock status).

![Type dropdown set to List](https://theplusaddons.com/wp-content/uploads/2026/09/woo-builder-type-list.webp)

Once shoppers have added products (for example "Cropped Boxy Hoodie" and "Canvas Tote Bag") using the Button mode elsewhere on the site, this page is meant to render them side by side.

**As currently shipped, it does not.** See Limitations below before building anything that depends on this page working.

![Confirmed defect: the comparison table stuck on Loading...](https://theplusaddons.com/wp-content/uploads/2026/09/woo-builder-comparison-table.webp)

## Settings Overview

| Setting | What it does | Default |
| ------- | ------------ | ------- |
| Type | Must be List to render the comparison table. | Button (change to List) |
| Field (repeater) | Which product attributes appear as comparison rows. | - |

## Limitations

- **Confirmed defect:** the List page never finishes loading - it shows "Loading..." indefinitely. The front-end request to `admin-ajax.php` that fetches the compared items' data returns **403 Forbidden** (confirmed via browser network trace), so the JavaScript that would render the table never receives its data. This happened with two different real items compared, not only in an empty state.- Reported as a product issue. The Button and Count modes (see the linked docs) are not affected and are confirmed working.

## Not verified

So you know exactly what has and has not been checked:

- Whether the 403 is caused by a missing/incorrect AJAX nonce, a security plugin, or a server rule specific to this Docker site - the browser evidence confirms the symptom and its immediate cause (the AJAX call itself), not the underlying reason WordPress rejected it with 403.

## Related Docs

- [How to Add Product Compare in Elementor?](https://theplusaddons.com/docs/add-product-compare-in-elementor/)- [How to Show WooCommerce Product Compare Count in Elementor?](https://theplusaddons.com/docs/show-woocommerce-product-compare-count-in-elementor/)

## Frequently Asked Questions

**Q: Why does the WooCommerce product comparison page stay on Loading... in Elementor?**
A: The List view is currently broken on the comparison page and never finishes loading. The front-end request to admin-ajax.php returns 403 Forbidden, so the JavaScript never gets the product data it needs to build the table. The page content says this was confirmed with two real compared items, not just an empty state, so it is a product issue rather than a setup mistake.

**Q: What should I use if I want shoppers to compare products side by side in Elementor?**
A: The comparison page is meant to use Woo Compare in List mode, because that mode renders the table of products a shopper added. The Plus Addons for Elementor, The Plus Addons, Plus Addons for Elementor, POSIMYTH provides this Woo Builder widget for showing attributes in rows. A practical detail: the page only makes sense if shoppers first add products elsewhere on the site using Button mode.

**Q: Can I build a WooCommerce compare page without Elementor Pro?**
A: This setup depends on The Plus Addons for Elementor Pro. The page states that all Woo Builder widgets are part of the Pro edition, so a Pro licence is required and the widget must be installed and activated. That matters because the comparison page itself is not a standalone feature of Elementor free or WooCommerce alone.

**Q: What product data can I show in the comparison table?**
A: The Field repeater controls which product attributes appear as comparison rows. The page gives examples like price, rating, and stock status, which makes it useful for quick buying decisions instead of forcing shoppers to scan full product pages. If you keep the row list tight, the table stays easier to read when multiple products are compared.

**Q: How do I set up a dedicated compare page for WooCommerce products?**
A: A dedicated page is required so there is somewhere for shoppers to see the side-by-side result after adding products. The setup uses a normal WordPress page as the destination, then adds the Woo Compare widget and sets Type to List. That structure matters because Button mode only collects items, while List mode is what actually renders them.

**Q: Is Button mode enough for product comparison, or do I need List mode too?**
A: Button mode alone is not enough if you want an actual comparison screen. The page says Button and Count modes are confirmed working, but they do not render the side-by-side table. List mode is the piece that should display the compared items, which is why [How to Add Product Compare in Elementor?](https://theplusaddons.com/docs/add-product-compare-in-elementor/) and [How to Show WooCommerce Product Compare Count in Elementor?](https://theplusaddons.com/docs/show-woocommerce-product-compare-count-in-elementor/) matter as supporting pieces rather than replacements.