Soliloquy Blog

WordPress slider tips, Tutorials and Resources.
Add a Background Image in WordPress

How to Add a Background Image in WordPress Theme

by Waseem Abbas on February 26, 2018 | Reader Disclosure

Do you want to add a fullscreen background image on your site? WordPress themes have a white background or default photo in the background. You can replace it with your custom image to attract visitors. In this tutorial, we will share how to add a background image in WordPress theme.

By default, it is an option in the WordPress themes to upload a new background photo. You can simply customize your site to add the image.

To add a background image in WordPress theme, you’ll need to follow these 4 steps:

  • Step 1. Login to WordPress site with your credentials
  • Step 2. Go to custom panel for background image settings
  • Step 3. Add your new background image and edit settings
  • Step 4. Publish the site to see your new background image

Ready to get started? Let’s go!

Step 1: Login to WordPress Site with Your Credentials

The first thing you need to do is login to your WordPress account with username and password to access the site.

Step 2: Go to Custom Panel for Background Image Settings

After login, you should go to Appearance » Customize from your WordPress admin backend. It will open the WordPress theme customizer with live preview.

You need to go to Background Image tab on the left side.

Background Image Tab

Now you can select or upload a new image to set as your theme background in WordPress.

Step 3: Add Your New Background Image and Edit Settings

You need to click on the Select Image button to add or select your background image for this site.

Select Image

It will open a pop up for you with your media library images. Simply select any previously uploaded image or add a new photo for the background.

Choose a Background Image

Once selected, click on the Choose Image button and this image will be set as a new background of your WordPress theme.

Background Image

Upon adding the background image, you can see its live preview on right side of the screen. You can also edit settings like preset, image position, size and more.

Step 4: Publish the Site to See Your New Background Image

When you are done with all the settings, go ahead and hit the Publish button in the custom panel. It will save the background image and display it to visitors.

Publish Site

You can change the background image or its settings anytime as you need.

That’s all. We hope this tutorial has helped you to learn how to add a background image in WordPress theme. You may also want to check out our guide on how to align images side by side in WordPress and learn about automatically renaming images.

If you like this tutorial, then please follow us on Facebook and Twitter for more free WordPress guides and resources.

Waseem Abbas is a content writer for SoliloquyWP and Envira Gallery.

Leave a Reply

We're glad you have chosen to leave a comment. Please keep in mind that all comments are moderated according to our privacy policy, and all links are nofollow. Do NOT use keywords in the name field. Let's have a personal and meaningful conversation.