✔ Recently Updated
-40%
Before & After Image Slider WordPress Plugin
Turn two images into a responsive, interactive comparison. Create responsive image comparison sliders, manage them from one place, and insert them anywhere with shortcodes, the WordPress block editor, or Elementor.
Original price was: $49.95.$29.95Current price is: $29.95.
✓ Instant Download Delivery
Create Reusable Before-and-After Image Sliders in WordPress
HexCoda Before/After Sliders is a WordPress plugin for creating interactive image comparisons. It places a Before image and an After image in the same responsive frame, where visitors move a divider to reveal the difference.
Every comparison is saved as a reusable slider that can be inserted with Gutenberg, Elementor, a shortcode, or a grouped gallery.
Two separate images make visitors look back and forth, remember details, and work out what changed. A before-and-after slider keeps both images aligned in one visual area, making the transformation easier to understand.
The WordPress plugin supports horizontal and vertical comparison directions, custom labels, adjustable starting positions, style presets, presentation templates, lazy loading, and custom heights.
Each comparison is stored as a reusable slider. You can create it once, manage it from the HexCoda interface, and place it anywhere using a shortcode, Gutenberg block, or Elementor widget.
A live preview lets you review the slider as you edit. Unsaved changes remain inside the admin preview until you save, so existing frontend content stays unchanged.
Plugin Specifications
- Platform: WordPress 6.2 or newer
- PHP: PHP 7.4 or newer
- Comparison directions: Horizontal and vertical
- Image source: WordPress Media Library
- Placement: Shortcode, Gutenberg block, and Elementor widget
- Controls: Labels, starting position, style, height, and lazy loading
- Accessibility: Keyboard, touch, screen-reader, RTL, and reduced-motion support
- Version: v1.0.1
Before After
Horizontal & Vertical
Choose the slide direction that best fits your images.
Reusable Sliders
Create each slider once and place it across multiple pages.
Customization
Adjust labels, templates, position, height, and loading.
Live Preview
Review slider changes instantly before updating.
Who Is HexCoda Before/After Sliders For?
Explore the WordPress Before & After Comparison Showcase to see real business use cases, including photography, renovation, vehicle repair, skincare, ecommerce, and more.
Photographers and Retouchers
Compare original photographs with edited, restored, retouched, color-corrected, or background-cleaned versions.
Renovation, Construction, and Interior Design Businesses
Present rooms, properties, gardens, furniture, painting projects, landscaping work, and completed renovations before and after the work.
Designers and Creative Agencies
Show redesigns, mockups, branding changes, interface updates, visual revisions, and other creative transformations.
Beauty, Wellness, and Cosmetic Services
Display makeup work, skincare results, hair transformations, cosmetic treatments, and other visual service examples with clear Before and After labels.
Real Estate and Property Professionals
Compare staged and empty rooms, renovated properties, exterior upgrades, new construction, and landscaping improvements.
WooCommerce and E-Commerce Stores
Demonstrate product variations, packaging changes, restoration tools, cleaning products, presets, filters, and products with visible results.
Automotive and Detailing Businesses
Show vehicle restoration, paint correction, detailing, customization, repair work, and tuning results.
Education and Research
Present scientific changes, historical comparisons, restoration studies, learning progress, and visual research findings.
Read the complete Before & After Image Slider Documentation for installation steps, editor integrations, shortcode usage, display settings, and troubleshooting guidance.
Create a Slider in a Few Steps
- Select the Before and After images from the WordPress Media Library.
- Choose the direction, labels, style, template, and starting position.
- Review the comparison in the live preview.
- Save the slider and place it with a shortcode, Gutenberg block, or Elementor widget.
Frequently Asked Questions
What is a before-and-after image slider?
A before-and-after image slider places two related images in the same visual area. Visitors move a divider to reveal more or less of each image, making changes easier to compare than when the images are displayed separately.
Can I use HexCoda with Gutenberg and Elementor?
Yes. HexCoda includes a dynamic Gutenberg block and registers an Elementor widget when Elementor is active. Both let you select a comparison from the same library of saved sliders. You can also use the generated shortcode in compatible content areas.
Can I reuse the same slider on multiple pages?
Yes. Every comparison is saved as a reusable slider. Insert the same slider in more than one location, then update its images or settings centrally from the HexCoda dashboard.
Can I display several comparisons together?
Yes. Assign published sliders to a gallery group, then use the gallery shortcode to display them together in a multi-column layout.
Can I create horizontal and vertical comparisons?
Yes. Set each comparison to a horizontal or vertical direction and choose its initial divider position
Can I change the Before and After labels?
Yes. Each slider can use custom labels, including project-specific terms such as Original and Retouched, Empty and Staged, or Draft and Final.
Does it work with WooCommerce?
HexCoda does not currently provide direct WooCommerce product-editor integration. A saved slider can be placed only where the WooCommerce template or editor supports the HexCoda shortcode, Gutenberg block, or Elementor widget. Test the intended product template before purchase or publication.
Be the first to review “Before & After Image Slider WordPress Plugin”
Changelog
v1.0.1
- Refined admin navigation semantics and first-save status messaging.
- Improved responsive toolbar alignment and standardized admin control heights.
- Limited media and live-preview assets to editor contexts for a lighter admin experience.
- Improved empty image actions, localized media dialog labels, and product title consistency.
v1.0.0
- First stable commercial release.
- Create and manage reusable horizontal and vertical before-and-after image comparisons.
- Includes live admin preview, shortcodes, grouped galleries, Gutenberg and Elementor integration.
- Includes Compact, Proof, and Sales templates with Clean, Minimal, and Shadow Card styles.
- Includes Dark and Light label badge styles selectable for each slider.
- Supports mouse, touch, keyboard interaction, lazy loading, custom heights, and optional JSON-LD structured data.
Instant Digital Download
Download your plugin immediately after completing your purchase.
Updates and Support Included
Receive plugin updates, documentation, and customer support.
Secure, Tested Plugin Files
Every release is tested with its supported WordPress and PHP versions.
Easy Setup, No Coding
Install, activate, and configure everything without touching code.
Your May Also Like
-40%
Original price was: $49.95.$29.95Current price is: $29.95.
-40%
Original price was: $49.95.$29.95Current price is: $29.95.
Reviews
There are no reviews yet.