Bricks Before After Slider — A Native Element for Bricks Builder

Before/after comparisons are one of those things that look simple but are surprisingly annoying to implement well in Bricks. This plugin just adds it as a native element so you can get on with building.

What Is Bricks Before After Slider?

A WordPress plugin that adds a Before / After element directly to your Bricks Builder panel. Drag it onto the canvas, pick two images, done. No shortcodes, no Code element, no workarounds.

Why This Plugin?

• Native Bricks element — drag and drop from the panel like any other element
• Zero dependencies — no external libraries or CDN requests
• Lightweight — ~2kb CSS + ~1.5kb JS
Touch and mobile friendly
• One-time payment — pay once, yours forever, no subscription

Using It in Bricks Builder

Open Bricks Builder on any page and search for “Before” in the elements panel. Drag the Before / After element onto your canvas.

In the settings panel on the left:

• Set your Before and After images from the Media Library
• Set the starting position of the slider (default 50%) — useful if you want to highlight the “after” result by opening the slider more to one side when the page loads
• Customize label text, label color, label background, handle color, and divider color
• Or hide the labels entirely if you prefer a cleaner look

The slider works on the frontend straight away — visitors drag the handle to compare the two images.

Works on mobile too

The slider is fully touch-enabled. On mobile, visitors swipe the handle left and right just like they would on desktop — no separate mobile configuration needed, it just works out of the box.

Labels in any language

The label text is fully editable — you’re not stuck with “Before” and “After”. If your site is in German, French, Spanish, or any other language, just type your own labels directly in the settings panel. No translation files, no extra configuration.

Installation

1. After purchase, download the ZIP file
2. Go to WordPress Admin → Plugins → Add New → Upload Plugin
3. Select the ZIP and click Install Now
4. Click Activate

Compatibility

• WordPress 6.0+
• Bricks Builder (all recent versions)
• Works with WP Rocket, LiteSpeed Cache and other lazy load plugins

One-Time Payment — $10

No subscription. No renewal. Pay once and it’s yours, updates included.