We’re with you! We're offering 20% Discount Coupon Code: ENJOY20 Buy Now

25+ Elementor Text Over Image Effect Collection

hover text over image

For Elementor users adding elementor text over image is not a big deal. You can add a nice elementor image with text overlay with Master Addons. Image hover effects widget included as a free element of Master Addons for Elementor Plugin.

Sometimes it’s necessary to implement hover text over image. In some cases, you need to insert multiple images inside a webpage. It’s better to explain each image using text. It looks odd if you place a caption for each image. Hover text over image will help you to figure out this.

There are more than 25+ unique hover effects available. We have developed nice CSS image hover effects that will make your webpage more understandable.

If you want a popup on image click on hover effects, then you can do it too. The individual border-radius system will help you to create a different shape for your image.

I’m going to show you every step to achieve the best image hover effects. check some elementor text over image demo.

Make sure to download and configure Master Addons on your WordPress website. Free Elementor page builder required to work with Master Addons plugin.

Adding elementor text over image

Drag Image hover effects element to your elementor page editor. You will get the element inside master addons element collection section. Take a look at the following screenshot and be familiar with the element.

elementor text over image element

It will show you a notice to select image. Upload your image via WordPress media library and select the image. Now it’s time to define the best image hover effect for your image. You will see a lot of pre-built effects like the screenshot. Test one by one and choose the perfect one that suits your page properly.

image hover effects selection

You have three option to select, None, Popup, and External links. This all works on image click. If you want only image hover effects then select none for mouse click. Perhaps, if you want popup or external links on click then select whether you want. There are 5 different popup content, image, content, saved section, saved widget, and saved page template. 

You can see Heading, Description options underneeth the previous popup option. Just input your content inside the heading and des option. You able to see the content instantly inside your image hover effects element. 

Image Hover Effects Style

Now it’s time to check the style option. Within the style area you able to select typo, change color, background color. There are image, title, description, and social media sections available. For image styling – you can choose background color, image opacity, border, image filter. For title and description, you will get typo change, color, and box-shadow option. Lastly, for social media, you will see color and hover color options there.

image hover effects elementor

That’s all about image hover effects. Arrange your text nicely on your desired image and apply a perfect hover effect to your image. There are some effects which available on free but if you want to get all effects, you should upgrade the plugin.

Posted in Tutorials

This is Roy and I produce content, Video, Documentation for Master Addons plugin User. Keeping you update through posts, videos is my duty. Also, I provide support for any users to solve their problems.

Get Elementor Pro

convinced enough to purchase

Download Now and Speed up your design skill

Still confused? Try 14 days Free Tiral before Purchase. Don't hesitate, we offer hassle free 30-day money-back guarantee.

Subscribe to our Newsletter

Share via
Share this

Master Addons Demos

Heading

Animated Headlines
Dual Heading
Gradient Headline

Image

Image Hover Effects
Image Hotspot
Filterable Image Gallery
Image Comparison
Gallery Slider
Advanced Image

Content

Advanced Accordion
Tabs
Toggle Content
Team Member
Team Slider
Infobox
Flipbox
Blog
Timeline
Business Hours
Pricing Table
Restrict Content
Dynamic Table

Special Elements

Call to Action
Tooltip
Progress Bar
Progress Bars
Creative Button
Creative Links
News Ticker
Table of Contents
Current Time
Domain Search
Nav Menu
Search
Blockquote
Counter Up
Countdown Timer

Extensions

Particles
Animated Gradient BG
Reading Progress Bar
Background Slider
Custom CSS
Custom JS
Positioning
Container Extras
Mega Menu
Entrance Animation
Transforms
Rellax
Reveal
Header,Footer,Comment
Display Conditions
Dynamic Tags
Floating Effects
Custom Breakpoints
Post/Page Duplicator
Wrapper Link

Contact Form

Contact Form 7
Ninja Form
WP Forms
Gravity Forms
Caldera Forms
weForms