1. What is Product comparison?
The Product comparison is designed to compare multiple products from your store. This feature helps shoppers quickly see which product offers the most advantages.
2. Section Components
| Section | Product comparison | Displays multiple products' details at once for comparison purposes. |
|---|---|---|
| Available blocks | Product description | Displays the product's description from its product detail page in the Admin editor. |
| SKU | Displays the product's unique identifier code. | |
| Vendor name | Displays the product vendor's name. | |
| Product rating | Shows the average customer rating and review stars. | |
| Product metafield | Displays details of a product metafield. | |
| Variant option | Displays non-selectable product variations (size, color, etc.). | |
| Buttons | Adds action buttons for the comparison table. |
3. Location & Setup
To add and set up the Product comparison section:
- Open the Shopify Theme Editor (Online store > Themes > Customize).
- In the left sidebar, open the Overlay group.
- Click "Add section" and choose "Product comparison".
⚠️ Note: "Add to Compare" buttons on product cards and product pages are tied directly to this section - adding it turns the buttons on across your store, and removing or hiding it turns them off. There's no separate global toggle to enable elsewhere.
⚠️ Using a version before 2.0.0? You'll also need to turn on "Enable product comparison" in Theme Settings > Product first - "Add to Compare" buttons won't show otherwise. See the Theme Settings > Products > Product comparison guide for that step, then come back here to customize the section itself.
4. Highlight Features
- Display customizable information: Choose exactly which product details to show (title, price, rating, inventory status, etc.).
- Showcase multiple products: Allow customers to see multiple product details at once.
- Increase conversion rate: Highlight which products are best suited to a customer's needs for easier purchase decisions.
5. Common Use Cases
🤔 How to customize the Product comparison section's overall look?
STEP 1:
In the Theme editor, open the Overlay group > select "Add Section" and click on Product comparison to add this section.
STEP 2: Adjust the section's overall look
- In the first setting group, customize Subheading, Heading, Heading size, Heading tag, Heading alignment, and Text.
- In Colors, choose the Color scheme for light and dark mode.
STEP 3: Click "Save" when done.
🤔 How to set up the details of the comparison table?
STEP 1: Search for the Product comparison section in the editor.
STEP 2: Add and customize blocks
Click on "Add block". Customize each block as needed:
| Block name | How to set it up? |
| Product description | Change the Title. |
| SKU | Change the Title. |
| Vendor name | Change the Title. Optionally link the vendor to a collection and choose to open in a new window. |
| Product rating | Change the Title. |
| Product metafield | Change the Title. Display a product's metafield detail by adding its metafield key. |
| Variant option | Change the Title. Show color variants as color swatches. |
| Buttons | Change the Button style to Primary, Secondary, or Text link. |
STEP 3: Click "Save" when done.
🤔 How to adjust the amount of products compared?
You can compare up to 10 products. Follow these steps:
STEP 1: Click on the Product comparison section, then scroll down to the Grid group.
STEP 2: Drag to adjust Maximum products in compare (2-10, default 5).
STEP 3: (Optional) Edit Text to use for empty fields - shown in the table wherever a compared product has no value for that block (default: "-").
STEP 4: Click "Save" when done.
⚠️ Using a version before 2.0.0? Maximum products in compare is configured in Theme Settings > Product instead, not in this section - see the Theme Settings > Products > Product comparison guide.
6. Change Logs
Version 2.0.0 - August 2026
- Changed – Config consolidated into the section: All Product comparison settings have been removed from Theme Settings, including the old "Enable product comparison" toggle. "Add to Compare" buttons now show automatically whenever this section is added, and hide when it's removed or hidden.
- Changed – Maximum products in compare: Moved from Theme Settings into this section's own Grid settings group (still 2-10, default 5).
7. Support Information
Need help? Contact our support team at Omni Themes Support
