Before/ After image slider

With the Before/ After image slider section in Sleek, 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.

#How to add a Before/ After image slider

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

#How to edit a Before/ After image slider

#Section settings

#General

Adjust the Container (Fixed width/Small) for this section.

#Section header

Select your preferred Layout for the section:

Add the content you want in the Heading to attract customers' attention

• Leave it blank if you do not want to display it

You can also change the Heading size to:

• Heading xs
• Heading sm
• Heading md
• Heading lg
• Heading xl
• Heading 2xl
• Display md
• Display lg
• Display xl

#Highlight text

Use the provided text fields to add a suitable Subheading and Description.

• Leave them blank if you do not want to display them

The call-to-action button will get the link from the provided Button link field.

Give the button a label, and a specific Button style:

• Primary button
• Secondary button
• Underline button

#Before/ After image settings

The settings let you decide which Direction to slide (Vertical/ Horizontal).

Set the section's image height as Adapt to image/ Small/ Medium/ High.

Change the Image heading style to Badges or Plain text.

You can also add Product to this section, so customers can easily navigate to the target product.

#Block settings

There are 2 blocks of images in a Before/ After image slider.

You need to fill in both blocks to make the slider work.

You can select images to display on desktop and mobile (Image and Mobile image).

Add an Image heading to your Before/ After image block and change the Color scheme if needed.