Before & After is a Shopify theme block in the Section Star library. Add a draggable overlay to demonstrate your product's impact. Add to any section that supports Theme Blocks.
Live demo
Settings
Every setting below appears in the Shopify theme customizer once the block is published.
Media Design
Set settings for the media
| Setting | Type | Default |
|---|---|---|
| Media Aspect Ratio | Select (21:9, 16:9, 4:3, 1:1) | 4 / 3 |
Before & After Items
Choose the images for your comparison
| Setting | Type | Default |
|---|---|---|
| Before Image | Image | — |
| Before Caption | Inline rich text | Before |
| After Image | Image | — |
| After Caption | Inline rich text | After |
| Desktop CSS | Liquid | — |
| Mobile CSS | Liquid | — |
How to add this block to a Shopify store
- Install Section Star from the Shopify App Store.
- Open the app and find “Before & After” in the blocks library.
- Publish it to the theme you want to use it in.
- In the Shopify theme customizer, add the block inside a compatible section.
- Configure it with the settings listed above.