How to Add Text Over Image Using Elementor

Table of Contents

Elementor is a powerful web builder that allows you to create beautiful web pages with ease. One of the most popular features of Elementor is the ability to add text over an image, making your pages more visually appealing and engaging. In this blog post, we will guide you on how to add text over an image using Elementor. We will take you through a step-by-step process, so you can easily learn how to create stunning pages that grab the attention of your audience.

Step 1: Choose an Image

The first step is to choose an image that you want to put text over. You can choose any image that suits your website or article. Once you have selected your image, add it to your webpage using the Image element in Elementor.

Step 2: Add a Text Element

After you have added the image, the next step is to add a text element. You can do this by dragging the Text element from the Elementor sidebar onto your page. Place the text element over the image, where you want the text to appear. You can also adjust the size of the text box to fit your text.

Step 3: Customize the Text Settings

Once you have added the text element, you can customize the text settings to suit your preference. You can change the font type, size, color, and alignment of the text. You can also add a background color, border or shadow to your text box. This will help your text stand out from the image in the background.

Step 4: Adjust the Image Overlay Settings

To make your text more visible, you can create an overlay on the image. You can add an overlay by clicking on the Overlay button in the Image Element settings. Select an overlay color that contrasts well with the text color. You can also adjust the opacity of the overlay to make the image a bit subdued and put the focus on the text.

Step 5: Preview and Publish

After you have applied all the settings, preview the page to see how it looks. If you’re satisfied with the result, publish the page. Congratulations! You have now added text over an image using Elementor.


Adding text over an image is a fantastic way to create engaging and visually appealing pages using Elementor. Whether you’re a blogger, business owner or web developer, using this feature can help you create beautiful and conversion-focused pages. Follow the above steps, and you’ll be on your way to creating pages that grab the attention of your audience. Don’t be afraid to test and explore further settings that will make your text-over-image stand out as unique from others. With the right combination of design and content, your website or blog will make your user’s experience an enjoyable and memorable one. So, go ahead and start creating with Elementor!

How to get started?

Learn more

Elementor Developers

Hire a flexible remote work force and undivided attention.

Get Started

Looking for help? Chat with us.

Are you in need of assistance or guidance? Look no further! Our dedicated team is here and ready to help. Chat with us today and let’s work together to find the perfect solution for your needs.

Our support team will get you:

I believe every website owner deserves a reliable professional support always by their side.

Alexey Seryapin
Founder of WPServices

Coupon Code Applied!

Take your time and continue browsing our services.

Alexey Seryapin
Founder of WPServices