Before After Block for WordPress
Before After block lets you compare changes with ease, showcasing transformations at a glance, whether it’s photos, designs, or more. Upgrade your visual storytelling effortlessly!
Image Comparison
Visualize Stunning Transformations
With this block, you can upload two images and easily create an interactive slider that allows your audience to compare and contrast the differences between the two images. This feature is perfect for showcasing before and after pictures decorations or transformations for promotions, products, or services.
Direction
Versatile Layouts for Every Use Case
Trigger & Handle
User-Friendly Interactive Trigger
Labels
Labels for Enhanced User Experience
Integrating labels into the before-after block is a key enhancement for user experience. These labels provide valuable context and information about the compared images, acting as helpful guides during the comparison process.
Style
Extensive Design Block Settings
Users can easily customize the sliding direction, divider type and size, and select colors for key block elements. This extensive flexibility ensures a highly personalized, user-centric experience.
Why Should You Use the Before After Block?
Popular Use Cases for the Before & After Block
Before After Block Frequently Asked Questions
The Before After block is a powerful tool for comparing two images interactively. It allows users to showcase transformations or comparisons effectively with a draggable slider. This block is ideal for presenting before-and-after scenarios in various fields such as photography, design, and restoration projects.
This block is available in the Unlimited Elements Free version.
- Go to the Unlimited Elements Block Library.
- Search in the search bar for “Before After Block”.
- Hover over the block in the search results and click Install.
- Add the “Before After” block to any WordPress Page.
Yes, the Before After block is available for free in the Unlimited Elements plugin. You can access and use this block in the free version of Unlimited Elements, which is downloadable from the WordPress plugin repository.
Yes, you can easily change the slider direction from horizontal to vertical (Pro) in the block's General Settings under the "Direction" option. Customizing this feature gives you more control over the layout and helps tailor the block to your site's design and functionality.
This block is fully customizable, offering a wide range of styling options to suit your design needs. You can modify fonts, colors, and labels, adjust or change the slider appearance, and much more. Whether you're aiming for a sleek, modern look or a more vibrant design, the block's flexibility allows you to create a unique and visually appealing comparison experience.
The Before After block offers flexibility with its trigger options. You can choose between hover (Pro) or click interactions, depending on how you want the user to engage with the comparison. With hover, the comparison effect activates as users move their cursor, while the click option requires a deliberate action to trigger the slider.
Yes, you can easily adjust the initial position of the slider as a percentage in the block's settings. This allows you to control where the slider starts, providing a customized user experience. By setting the percentage, you can determine how much of the "before" or "after" image is visible when the page loads, giving you full control over the presentation.
Using the Before After is straightforward. Drag the block into your page, choose your before and after images, configure the slider settings, and style it to fit your design.
