Change Your Site’s Background

Use the Styles option to change the background color of your entire site. To change the background color, follow these steps:

1. In your dashboard, navigate to Appearance → Editor.
2. Click on the Styles menu option on the left or select the “Styles” icon at the top right of your editor. The icon looks like a black-and-white circle.
3. Click on the “Colors” option.
4. Click on the “Background” option.
5. Select your desired color using the color picker. You can choose a solid color or define a gradient.
6. Click the “Save” button to apply your background color to the website.

If your classic WordPress theme supports adding colors and backgrounds, you can follow these steps to set a background color:

1. Visit your site’s dashboard.
2. Navigate to Appearance → Customize.
3. Click on the “Colors & Backgrounds” tab.
   • If you don’t have “Colors & Backgrounds” under Customize, your theme does not support changing the colors and backgrounds. We recommend switching to a site editor theme for full control over your site. 
4. On the next screen, view the “Background” setting. Customize your site’s background by clicking into each of the corresponding numbered sections as explained below:

1. Click into the colored box area to pull up the options available for customizing the background on your theme.
2. Click on “Palettes” to select a new color palette for your site.
3. Click “Select Image” to choose an image to use for your background (background images are explained in the next section of this guide). This option will only appear if your theme supports background images.
4. Click on any of the automatic color suggestions to use it for your site.
5. Click on the “pick your own color” link to open up the color picker and use it to set a custom color for your background.
6. Click on any pattern to use it as the background for your site.
7. Click on the “More” button to load additional patterns to choose from. After you’ve clicked the “More” button once, a “Back” button will appear next to it. You can use it to load the previous patterns within the selection. Background patterns are provided by COLOURlovers.

Use the styles option to change the background image for your entire site. To add, remove, or change a background image for your site, follow these steps:

1. In your dashboard, navigate to Appearance → Editor.
2. Click on the Styles menu option on the left or select the “Styles” icon at the top right of your editor. The icon looks like a black-and-white circle.
3. Click on the “Layout” option.
4. Click the “Add background image” button to select an image from your Media Library or upload an image from your computer.
5. Optionally, configure the following additional settings:
   • Position: Set the focal point of the image you want focused on smaller screens that can’t show the full image. You can drag the circle in the image or specify the exact position using the “left” and “top” percentage options.
   • Size: Choose from cover (the image covers the space evenly), contain (the image scales to remain fully visible), or tile (if the image width is smaller than the screen, the image repeats to fill the space).
6. Click the “Save” button to apply the background image to your website.

If you want to set a background image on a specific part of a page or template but not the whole site, you can use the Group block to group the content and apply background settings.

If your classic WordPress theme supports adding colors and backgrounds, you can follow these steps to set a background image:

1. Visit your site’s dashboard.
2. Navigate to Appearance → Customize.
3. Click on the “Colors & Backgrounds” tab.
   • If you don’t have “Colors & Backgrounds” under Customize, your theme does not support changing the colors and backgrounds. We recommend switching to a site editor theme for full control over your site. 
4. Click “Select Image” to choose an image to use for your background. This option will only appear if your theme supports background images.
5. After you’ve selected an image, an “Options” button will appear directly below it. Click on that, and you’ll find several settings to manage the display of your background image, as explained below:

1. Click “Select Image” to choose an existing image from your media library, or upload a new one.
2. Click “Options” to open up the additional settings for your background image display.
3. Click on the icons to adjust the position of your background image.
   • Position controls where the background image is aligned: left, center or right.
   • Repeat determines if an image appears once, repeats vertically, repeats horizontally, or tiles.
   • Fixed Position means the image stays fixed in place when you scroll up and down the page.
   • Underlying Color is the color that loads behind the background image.
4. Click into the colored box to open up the color picker, where you can select a different “Underlying Color” for your background.
5. Click “Hide background image” to remove the current image and select a different one, or use a solid background color or pattern instead.
6. Click the “Save Changes” button at the top of the screen to save your background: