Comparison

The Comparison Section is a fantastic way to make shopping easier and more enjoyable for everyone. It lets customers compare products side by side, see key details at a glance, and add items to their cart quickly, all in one convenient spot. For merchants, it’s a great tool to highlight product features, guide shoppers toward best-sellers with badges and highlights, and keep customers engaged while saving time. Plus, it’s fully customizable to match your store’s branding, builds trust through transparency, and works perfectly for any product type or industry. A win-win for both you and your customers!



Section setting



Section content settings


Subheading Add a short title above your main heading—it’s a great way to introduce your Comparison section and grab attention.
Heading Set a bold, eye-catching title that highlights what the Comparison section is all about.
Body Content: Use this space to tell your customers more about the section—add a quick description or share some helpful details!
Image Ratio Tweak the size of your images so they look just right in the columns.
Image Fit

What it does: Choose how your images sit in their spaces.

Your options:

  • Contain: Keeps the whole image visible inside the box.
  • Cover: Fills the space completely for a bold, full look.

Image Background Color
  • If you choose “Contain,” you can add a background color to fill the empty space and match your store’s vibe.
Enable Highlight Turn it on: Want one column to stand out? Just turn on the highlight option!
Position

Pick a spot: Choose which of the first three columns you’d like to highlight.

  • Pro Tip: You can only highlight one column from the first three.
Badge Text Add a fun little label like “Best Seller” or “Top Pick” to your highlighted column.
Icon Style Pick an icon to go along with your badge in highlighted column —it’s a great way to grab attention!
Highlight Colors Customize everything in your highlighted column, from the background and text to the borders and buttons, to make it pop.
Divider Color Adjust the color of the lines between rows in your highlighted column to keep everything looking clean and stylish.


Block settings


Table Heading Block


Heading: This is where you set the titles for the rows in your comparison table. Think of these as labels that tell your customers what each row is about. For example, if the first row compares “Material,” you’d enter “Material” as the heading.
Custom Icon: Want to make your headings even more eye-catching? You can upload a custom icon to go with each heading. It’s a great way to add a little extra flair and make the table easier to read!



Table Value Block


Product Pick the product you want to compare in this column. This is where you showcase the product’s details side by side with others!
Custom Image Want a different image to represent the product? You can upload a custom image to replace the default product image or add one if there’s no product linked.
Custom Heading Need a different title for the product? You can add a custom title or replace the product name to make it fit your comparison table perfectly.
Value: Enter the specific detail or value for this row in the column. For example, if the row is about “Material,” you’d enter the material type here.
Icon: Make the value stand out by adding a little icon—like a tick, cross, or leave it blank if none is needed.

Note: Row values will only show up if there’s a row heading set for each row. So, make sure your headings are in place!

Did this answer your question? Thanks for the feedback There was a problem submitting your feedback. Please try again later.

Still need help? Contact Us Contact Us