Before & After Image Slider for WPBakery Page Builder (formerly Visual Composer)

Before & After Image Slider for WPBakery Page Builder (formerly Visual Composer)

Try out Before & After in a live environment first before you buy

The Best Way to Add before / after Image Slider to Your Site

Create an awesome slider over to showcase your before & after photos with this easy to use element shortcode.

Trigger the before / after slider on mouse hover, click & drag or via a scroll bar. You can also add arrows or a colored split border.

The plugin is hardware accelerated and responsive, and it will adjust depending on your screen size. What’s more awesome is that it works blazing fast in mobile devices and becomes a touch and drag slider.

This plugin is perfect for showcasing:
  • Make up or make over before & after photos,
  • Before & after shots of landmarks and places,
  • Photography or design before & after screenshots,
  • Website before & after redesigns,
  • And many more.

The most unique thing is that this slider isn’t your typical vertical only or horizontal only before/after slider. We support angular / diagonal splits, a first in before / after sliders.

How to Use the Element

Just create a Before and After element:

Before & After Element in WPBakery Page Builder

Then in the settings, add a before photo and an after photo:

Before & After settings

That’s basically it. You can further change the settings to add a border, arrows and a scrollbar to your before/after slider.

When checking out the before/after slider in touch devices, it’s automatically responsive and touch enabled. Best of all, the performance is fast in both iOS and Android devices.

Awesome Features

  • Original vs new image comparisons,
  • Horizontal or Vertical splits,
  • Diagonal splits – a first in the industry,
  • Hardware accelerated speeds,
  • Responsive & touch enabled,
  • Customizeable border & arrow colors,
  • Scrollbars are available in the settings,
  • Easy to use shortcode,
  • WPBakery Page Builder Element included,
  • Well documented, and
  • Lightweight,
  • Cleanly coded in WordPress standards

Try out Before & After in a live environment first before you buy

Having Trouble with the Plugin?

Head over to the support tab and check out the FAQs, or submit a support ticket!

Enjoying the Plugin?

Be sure to leave a rating and review and show us some love.

Check out Our Other Stuff

Video & Parallax Backgrounds For WPBakery Page Builder

CSS Animator add-on for WPBakery Page Builder

4k Icons add-on for WPBakery Page Builder


Version 1.2 – January 19, 2016

* New width parameter for forcing the slider to have a maximum width.
* A custom class can now be defined for the element.
* Upgraded compiler for more reliable performance and virtually bug-free operation.
* Text captions for before image and after image are now possible. Alignment and text styling options included.
* Plugin updated to our current coding standards.
* Plugin autoupdates implemented. All you need is to enter your purchase code.
* Minor bug fixes.
* Done away with modernizr and upgraded all mobile detection coding.
* Removed OTF Regenerate Thumbnails, just install it if you need it.

Version 1.1 – March 11, 2015

* Fixed bug where the slider did not work in IE9
* Fixed resizing bug where sometimes the images got resized into a zoomed version

Version 1.0

* Initial release