Appearance
Comparison Table
A feature comparison grid for comparing products, plans, or options side by side. Helps visitors make informed decisions.
Try it
Change the settings below and watch the preview update in real time. Click Split to see settings and preview side by side, or use the tabs to switch between them.
Storefront preview
Settings
| Setting | What it does |
|---|---|
| Color scheme | Picks which set of colors to use for this section |
| Heading | The title above the table |
| Orientation | Whether products are compared column-by-column (Columns) or feature-by-feature in rows (Rows). Default: Columns. |
| Feature header | The label for the feature-name column (e.g., "Feature"). Only shown when Orientation is set to Columns. |
| Enable sortable | Lets visitors sort columns by clicking a column header. Only available when Orientation is set to Columns. |
Column names come from the Column title field on each Column block — see Blocks below.
Blocks
Column
Each column in the comparison table is a Column block. Add one block per product or option.
| Setting | What it does |
|---|---|
| Column title | The name of this column (e.g., the product name) |
| Subtitle | A short description below the title |
| Image | A product or category image for this column |
| CTA label | The button text for this column's call-to-action |
| CTA link | Where the CTA button links to |
| Highlighted | Mark this column as featured or recommended |
| Cell 1 label – Cell 10 label | The feature name for each row (e.g., "Weight", "Material") |
| Cell 1 value – Cell 10 value | The value for this column in each row (e.g., "1.2 kg", "Stainless steel") |
Cell value fields are only shown after their corresponding label is filled in.
Advanced
Niche metafield namespace — a custom namespace used to pull product-metafield data into comparison rows. The default value (uisce_tine) is an example from the Tine preset. Change this to match your own metafield namespace.
Related article handle — the blog-post handle of an article to link from the comparison table. The default (choosing-the-right-drill-size) is a Tine-preset example. Replace with the handle of a relevant article in your store.
Tips
- Highlight your recommended product to guide visitors who feel overwhelmed by options. A "Most Popular" or "Best Value" label goes a long way.
- Keep feature rows to 5–8. More than that and the table becomes hard to scan. Link to individual product pages for full details.