WEEKEND SALE: Get 50% Off On Our UNLIMITED DOWNLOADS Annual Plan! Use Code "WKND" At Checkout

DOWNLOAD ALL NOW!

Search for a plugin or theme

How to Set a Background Image or Color to Any Page in Elementor

You are currently viewing How to Set a Background Image or Color to Any Page in Elementor

Background colors and images are some of the most effective ways to decorate and revive website pages.

A beautiful website won’t only be more enjoyable to visit, but it will convert much better than a standard one.

In this article, I’ll show you how to set a background image or color to any page in Elementor.

Different Ways to Set the Background

There are two different ways to set a background image or color to a page using the Elementor page builder.

Firstly, we will assign the desired style to the entire website, and in a second way, we will set the background to the <body> tag of a specific page.

If you set a background color or image globally to the entire website, it can still be overwritten by settings applied on a specific page.

If you’re looking for different sources for high-quality images, read how to add free images to the WordPress header article to get the complete list.

How to Set a Background Image or Color with Elementor

Setting up the background is an easy process and you can do it from inside the Elementor visual editor.

As mentioned above, there are two ways to set up the background image. First, let’s start by assigning the appearance or color to a specific page.

Set a Background for a Specific Page

To set a background to a specific page, edit the desired page with Elementor and click on the settings icon on the bottom left corner.

Page settings icon

Then, move over to the Style tab and select the background type you want, classic or gradient.

Background classic or gradient

If you choose the classic type, you’ll be able to set a solid color or an image that will cover the entire page.

After choosing a background image, options related to the image settings will be added, such as position, size, etc.

Background image options

However, if you choose the gradient option, you’ll assign two different colors that will blend.

Elementor widget libraries

Background gradient colors

When you’re happy with the results, save the changes.

This method will only affect the specific page you’re editing and not to any other page.

If you would like to set up a background image or color to all the pages at once, follow the steps below.

Set a Background to the entire website

To set a background pattern to the body tag of the entire website, one that will be applied to all the pages, open the Elementor screen of any page.

Then, click on the burger menu icon from the top left corner to open the global site settings.

Global settings Elementor

Then, click on the Site Settings option.

Elementor site settings options

Inside the global site settings options, navigate to the Background tab.

Global Background Settings

First, choose between a classic (solid color or image) to the gradient option inside the background tab.

If you choose the classic option, set up a solid color using the pallet or upload a photo to the library.

Alternatively, you can also use a color HEX code. To learn how to get the hex code, read our how to change link color in WordPress article.

Global background image

However, if you chose the gradient option, set two different colors that will blend.

Gradient body colors

When done, make sure to save the changes.

Once saved, navigate to a different page and verify that the new background appears there as well.

Related Articles

Conclusion

In this tutorial, you learned how to set a background image to a specific page or the entire website with Elementor.

Leave us a comment and let us know which method you used and from where you get your images.

Also, make sure to subscribe to our YouTube channel and like our page on Facebook.

Share on facebook
Share on twitter
Share on linkedin
Share on pinterest
Share on email

PluginsForWP

PluginsForWP is a website specializing in redistributing WordPress plugins and themes with a variety of knowledge about WordPress, internet marketing, and blogging.

Leave a Reply