JuZ DualView

The JuZ DualView Block allows you to create interactive before/after comparisons directly in the WordPress block editor. Perfect for showcasing transformations, improvements, or any content that benefits from side-by-side comparison with an interactive slider.

Key Features:
– Interactive slider to compare before/after content
– Works with images, covers, text, or any block content, as long as it is not interactive (see below)
– Customizable labels and descriptions
– Responsive design that works on all devices
– Accessibility-ready with proper ARIA attributes
– Easy to use with a simple interface

Use Cases:
– Showcasing design improvements
– Demonstrating product before/after results
– Comparing old vs. new versions
– Highlighting transformations
– Any content that benefits from visual comparison

What to put in it:
Any blocks, as long as the content is not interactive: images, covers, text, a whole layout. Links, buttons, forms or video players would sit under the slider and could not be used. When both sides hold text, give them a background so that one does not show through the other.

Labels in the language of the page:
The default labels of the slider and its buttons are added when the page is displayed, in the language of the page (English by default). On a multilingual site, each page gets its own language; the labels typed in the block settings are kept as they are.

Live demo:
See it in action on playground.juzed.dev, or try it in the editor with WordPress Playground, nothing to install.

Accessibility Credits:
This plugin’s accessibility features were developed with expert guidance from:
– Jean-Baptiste Audras (Whodunit)
– Sorya Huon (Ecedi)
– Myriam Niaré-Guilloux (Ecedi)

Additional Notes

• Requires WordPress 6.0 or higher
• Works with the Gutenberg block editor
• Tested with major WordPress themes
• Lightweight and performance optimized