---
title: "How to Add Product Compare Button for WooCommerce Products in Elementor?"
url: https://theplusaddons.com/docs/add-product-compare-button-for-woocommerce-products-in-elementor/
date: 2023-08-08
modified: 2026-09-28
lang: en
author: "Aditya Sharma"
description: "Do you want shoppers to compare products side by side — specs, prices, features — before they choose? The Woo Product Listing widget in The Plus Addons for Elementor can..."
image: https://theplusaddons.com/wp-content/uploads/2023/08/How-to-Add-Product-Compare-Button-for-WooCommerce-Products-in-Elementor_-1024x536.jpg
word_count: 262
---

# How to Add Product Compare Button for WooCommerce Products in Elementor?

## 

- The Woo Product Listing widget in The Plus Addons for Elementor Pro shows the YITH WooCommerce Compare button on product cards when Display YITH Buttons is enabled in Content > Extra Options.
- Compare switches on under the Woo Product Listing widget and adds a compare button on each product, letting shoppers pick products and open the comparison table in YITH.
- The setup requires WooCommerce installed and active, YITH WooCommerce Compare installed and active, and the Woo Product Listing widget enabled under ThePlus Settings > Widgets.

Do you want shoppers to compare products side by side — specs, prices, features — before they choose?

The Woo Product Listing widget in The Plus Addons for Elementor can show the YITH WooCommerce Compare button on its cards.

*To check the complete feature overview documentation of The Plus Addons for Elementor Product Listing widget, [click here](https://theplusaddons.com/docs/product-listing-widget-settings-overview/).*

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

[LIVE WIDGET LINK](https://theplusaddons.com/elementor-listing/?utm_source=tpae&utm_medium=docs&utm_campaign=text#woo-products-wgts)

## Before You Start

- **Edition:** **Pro** — the Woo Product Listing widget is part of The Plus Addons for Elementor Pro. It does not appear in the widget panel of the free plugin.- **WooCommerce** installed and active, with some published products.- **YITH WooCommerce Compare** installed and active.- **Widget to enable:** Woo Product Listing, switched on under **ThePlus Settings > Widgets**.

https://www.youtube.com/watch?v=HhyyVmu16oU

## Step 1: Turn on the YITH buttons

Add the **Woo Product Listing** widget. In **Content > Extra Options**, switch on **Display YITH Buttons**.

## Step 2: Turn on Compare

Switch on **Compare** underneath. A compare button appears on each product; shoppers pick products and YITH opens the comparison table.

![The Compare switch under Display YITH Buttons](https://theplusaddons.com/wp-content/uploads/2026/09/tp-product-listout-compare-wide-yith.webp)

## Limitations

- **Needs YITH WooCommerce Compare.** The comparison table and its settings come from YITH.- **Pro only.** The Woo Product Listing widget is not in the free plugin.

## Troubleshooting

### No compare button appears

Check YITH WooCommerce Compare is active and both **Display YITH Buttons** and **Compare** are on. Some styles show it on hover.

## Related Docs

- [Woo Product Listing widget: settings overview](https://theplusaddons.com/docs/product-listing-widget-settings-overview/) — every control in the widget.- [Add a wishlist button](https://theplusaddons.com/docs/add-wishlist-button-for-woocommerce-products-in-elementor/)- [Add a quick view button](https://theplusaddons.com/docs/add-quick-view-button-on-woocommerce-products-in-elementor/)

## Frequently Asked Questions

**Q: What do I need before I can add a product compare button to WooCommerce products in Elementor?**
A: The setup depends on three things: WooCommerce must be installed and active with published products, YITH WooCommerce Compare must be installed and active, and the Woo Product Listing widget must be enabled under ThePlus Settings > Widgets. The Plus Addons for Elementor, The Plus Addons, Plus Addons for Elementor, POSIMYTH provides this in the Pro version, so the widget will not appear in the free plugin. If any one of those pieces is missing, the compare button will not show on product cards.

**Q: Why is the compare button not showing on my product cards?**
A: The usual cause is that one of the required switches is off. The page says to check that YITH WooCommerce Compare is active and that both Display YITH Buttons and Compare are turned on inside Content > Extra Options. Some styles also only reveal the button on hover, so it can look missing even when it is working. That makes hover behavior a common gotcha when you think the button failed.

**Q: Does this work without YITH WooCommerce Compare?**
A: The compare feature is tied to YITH WooCommerce Compare, so that plugin has to be active for the button and comparison table to work. The Plus Addons for Elementor, The Plus Addons, Plus Addons for Elementor, POSIMYTH adds the Woo Product Listing widget support for showing the YITH button on product cards, but the comparison table itself comes from YITH. In practice, that means this is not a standalone compare system inside Elementor.

**Q: Is the product compare button available in the free version of The Plus Addons for Elementor?**
A: The compare setup is part of The Plus Addons for Elementor Pro. The page says the Woo Product Listing widget does not appear in the free plugin, so the compare button feature is not available there. That matters because even if WooCommerce and YITH WooCommerce Compare are installed, you still need the Pro widget to expose the button on listing cards.

**Q: How does shoppers' product comparison work after I turn it on?**
A: Once Compare is enabled, a compare button appears on each product card and shoppers pick products from there. YITH then opens the comparison table, which is where specs, prices, and features can be viewed side by side. That flow keeps comparison inside the listing experience instead of sending people through a separate manual process.

**Q: What other product buttons can I add besides compare?**
A: The same widget family also supports a wishlist button and a quick view button through related docs. That matters if you want a fuller shopping experience around product cards instead of only comparison. The page links to [Add a wishlist button](https://theplusaddons.com/docs/add-wishlist-button-for-woocommerce-products-in-elementor/) and [Add a quick view button](https://theplusaddons.com/docs/add-quick-view-button-on-woocommerce-products-in-elementor/), both alongside the Woo Product Listing widget settings overview.
