Comparison table 🔥

Showcase key differences between your related products. It’s ideal for highlighting specs, ingredients, usage, or benefits—especially in industries like skincare, electronics, wellness, and supplements.

#How to add a Comparison table section to your Shopify store

#How to customize a Comparison table section

#Section settings

These settings affect the layout and overall appearance of the comparison table on your page.

#General settings

• Color scheme: Select predefined set of colors for the section. This color scheme affects the header and background of the section.

#Section header

Customize the heading that appears above the table.

• Layout

#Header content

#Table content

• Icon size: Controls the size of the icons for each heading row.

• Text line limit: Limits content height per cell to avoid overflow (No limits/ 1-5 lines).
• Show view more button: Toggle this to show/hide an expandable button if content is clipped.

#Block settings

The Comparison Table includes two block types:

• Heading
• Content

#Heading

Each heading defines a row in your comparison table (e.g., “Description,” “Skin Type,” “Usage”).

Heading block fields:

• Icon: Choose from theme icons (chat, heart, check, etc.) for visual clarity.
• Image (optional): Upload a custom icon.
• Title: The row label (e.g., “Key Ingredients”).

#Content

Each Content block represents a column in the table—linked to one specific product.

Content block fields

• Product: Select the product to display in this column.
• Text 1–10: Match each text field to a heading row. For example:
  • Text 1 → Description
  • Text 2 → Skin Type
  • Text 3 → Key Ingredients
  • And so on...

💡 Tip: You don’t need to fill all 10 text fields—only what matches your current comparison table headings.

🔁 Repeat this for each product you want to compare.