BEAF Pro

BEAF Pro is the paid edition of the BEAF before-and-after slider and gallery extension for WordPress. Use it to show picture or video comparisons in a portfolio, project result, or product presentation. It works with Elementor, Gutenberg, Bricks, WP Bakery, other page builders, and block editors.

Choose a layout for the comparison

For two pictures, make a horizontal or vertical slider. For a collection, arrange before-and-after comparisons in galleries with two, three, or four columns. BEAF Pro adds ten preview styles and filterable galleries in two, three, or four columns. You can adjust filter colors and padding, and combine available preview styles with single-image styles.

For a focused display, use a single-image slider with a grayscale, blur, saturate, or sepia effect on the before or after image. Pro also works with watermarks, sliders made with three images, and video comparisons using two various videos.

Set the content and controls

The base plugin includes titles, descriptions, read-more buttons, image alt tags, label color and background options, overlay settings, mouse-hover controls, and a shortcode generator. With Pro, you can add titles, descriptions, and read-more buttons to single-image sliders and to normal or filterable galleries. Set each slider's width, height, and alignment, change the read-more text, or disable the slider handle.

Automatic sliding can pause when a user hovers over the slider. An on-scroll slider moves in response to the visitor's scrolling. These options give you alternatives to mouse-hover interaction and manual use of the slider handle.

Create and place a display

After installing and activating BEAF in WordPress, go to Dashboard > Before and After Slider > Add New. Choose a slider or gallery layout, select a presentation style, add the comparison media, then configure the available content and display settings. Use the generated shortcode to place a published slider where needed, or add a before-and-after display through a supported builder or block editor.

For before-and-after sliders specifically for WooCommerce products, a separate plugin is available.