View Product Page

Premium version settings

General settings

Home > Premium version settings

The plugin allows your users to compare two or more products by adding them to the comparison table through a specific button shown on the shop page and the product detail page.

Shop page
Shop page
Product page
Product page

The products will be shown to the user in a comparison table displayed as a page or a popup.

Popup

In the General settings section, you can set up the following global options:

General settings
  • Link or Button: choose whether to use a link or a button to let your users add a product to the comparison table;
  • Page or Popup: you can show the comparison table as a popup or within a page.
    Select ‘Popup‘ if you don’t want your users to leave the page or select ‘Page‘ if you prefer showing the comparison table on a dedicated page;
  • Choose Compare Page: the Compare page is automatically created. Yet, if you want to use another specific page, make sure you include the [yith_woocompare_table] shortcode and select the new page from the dropdown;
  • Link/Button text: the text of the link or the button used to add the products to the comparison table;
  • Link/Button text for products already in compare: the text of the link or the button to let users know the product has been already added to the comparison table;
  • Show button in single product page: enable to show the button on the product detail page;
  • Show button in products list: enable to show the button on the Shop page;
  • Open lightbox automatically: by enabling this option, the modal window of the comparison table will automatically open when users add a product for the comparison by clicking on the related button;
  • Open lightbox when adding the second item: the modal window will automatically open when users add a second item to the comparison table. This can be useful to avoid showing a comparison table with just one element;
  • Compare by category: by enabling this option, all the products added to the comparison table will be divided by category so that the comparison will be done only for products of the same category.
Category filter
  • Exclude category: through this option, you can set the categories of the products you don’t want to allow to be compared;
  • Reverse exclusion list: on the contrary, if you want only these products to be compared, you must enable this option.

Comparison table settings

Home > Premium version settings

To edit the settings related to the comparison table, go to YITH > Compare -> Comparison table.

Comparison table settings
  • Table title: the title of the table which shows only if the comparison table is set as a modal window;
  • Table image: the image shown in the table;
  • Show table image in: choose whether to show the table in the “Compare” page or in a modal window;
  • Dynamic Attribute fields: this option lets you show only the product attributes, among those chosen in the “Fields to show” option, that have information about at least one of the compared products.
    Please, note: this option applies only to product attributes and not to the default WooCommerce fields (that is product info, price, rating, description, SKU, availability and weight) that will be displayed anyway even if empty, but with a dash.
  • Add product custom attributes: if you enable this option, also product custom attributes (the ones created on product level) will appear in the compare table as a separate field.
Comparison table settings
  • Fields to show: select the fields you want to appear in the compare table. When you create a new global attribute in WooCommerce > Products > Attributes, it will show in this list as well.
    You can arrange the order of the various fields to show in the compare table by dragging the fields up or down in this list;

  • Product Info Fields: product information to add to the table (name, image, add to cart button). The order of these fields cannot be modified as you can do for those in the “Fields to show” section;
  • Show “Request a Quote” button in product info: show the Add to quote button in the product info section;
  • Use full description: the full description of the product will show in the table instead of the “Short Description”;
  • Repeat “Price” field: by enabling this option, the price of each product will be replicated in the related column in the lowest part of the table;
  • Repeat “Add to cart” field: by enabling this option, the Add to cart button will be replicated in the related column in the lowest part of the table;
Comparison table settings
  • Image size: the size of the product images in the comparison table.
    If you encounter difficulties with the correct display of the images, we suggest you regenerate the product images;
  • Highlight different values: the rows of the table with different values will be highlighted in grey (default color);
  • Number of fixed columns: select the number of fixed columns to show in the comparison table;
  • Limit compared products: enter a maximum number of products users can add to the comparison list. Leave 0 for unlimited items;
  • Show ‘Clear All’ button: enable this option to allow resetting the comparison table to remove all the products added;
    • “Clear all” button label: enter the text to show for the Clear all button.
Show "Clear all" button

Social network sharing

Home > Premium version settings

You can activate the sharing of the comparison table on one of the supported social network sites or via email.
To configure the sharing options, go to YITH > Compare -> Social Network Sites Sharing.

Social network sharing
  • Enable Sharing: enable/disable social network site sharing;
  • Show sharing in: choose whether to add the sharing buttons in the modal window and/or in the “Compare” page;
  • Select Social Network Sites: the sites to enable the sharing. Choose from Facebook, Twitter, Pinterest, or email (in this case, the click of the users will open the email service installed on their PC);
  • Title for Social Network Sharing: title for the sharing message of the comparison table;
  • Text for Social Network Sharing: text for the sharing message of the comparison table;
  • Facebook App ID: to allow sharing through Facebook, you need to register and configure an App ID by following the official documentation. 
  • Facebook image: here, you can upload an image for Facebook sharing.

 

Related Products

Home > Premium version settings

From the tab Related products, you can configure the options to show the related products in a slider under the table.

Related products
  • Related Products: by enabling this option, you can add a slider right after the table with all the products of the shop that have tags/categories in common with at least one of the products in the comparison table;
  • Show related products in: choose whether to add the slider to the modal window in which the comparison table will be displayed and/or in the dedicated “Compare” page”;
  • Visible Number: set how many products to show in the slider;
  • Autoplay: enable to activate the autoplay of the slider;
  • Slider Navigation: enable to show the navigation arrows of the slider.
Related products in the comparison table

Style

Home > Premium version settings

All the comparison table colors can be customized in YITH Compare -> Style and will apply to Category Filter Options, Table Options, Share Options, and Related Options.

Style options

Shortcodes & widgets

Home > Premium version settings

Shortcodes

The plugin includes three shortcodes.

1. Custom comparison table

This shortcode lets you create comparison tables for specific products of the shop. To do it, go to the “Build Shortcode” tab and select the products to show in the customized table.

Shortcode

Now copy and paste the generated shortcode on the page where you want to show it.

Compare shortcode on page

2. Product Counter

This shortcode lets you show a counter of the products added to the comparison list so far. The shortcode is:

[yith_woocompare_counter]

It can be added to any page or even in a widget.

Counter shortcode
Widget

This is what it might look like on the Shop page before the products.

Shortcode example

3. Compare button

If you’re building your shop page and/or product pages using a page builder, you may need to show the “Compare” button using the following shortcode:

[yith_compare_button]

Compare button shortcode

Widgets

The plugin provides you with two different widgets.

1. Products in the list

This widget shows the list of the products users have added to the comparison table.

Comparison widget

2. Product Counter

This widget shows a counter of all products added to the comparison list so far.
You can enter a title and choose to show only numbers or both numbers and text.
If you want to, you can pick an icon from your Media gallery and customize the text to make it clear to your customers what the counter is for.

Counter widget

YITH Color, Image & Label Variation Swatches for WooCommerce

Home > Premium version settings

YITH Color, Image & Label Variation Swatches for WooCommerce allows you to create custom attributes for the variations of products available in your shop. From version 1.9.0, it is also possible to show the single variations in archive pages.

Integration with YITH Color, Image & Label Variation Swatches for WooCommerce

Combining the two plugins will make it possible to also compare these single variations in archive pages, like in the example above, where we compared two of the same hoodies but in different colors.

To make them work together, you must activate both plugins and set them up as you wish. For more information on how to set up YITH Color, Image & Label Variation Swatches for WooCommerce, check the documentation here.

YITH WooCommerce Quick View

Home > Premium version settings

YITH WooCommerce Quick View allows your customers to get a quick view of the products in which they are interested. The product details will be shown in a popup, so they don’t need to leave the page they are currently visiting.

You only have to activate both plugins to make them work together. The combined use of these two plugins will add the “Compare” button in the quick view popup of the product. This will give your customers the possibility to add a product to the compare list without abandoning the current product popup.

YITH Compare button in quick view popup

For more information about how to set up the YITH WooCommerce Compare plugin, check out the full documentation here.

YITH Request a Quote

Home > Premium version settings

YITH Request a Quote for WooCommerce allows enabling an easy-to-use system to manage quotes and price estimates. Your users can add one or more products to the quote list and send a request. The admin can make a custom price and send the quote (email and PDF document as well): if the users accept the quote, they will be directly taken to the checkout to purchase the selected products at the agreed price.

The integration with YITH Compare allows showing the “Add to Quote” button also on the products displayed on the Compare list and making the quote request sending as easy as pie.

To enable this integration, just make sure you have installed and activated the premium version of both plugins.

Then go to the YITH > Compare > Comparison table and enable the option called Show “Request a Quote” button in product info.

Integration with YITH Request a Quote

This is what it will look like in the comparison table:

Quote button in compare list

For further details about the YITH Request a Quote configuration, please, refer to the official documentation.