Use the Background & General Appearance and the Full-Width Browser Options sections of the SNO Design Options page to set the background options for your site's homepage.
The Inner Background is found in the Background & General Appearance section and is the area just behind all of the widget areas; for this area, you can choose a color and pattern.
The Outer Background is found in the Full-Width Browser Options section and is the area beyond the center of the page; for this area, you can choose a color, pattern, or image. From the Full-Width Browser Options section, above the options for Background colors, a dropdown menu allows you to set your site to have Defined Edges or have all horizontal elements stretch to Full Browser Width. If this option is set to Defined Edges, you will see your background color or you can add a custom background image; if it set to Full Browser Width, the Inner Background color and the Navigation Bars will stretch the full width of your screen.
Adding/Changing Background Image
Your new background image can be as small or large as you want it. You can use a large photo or a small image to create a patterned background. Some online tools can help you create a background pattern.
- Go to your SNO Design Options page under the Appearance tab on the left side of your WordPress dashboard.
- Open the Full-Width Browser Options section.
- In the first dropdown menu choose Defined Edges.
- Under the Outer Background dropdown menu choose Custom Image.
- Under Custom Background Image/Pattern, click on the Click to Upload Background Image button.
- After the image has uploaded, make sure the “Full Size” button is highlighted and then click the “Insert into Post” button.
- If you’re using a small image for a pattern, you should set the image to be Tiled. If you’re using a large image without tiling, you should set the background color to blend with your image.
- If you would like your large background image to scroll with your site, always remaining in the background, choose Fixed in the Background Image Position dropdown menu. If you would like your site to scroll away from your image, leaving just the background color the further down someone scrolls, choose Scroll in the Background Image Position dropdown.
- Click Save All Settings.