How to Add Background Images?

How to Add Background Images?

Astra version 1.3.0 and above provides a feature to add background images to various sections of the site.

You can enhance the design of the Body, Header, Content, Sidebar, and  Footer of your website with this option. In addition to the previous background color option now you can see the background image option as well.

Where can I find the option?

From your WordPress dashboard navigate to Appearance > Customize and under various areas, you will find settings to upload background images

Where can I add a background image to Astra theme?

With Astra theme, you get an option to add a  background image to following areas-

Body (?)Footer Widgets (?)Footer Bar (?)

Background image for Astra Pro Modules

In addition to Body, Footer Widgets, Footer Bar section, you get an option for following modules of Astra Pro –

Primary Header (?)Above Header (?)Below Header (?)Content (?)Sidebar (?)Note: Background option might be visible only if you have Colors & Background module enabled from Astra Pro.

Options for Background Image

Background image option allows you to choose an image from media library or you can upload a new file. After uploading the image, click on More Settings option. Now you can set following  CSS properties for the image –

RepeatBackground Image PositionBackground SizeBackground Attachment

You can adjust the background color overlay with color picker. A nice transparent layer of color above image will enhance the background image design.

 Important Notes:

After adding a background image, make sure to adjust the opacity of background color with color picker.Background applied to the body will not be visible for Full Width/ Stretched – Container Layout as in this layout width of the container is stretched to the fullest.

发表回复

您的电子邮箱地址不会被公开。 必填项已用 * 标注