An image comparison slider — the interactive drag-to-reveal element that shows a "before" and "after" side by side — is one of the most persuasive tools available to Shopify merchants. For any store selling a product with a visible result, whether that's skincare, hair care, cleaning products, interior design, fitness, or home renovation, showing the transformation is exponentially more convincing than describing it. Customers can drag the divider themselves, which makes the proof feel hands-on and real rather than a staged marketing image. The engagement it generates and the trust it builds at the moment of purchase intent are difficult to replicate with any other single page element.
The catch is that most Shopify themes don't include a before and after image comparison slider out of the box — and the most common fix is a subscription app that charges monthly for a feature you'll only set up once. Section Store offers a cleaner alternative: a native image comparison slider Section that installs directly into your existing theme as a standard Liquid file, is customised entirely inside Shopify's built-in Theme Editor, and costs $9 as a one-time purchase. No monthly fees, no third-party embed code, no page builder required. Here's how to add it to your store.
HOW TO ADD AN IMAGE COMPARISON SLIDER SECTION TO YOUR SHOPIFY THEME
Follow these simple steps to install and customise a before and after image comparison slider Section on your Shopify store using Section Store.
Install the Section Store App
If you haven't already, install the Section Store app from the Shopify App Store. It's free to install — you only pay for the Sections you choose to purchase.
Find the Image Comparison Slider Section
Inside the Section Store app, search for "Before After" or "Comparison" to find the image comparison slider Section. Browse the available designs and select the layout that best suits your store.
Purchase the Section
Click on your chosen Section and complete the one-time $9 purchase. It's yours permanently — no subscription, no renewal — and can be installed across multiple themes within your store without paying again.
Install the Section to Your Theme
Navigate to My Sections within the Section Store app. Click the Install button next to your image comparison Section and select the theme you want to add it to. Section Store installs the .liquid file directly into your theme — no code copying or file editing required.
Open the Shopify Theme Editor
In your Shopify admin, go to Online Store > Themes and click Customize on your live theme to open the Theme Editor.
Navigate to the Page Where You Want It
Use the page selector at the top of the Theme Editor to navigate to the template where the slider should appear. Product pages are the most impactful placement for transformation-based products, but the Section can be added to any page — homepage, landing page, or a dedicated results page.
Add the Section to the Page
Click Add Section in the left-hand sidebar and search for "ss - Before". Your purchased Section will appear in the results — all Section Store Sections are prefixed with "SS" (for example, "ss - Before After #1"), making them easy to identify. Click it to add it to the page.
Upload Your Before and After Images
Click on the Section in the sidebar to open its settings. Upload your "before" image and your "after" image — aim for consistent framing and high resolution for maximum impact. You can also add a heading, customise the divider style, set label text for each side, and adjust colours to match your brand. All changes preview live in the editor as you make them.
Save Your Theme
Click Save in the top-right corner of the Theme Editor. Your image comparison slider is now live on your store and ready for customers to interact with.
WHERE IT WORKS BEST
For transformation-based products, the highest-impact placement is directly on the product page — positioned below the product description and above customer reviews, where a shopper's purchase intent is already active. On the homepage, a comparison slider works well as a standalone proof section for stores where the result is the core selling point. For service-based Shopify stores — such as cleaning, grooming, or renovation — a dedicated results or gallery page built around multiple comparison sliders can serve as your most persuasive sales tool, replacing the need for lengthy written testimonials.
READY TO ADD IT TO YOUR STORE?
Browse the full Section library — including image comparison sliders and 730+ other designs — inside Section Store. Every Section is a one-time $9 purchase, works with all Online Store 2.0 themes, and is customisable entirely inside Shopify's built-in Theme Editor.
