The first thing any website visitor notices is the background color and font of a website. Agree? The background color gives a powerful impression of your business. Well, it’s one of the essentials of quality design.
The color and the website visuals reflect your brand, style, readability, and even professionalism. This is the reason why deciding the right background color in WordPress is the priority design choice. But do you know how to change WordPress background color?
With different WordPress themes, there comes an array of customization options. A few allow you to change everything right away while others offer limited options. You can also change header color in WordPress.
A few assume that everything is done only if you have coding knowledge. However, that’s not true because website owners may not know how to program professionally. In fact, the majority of the users use a layman’s solution for customization. Among these, changing background color is one common issue.
If you are not satisfied with the current color, we advise you to change WordPress background color and customize it to enhance the website’s expressiveness. This way you can better emphasize content as well.
This guide will help you to change the background color in WordPress with three different yet simple methods.
Methods to Change WordPress Background Color
Method 1: WordPress Customizer to change WordPress background-color
WordPress Theme Customizer method is especially for those who don’t want to indulge in any sort of coding. It is the simplest way to change WordPress background color.
Login to the WordPress dashboard and navigate to Appearance > Customize.
The left column will display all the available options. You can then edit various sections of your themes. This may include menu, homepage, footer, widgets, background image, logo, etc.
You can choose any WordPress theme, but we suggest you use the Hestia Theme.
Click on the “Appearance Settings” options from the left menu. Then select the color from the background color option. Next, you need to enter your favorite Hex color code in the given space. If you don’t want to move ahead this way, you have the option of utilizing the color picker tool to choose the background color of your choice. Once chosen, click “Publish“.
Besides colors, certain themes allow you to place images and other visuals. You can then upload the background image after selecting it from the media library. In addition to this, you can also set the position, repetition, underlying or overlaying color, etc.
Method 2: Add CSS to change WordPress background-color
If you are a bit familiar with CSS, you can make simple customizations by adding custom code. It’s nothing too advanced, especially for setting the background color.
You can easily change WordPress background color with a CSS panel that comes with a WordPress Theme Customizer. In addition, you can also change blog name on WordPress.
- Go to Appearance > Customize. Scroll down the menu and select the “Additional CSS” tab at the bottom.
- Enter the code below mentioned in the Additional CSS tab.
body {
background-color: #FFFFFF;
}
Note: Replace the hex color code with another code as per your background color choice.
- Finalize the color by clicking on “Publish”.
Method 3: Change WordPress background color for a single page
If you don’t want to change the background color of the complete website, you can also change it for a single page.
Follow these steps for the best results.
Step 1: Look for WordPress page ID
- Go to Pages>All pages
- Next hover your mouse over the “Edit” link of the page for which you want to change the background color.
- Note the page id that appears at the bottom of the screen.
- The ID will be the number after post=.
- This ID will help you to change the background color of the single page.
Step 2: Add CSS Code
Another way is to find the CSS class of any specific page by visiting that page on the front end. Next, right-click anywhere on the page. View page source is then selected.
Press Ctrl+F(or CMD+F on macOS) and look for page-id in the search bar. Note down this id CSS class (the id is usually in the <body> tag).
Wrapping Up
You can try all the aforementioned approaches to personalize your website. Finally, we hope this article helped you to change WordPress background color.