---
title: "How to Add a Compare Button to Custom or Any Other Post Type in Elementor?"
url: https://theplusaddons.com/docs/add-a-compare-button-to-custom-or-any-other-post-type-in-elementor/
date: 2024-07-02
modified: 2026-04-09
author: "Aditya Sharma"
description: "If you have a custom post type or any other post type like posts, pages with such content where comparison might be required you can do that with the Woo..."
image: https://theplusaddons.com/wp-content/uploads/2024/07/How-to-Add-Animated-Headings-In-Elementor-4-2-1024x565.jpg
word_count: 409
---

# How to Add a Compare Button to Custom or Any Other Post Type in Elementor?

## Key Takeaways

- Woo Compare widget from The Plus Addons for Elementor allows users to add a compare button to custom post types like 'Books'.
- Users must create a custom loop skin for the post type before adding the Woo Compare widget.
- The compare count feature displays the number of posts added for comparison when the same Unique Name is used in both Button and Count types.

If you have a custom post type or any other post type like posts, pages with such content where comparison might be required you can do that with the Woo Compare widget. 

With the Woo Compare widget from The Plus Addons for Elementor, you can easily add a compare button to a custom post type or any other post type loop.

*To check the complete feature overview documentation of The Plus Addons for Elementor Woo Compare widget, [click here](https://theplusaddons.com/docs/add-product-compare-in-elementor/).*

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

Let’s add the compare button to a custom post type called “*Books*”.

To do this, make sure you’ve [created a custom loop skin for the custom post type](https://theplusaddons.com/docs//create-elementor-custom-post-type-loop-skin/). Open the template and add the Woo Compare widget to the desired place, then follow the steps - 

> *Note: For normal posts or pages, you have to *[*use a custom skin*](https://theplusaddons.com/docs//create-custom-loop-skin-for-blog-post-in-elementor/)* as well.*

1. Select **Button** from the **Type** dropdown under the **Woo Compare** tab.

2. Then from the **Post Type** dropdown, select your custom post type name i.e. “*Books*” here.

3. In the **Unique Name** field, you have to add a unique name to connect with other Woo Compare Types. For instance, we’ve added *“tp-compare*” here.

![](https://theplusaddons.com/wp-content/uploads/2024/07/woo-compare-type-button-other-post-types-1.gif)

4. After making the necessary adjustments and style to the button update the template

5. Then you have to [use this template with the Dynamic Listing widget](https://theplusaddons.com/docs//create-elementor-custom-post-type-loop-skin/#Use-the-Template-With-Dynamic-Listing-Widget).

Now you’ll see the compare button in the custom post type listing that you can use to add posts to a comparison table. 

### Show Compare Count

Now if you want to show a compare count as well then add the Woo Compare widget to the page where you are showing the post listing with the compare button or in a common template like header, then follow the steps - 

1. From the **Type** dropdown, select **Count** under the **Woo Compare** tab.

2. Then select **Button** from the **Count Type** dropdown.

3. Then from the **Post Type** dropdown, select your custom post type name i.e. “*Books*” here.

4. After that in the **Unique Name** field, you have to add the same name as added in the Button type above i.e. *“tp-compare*” here.

![woo compare type count other post types](https://theplusaddons.com/wp-content/uploads/2024/07/woo-compare-type-count-other-post-types.gif)

> *Note: You can also connect with the List type by using the same Unique Name.*

Now when you add a post to compare, it will show the number of posts added for comparison.

## Frequently Asked Questions

**Q: What should I do if the compare button isn't showing up?**
A: If the compare button isn't appearing, ensure that you've created a custom loop skin for your custom post type. The Woo Compare widget from The Plus Addons for Elementor requires this setup to function properly. Additionally, verify that the widget is installed and activated, as it won't work without being properly set up.

**Q: Can I use the compare button with any post type?**
A: Yes, the compare button can be added to any post type, including custom post types. For example, if you're working with a custom post type called 'Books,' you can integrate the Woo Compare widget to allow users to compare different books. This flexibility makes it a powerful tool for various content types.

**Q: What is the best practice for naming the unique identifier for the compare button?**
A: When setting up the compare button, it's crucial to use a unique name in the Unique Name field that connects with other Woo Compare Types. For instance, using 'tp-compare' is recommended. This practice ensures that the compare functionality works seamlessly across different types and avoids conflicts with other widgets.

**Q: How can I display the count of items added for comparison?**
A: To show the count of items added for comparison, you need to add the Woo Compare widget again and select 'Count' from the Type dropdown. Make sure to use the same Unique Name as the button type, such as 'tp-compare.' This setup allows users to see how many items they have selected for comparison, enhancing the user experience.

**Q: What happens if I don't use a custom skin for normal posts?**
A: If you don't use a custom skin for normal posts, the compare button will not function as expected. The Woo Compare widget requires a custom skin for both custom post types and normal posts to integrate correctly. Skipping this step may lead to a non-functional compare feature, so it's essential to follow this requirement.

**Q: Is there a specific order to follow when adding the compare button and count?**
A: Yes, the order matters when adding the compare button and count. First, add the compare button using the Woo Compare widget, and then add the count widget to the same or a common template. Ensure both use the same Unique Name to link them correctly. This approach allows for a cohesive comparison experience for users.