What's WP
Find Everything Related to WordPress - Best Tutoriasl on WordPress!
How to Change Background for WordPress Website?

How to Change Background for WordPress Website?

This is a tutorial for WordPress beginners and newbies who are confused to change the background color for their websites. With careful steps and detailed explanations and illustrations, we believe you can successfully complete the process in few minutes.

In order to appeal visitors with stunning design, webmasters attach great importance on site appearance. Usually, people choose premium WordPress themes to customize their site looks. However, you still need to do some customizations for making the theme unique and compatible with your main content.

In general, changing background is extremely necessary as it greatly influences the site design and style. In the following, we just guide you to finish the operation by modifying the CSS code or changing Dashboard settings.

Change Background Through Dashboard

To change WordPress background, you can simply handle the process through Dashboard. First of all, log into your dashboard, and then go to Appearance -> Background. It brings you to the Custom Background page where you can set image background or select plain color.

For setting image as the background, you can choose an image from the local computer by clicking on Select File button or then upload it. Alternatively, you can choose an uploaded image from the media library. Once uploaded, it previews the effect so that you can easily judge whether the image is suitable for your site.

change background image

In addition, you can configure the below display options:

  • Position: Left, Center, Right
  • Repeat: No Repeat, Tile, Tile Horizontally, Tile Vertically
  • Attachment: Scroll or Fixed

If you don’t want to set image as the background, the software offers you a choice to change background with plain color. You can simply click on the Select Color button and open a color picker where you can easily choose the background as you like. As well, after you select the color, it also shows you the effect on Preview Section.

change background color

At last, remember to save changes by clicking on the below blue button no matter you set an image or color as the background. Now, when we visit the site, it displays the background as you set.

background change example

Change Background with Code

As the CSS file determines all site styles, you can change the CSS code to change the background color. For WordPress themes, the stylesheet is always named as style.css. Go to Appearance -> Editor to open this file. Then scroll down the file to the body section or you can search it by press Ctrl + F tab. You can see the body properties and background property value like the following

body code

To modify the background color, you can simply change the value of background property, such as

background-color: #4A79B5

If you want to set an image as the background, you need to add the url property, include the URL of the background image and set its display options.

background: #4A79B5 url(/wordpress/wp-content/uploads/2014/06/minimalistic-textures.jpg) repeat-x top left;

At last, click on the below Update File button to save changes and now you successfully complete the process with code.


Joyce is a professional writer & SEOer who loves trying new things and sharing the experience through blogging. She loves clean design, playing with different WordPress themes, SEO, etc. Very often, you could find her in various WordPress event as invited speakers.