Hosting Tutorial & Guide

How to Add Full Screen Background Image in WordPress

updated on Jun 19, 2017
How to Add Full Screen Background Image in WordPress Since full screen backgrounds are a new trend for web design, you may also want to put a background image on your WordPress site which will span the screen regardless of the screen sizes. It is true that there are some themes on the market which allow you to set a full screen background image, but there are some instances when you have to find a way to make up for the shortage of your theme.

In most cases, you may be afraid to make your website crash if you edit the stylesheet or theme files. Therefore, you may just put your good idea aside. In fact, there is still an easy way available for you to set a full screen image as your background. An alternative to code is to rely on an exclusive plugin.

Add Full Screen Background Image in WordPress with Plugin

There are many exclusive plugins among which you should give high priority to Simple Full Screen Background Image since it provides a simple way to set an automatically scaled full screen background image. By using the plugin, you will find that things will be much easier than you imagined.

In order to install the plugin, you can either download the plugin manually and upload it to the /wp-content/plugins/ directory or directly access it from the Plugins > Add New page. To save your time, we advise you to choose the second method.

Simple Full Screen Background Image

Having the plugin activated, you should go to the Appearance > Fullscreen BG Image page where you are allowed to choose an image from your Media Library or upload an image from your local computer. As soon as you upload an image, you will see a confirmation screen with a preview for it. If you are satisfied with the display, then you need to press "Click Save". At this moment, you will see that your WordPress site has used the image you have selected as the background.

Choose Image

However, it does not mean that you are free to choose any images though they will automatically fill the browser. There are some tips for you to choose a proper background image.
  • The background image should not distract the attention of your visitors.
  • When you view your WordPress site, you need to pay attention that the background image will not destroy your layout which will lead to a bad using experience.
  • To shape your brand, a proper background image will do you a favor.
  • Since a small image will blur on larger screens, you are advised to choose an image which is larger than 1600×1200 px to guarantee the quality of your background image.

Full Screen Background Image PRO

The premium version distinguishes from the free one on the number of full screen background images. In detail, you are only allowed to set one image as your background with the free version while you are free to set unlimited images which vary from different contexts with the premium version.

Final Verdict

Besides a full screen background image, a video background will also help you attract visitors' attention and make your website look modern, so you might as well want to try adding a video background to WordPress. However, you should be cautious when adding videos because they are resource-intensive, which will slow down your site and worsen the user experience.