Blocko

Top 14 Before and After Sections for Shopify (Updated Oct 2026)

Blocko has 14 free before and after sections for Shopify Online Store 2.0, from 14 themes across beauty. 14 ship as Shopify Liquid with merchant settings; 0 need no JavaScript at all. Each one has a live demo and a one-line prompt for your coding agent.

The list is ranked with Shopify-ready items first, then by the least JavaScript. Open any item to see its sections, settings and prompt, or use all sections by type to compare other kinds. Not affiliated with Shopify.

Compare at a glance

#NameThemeIndustryShopifyJavaScriptSettings
1Before and after comparisonBalmBeautyLiquid + HTML15 KB11
2Before and after comparisonBareBeautyLiquid + HTML15 KB11
3Before and after comparisonBlushBeautyLiquid + HTML15 KB11
4Before and after comparisonClipBeautyLiquid + HTML15 KB11
5Before and after comparisonDewBeautyLiquid + HTML15 KB11
6Before and after comparisonIsleBeautyLiquid + HTML15 KB11
7Before and after comparisonLatherBeautyLiquid + HTML15 KB11
8Before and after comparisonPrismBeautyLiquid + HTML15 KB11
9Before and after comparisonShelfBeautyLiquid + HTML15 KB11
10Before and after comparisonStubbleBeautyLiquid + HTML15 KB11
11Before and after comparisonTideBeautyLiquid + HTML15 KB11
12Before and after comparisonTintBeautyLiquid + HTML15 KB11
13Before and after comparisonTwistBeautyLiquid + HTML15 KB11
14Before and after comparisonVeilBeautyLiquid + HTML15 KB11

Before and After sections

Frequently asked questions

What are the best before and after sections for Shopify?

Blocko lists 14 free, MIT-licensed before and after sections from 14 themes. 14 of them ship as Shopify Liquid today and the rest are complete HTML demos. The list is ranked with Liquid-ready items first, then by the least JavaScript, so Before and after comparison from Balm comes first.

Are these before and after sections free to use?

Yes. Every item is MIT licensed, free to copy and edit, and needs no app or subscription. Blocko is not affiliated with Shopify.

How do I add one of these before and after sections to my Shopify store?

Open an item, copy its one-line prompt into your coding agent, or connect the Blocko MCP server at https://blocko.ai/mcp. The agent asks where the section should go before it changes any code.

Which industries do these before and after sections cover?

Beauty. Every industry with at least three matching items has its own list.

How much JavaScript do these before and after sections ship?

0 of 14 ship 0 KB of JavaScript. The heaviest is Before and after comparison in Balm at 15 KB, registered as an idempotent Custom Element.

Related lists

Filter by industry

Filter by page type

Where these before and after sections are used.

Other sections

Markdown version for agents · Browse the full library · Connect your agent