Product Comparison Table Section

Build a side-by-side product comparison table highlighting features across multiple products.

Sidekick writes it — you put it live

Sidekick produces the content or code for this, but doesn't apply it to your store itself. You'll paste or publish the result yourself — the prompt tells Sidekick to explain exactly where it goes.

📋 Prompt

Run in Sidekick

Generate the Liquid, CSS, and schema for a product comparison table section that I can paste into my theme as a custom section, letting customers compare [NUMBER_OF_PRODUCTS] products side by side. The table should display: product image, product title, price, and comparison rows for these attributes: [ATTRIBUTE_LIST] (e.g., Material, Weight, Dimensions, Warranty, Rating). Pull attribute data from product metafields using namespace [METAFIELD_NAMESPACE]. Use checkmarks and X marks (text, not emoji) for boolean features. Highlight the best value in each row with [HIGHLIGHT_COLOR]. The table should scroll horizontally on mobile with the attribute column sticky on the left. Add a section schema so merchants can select which products to compare in the theme editor. Include a Clear and Add to Cart button below each product column. Generate full Liquid, CSS, and schema.

Where to add this: In Shopify admin, go to Online Store > Themes > Edit code, create a new section file at sections/product-comparison-table.liquid, and paste the generated Liquid/CSS (including the schema block) in. Save, then open the theme customizer, add the “Product Comparison” section to the page, and select the products to compare.

How to Use

Copy the prompt above
Open Shopify Sidekick in your Shopify admin
Paste the prompt and replace the bracketed placeholders with your details
Review Sidekick's response and apply the suggestions