How to Create a Before and After Image Slider

Have you ever wanted to show before and after photos on your WordPress website? There are many reasons why these kinds of images might make sense for your blog.

Perhaps you blog about crafts, fashion, makeup techniques, exercise, home remodeling, or even plastic surgery.

Whatever you blog about, it's likely you can create a compelling before and after photo that your visitors would be likely to share.

After reading this post and watching the short video, you'll be able to easily create before and after image sliders on your own website just like the ones shown above.

Create Before and After Images

The first thing you'll need to do is create the before and after images. This can be accomplished easily using your phone for before and after images of makeup, food or fashion but you also might need to do a little image editing.

I like to keep things as simple as possible, that's why I recommend these image creation/editing solutions:

Canva.com (see exactly how I use Canva here)
Pixelmator for Mac (an easier and less expensive alternative to Photoshop)
Creating a Before and After Image Slider in WordPress

The first thing you need to do is install and activate the Before After Image Slider Lite plugin. For more details, see my step by step guide on how to install a WordPress plugin.

This tutorial covers the usage of the free plugin. There's also a Pro version available which comes with direct support and additional features like more modes, Visual Composer support, setting an initial value, linking images and more.

Let's get to it.