Before/ After image slider

In this article, we will show you how to add and customize a Before/ After image slider section.

With the Before/ After image slider section in Zest, you can create horizontal or vertical sliders for your Shopify store, unleashing the creative potential of your site.

Using a Before/ After image slider can bring you several benefits such as:

  • boosting engagement on your Shopify store through interaction;

  • creating compelling visual stories;

  • showcasing impressive or persuasive presentations.


  1. In the theme editor (Customize), click Add section.

  2. Locate Before/ After image slider section

  3. Make necessary changes.

  4. Save.

To achieve the effect, it is recommended to use images of the same size and position, and there are visually distinguished differences between the before and after photos.

Section settings

You can update the following settings of the section:

  • Layout

    • Horizontal

    • Vertical

  • Image height

    • Adapt to image

    • Small

    • Medium

    • Large

Block settings

You can select images to display on desktop and mobile.

Add a heading to your Before/ After image if needed.

You can also set the heading to be shown as plain text.

Last updated