Make sure you have installed Brand Premium plugin and have activated Brand Backgrounds in Settings > Brand Premium > Add-ons.
You can find your backgrounds settings in Appearance > Customizer. Here you can see the Backgrounds panel. For each section of this panel you can customize the background of the element.
For each element you can customize the following options:
Upload an image to use as background.
Image repetition. You can choose one of the following options:
- No repeat: no repetition;
- Repeat x: repeat the image horizontally;
- Repeat y: repeat the image vertically;
- Repeat: repeat the image in both directions.
This option sets whether a background image is fixed or scrolls with the rest of the page.
- Fixed: the background is fixed with regard to the viewport;
- Scroll: the background scrolls along with the element.
This option specifies the size of the background images.
- Auto: original size of the image;
- Full width: the background scrolls along with the element;
- Cover: Scale the background image to be as large as possible so that the background area is completely covered by the background image. Some parts of the background image may not be in view within the background positioning area;
- Contain: Scale the image to the largest size such that both its width and its height can fit inside the content area.
This option sets the starting position of the background image. The values can be:
- Keywords (top, left, bottom, right, center): a couple of this keyword. If you only specify one keyword, the other value will be “center”;
- x% y%: the first value is the horizontal position and the second value is the vertical. The top left corner is 0% 0%. The right bottom corner is 100% 100%. If you only specify one value, the other value will be 50%;
- xpos ypos: the first value is the horizontal position and the second value is the vertical. The top left corner is 0 0. Units can be pixels (0px 0px) or any other CSS units. If you only specify one value, the other value will be 50%. You can mix % and positions.
Use background image in single post and single page
You can choose a different background image for a single post or a single page.
In your WordPress Admin area go to the post or page editing screen. In the Brand Backgrounds metabox you can see a dropdown options list for each element where you can add background image.
You can choose between two options:
- Use Customizer options: uses the image you choose in the Customizer as background;
- Use custom background: uses a different image as background for that element;
If you choose use custom background a list of options will appear, the same that we saw in the Customizer.