How to Add a Background Image in WordPress in 2021?

Last updated on April 18th, 2022 at 08:54 pm

Would you like to add a background image to a WordPress website? Background images may be used to create your website appear more visually and engaging pleasing.

Inside the following informative guide, we’ll quickly explain how to add a background image for your WordPress website.

Read Also: Read our detailed guide on some facts about Hello  Dolly plugin. 

Method 1 # Insert a Background Image Making Use of Your WordPress Theme Setting

Popular WordPress themes include custom background support. This feature enables you to insert a background image into your WordPress website easily.

If your theme favours the custom background feature, we recommend using this system to add a background image for your WordPress website.

Must Read: Read our detailed guide on Hostinger Hosting. 

But if your theme does not encourage this particular feature, or you also don’t like how it implements background image, you may try other additional options mentioned inside this guide.

Firstly, you have to visit the admin dashboard and find the Appearance ->> and search Customize Page. This may establish the WordPress theme customizer at which it’s possible to change several theme settings while seeing a live preview of your site.

background img

Subsequently, you have to choose the background images option. The panel will slip and reveal to you the options to add or select background images for the site.

select bg

Click the pick image button to continue.

This may bring the WordPress media uploader pop up at which it’s possible to upload an image from the PC. You may even choose a previously uploaded image from your media library. You can also read detailed guide on how to upload pdf document.

attach background

Subsequently, you must click on the choose image button following uploading or picking the image you wish to utilize as background.

This may close the media uploader pop-up, and you also may see your chosen images preview in the theme customizer.

publish background image

Below the image, additionally you will be capable of seeing the background image choices. Beneath Preset, you can select exactly how you want the background image to be exhibited: Fit screen, fill screen, custom, or repeat.

You might also choose the background image positioning by clicking the arrows under. Clicking on the center will probably instantly align the picture to the center of this display.

Do not neglect to click the Save $ Publish button towards the top to save your setting. This really is you need included a background image to a WordPress site.

Must Read: Read our detailed guide on GeneratePress Theme. 

Go ahead and go to your site to watch it for action.

Method 2 # Insert a Custom Background Image in WordPress With a Plugin

This way will be much more elastic. It performs using any WordPress theme and lets you place multiple background images.

You could also place various backgrounds for any page, post, category, or even any other element of the WordPress website.

It automatically makes all of your background images full screen along with mobile responsive. This implies that the background images will instantly resize on their smaller apparatus. Read also detailed guide on rank website on Google. 

To start with you have to go to plugin  and type  Full Screen Background Pro in search box.  After search plugin click on install and activate the above plugin.

Upon activation, you have to go to the WordPress admin dashboard and select the Appearance and choose Full Screen BG Image to configure the plugin and request to add license key.

full screen background

It’s possible to receive this information from your email you received soon after purchasing the plugin or from your accounts to the plugin’s site.

Then you would like to goo through this Save Placing button to conserve changes. You’re now prepared to begin adding background images to the WordPress website.

Proceed up ahead of time and pick the Insert New Picture’ button onto the plug in’s preferences webpage. This will help you in the desktop image add display.

add new image

Proceed up ahead of time and pick the Add New Image button onto the plugin’s setting web page. This will help you towards the background image upload display.

Click the Choose Image button to upload or choose an image. Once you pick the image, you will have the ability to observe a live preview of the image on your display screen.

Subsequently, you want to provide a name for this particular image. This name is going to be used appropriately, which means that you may apply any such thing.

Fundamentally, You Wish to determine that you need that picture to function since the desktop page

Complete Screen Background Pro lets you place images as a global background, or you may pick from other site segments, including archives, categories, front or site pages.

Don’t forget to simply click the save image button to put away your desktop picture. You can add because many graphics as you would enjoy by visiting the Appearance->Full Scree BG Image Page .

If you place over one image worldwide, the plugin will immediately begin displaying the background image like a slide show.

You may adjust the time that it can take for an image to fade away, and the time after that, a brand new background image begins to evaporate.

time fade in

The time you input here is at milliseconds. If you need a background image to fade after 20 seconds, you have to input 20000.

Do not neglect to click the save options to put away the own changes.

Must Read: Read our detailed guide on SEMrush SEO Tools. 

Background Images For Page, Archive, and Post.

Full Screen Background Pro additionally lets you place background images for unmarried Page, Single-post, categories pages, tags, and much additional.

Simply edit the post/page in which you would like to display different background images.

You will also see the new Full Screen Background Image box beneath the post editor in the post edit display.

single post background

To use a background image for a specific category, you have to visit the Appearance -> Full Screen BG Image page and then click on the Add New Picture button.

After uploading your image, you can pick a category while as the context where you wish to display the background image.

category image

Following uploading your own picture, you’re able to select a category whereas the context exactly where you prefer to show the desktop picture.

Enter the particular category Id or even slug in which you wish to display the image.

Do not neglect to save your image to store your setting.

We expect that this short article helped you know how to add background image in WordPress.

Leave a comment