The compare button will be added to your product and shop pages once you install the WCBoost – Products Compare plugin. This button is designed to provide a seamless way for customers to add items to a comparison list, enabling them to compare products side by side, encouraging a better-informed purchasing decision. This guide will help you configure the features and appearance of the compare buttons.
Table of Contents
Configuring the default behavior of Compare Buttons
To customize the compare button’s default behavior, you can use plugin’s settings in the the WooCommerce settings panel.
From the WordPress dashboard, navigate to WooCommerce > Settings > Products. In the General page, scroll down to find the Products Compare section.
Additional action after adding products to the compare list
Once a product is added to the comparison list, you can decide what happens next. The Added to compare behavior setting offers three options as below:
- No additional action: Keeps the customer on the current page (default).
- Redirect to the compare page: Takes the customer directly to the comparison page.
- Open the compare popup: Displays the comparison list in a popup.
Behavior for products already in the compare list
For items already present in the comparison list, the Existing products behavior setting allows you to define the button’s function:
- Remove from the compare list: Deletes the item from the list (default).
- View the compare page: Redirects to the list for detailed comparison.
- Open the compare popup: Shows the list in a popup for quick access.
- Hide the button: Removes the compare button for the listed products.
The button text will automatically update to reflect the chosen action, providing a clear call-to-action for your customers.
Customizing the appearance of compare buttons
To personalize the look of your compare buttons, navigate to Appearance > Customize > WooCommerce > Products Compare. Here you can change the button icon and texts for different button statuses.
Changing the Icon
The Button Icon settings allow you to select a predefined icon offered by the plugin. Alternatively, you can choose to remove the icon entirely and display the button text only.
Modifying the button text
In the same Products Compare customizer section, you have options to alter the text displayed on the compare buttons. There are 3 options:
- Button Add: This label is used for normal buttons that add items to the comparison list.
- Button Remove: This label is used for buttons that remove items from the comparison list.
- Button View: This label is used for buttons that call for displaying the comparison list.