This article is also available in:
If you want to showcase the changes Before/After by comparing 2 images, the Before/After block will be a perfect solution. 

This functionality suits best for dentistry, beauty industry, construction and interior design companies etc.

To add and set up the gallery, follow the instructions below.

Click on Add Block from inside the editor and choose wireframe-series-10-gallery:

Tip: you can add Before/After gallery as a separate element to some blocks. More information about this can be found in the article Adding elements to a block.

Press on the image component to Upload or pick one from our Gallery:

A pop-up window will appear where you can add an image:

By clicking on  the "gear" icon in the top left corner, you'll be able to customize the position of the slider (vertical/ horizontal) and the handle color:

Publish your site for changes to take effect.
Here you have the example of a Before/After gallery on a live website. The site visitors can pull the handler to the left or right to compare the images:

Was this article helpful?
Thank you!