The Content Reveal on Hover widget for Elementor is a dynamic tool that enhances user engagement by revealing hidden content when users hover over an element. This widget is perfect for adding an interactive layer to your designs, whether you’re highlighting key features, showcasing additional details, or creating captivating hover effects for your website. With easy customization options and seamless integration with Elementor, the Content Reveal on Hover widget allows you to craft visually appealing and functional layouts effortlessly.
Let’s look at each of the options in the Content Reveal on Hover widget for Elementor below.
Elementor Content Reveal On Hover Video Tutorial
Add a Content Reveal on Hover Widget to Elementor
This widget requires Unlimited Elements Free version installed and activated on your WordPress website.
- Go to Unlimited Elements Widget Library
- Search in the search bar for “Content Reveal on Hover”
- Hover over the widget in the search results and click install
- Add the “Content Reveal on Hover” widget to any Elementor Page
General Settings
Image
Choose an image to display.
Title
Type text for title.
Content
Type text for content.
Show Button
Show/hide the button.
Button Label
Type text for button label.
Button Link
Type or paste URL to link with the button.
Show Button Two
Show the second button.
Show Content on Breakpoint
Show content on certain breakpoint.
Layout Settings
Show Title
Show or hide the title.
Show Text
Show/Hide the text element.
Content Reveal On Hover Widget Styling
There are a number of styling options that allow you to control every aspect of the widget’s design. Choose colors that complement the style of your website. You can modify the text, icons, fonts, and layout to make the widget look and work the way you want.
General Styling
Set the alignment, padding, box radius, border and content vertical alignment.
Transition Styling
You can set the transition time and title hover vertical gap.
Image Styling
You can set the image height, blend mode and positioning.
Overlay Styling
Here, you can set the overlay color, image, opacity and opacity hover.
Title Styling
You can set the title color and typography.
Text Styling
You can style the text color and typography.
Button Styling
Here, you can set the button typography, background color, text color, border, spacing, and padding.
Content Reveal On Hover Design Examples For Elementor
Here are some live use cases for the Content Reveal On Hover Widget.
Content reveal on hover content box for restaurant menu.
Content reveal on hover box for real estate.
We hope this documentation helps you unlock the full potential of the Content Reveal on Hover widget for your Elementor projects. Adding interactive and visually engaging elements to your website has never been easier. If you have any questions or need further assistance, feel free to reach out to our support team.