Blog Detail

• Aug 04, 2022

How To Display Before After Image In WordPress

A before and after photo can be useful to display side by side comparison of two similar images with minor differences. 

It is an image slider that stacks one image on top of another and uses an interactive slider to show the images. If the slider moves horizontally, then the first image will be displayed when the slider moves to the extreme right and the second one will be visible when it moves to the left.

Step 1: First of all Install and activate the Beaf-before-and-after-gallery plugin.

Step 2: Then Click the Before and After Slider and click Add New.

Step 3: Upload 2 images to show before and after.

Step 4: Then choose Image style and template style.

Step 5: After that Click the Options tab and set image settings.

Step 6: Then click the style tab and change the colors of the images and click on publish.

Step 7: After publishing the slider page you can get a shortcode. Copy this shortcode.

Step 8: Paste the shortcode in your post or page and update that.

Step 9: Now, you can visit your website to see the before and after images in action.