26. How to change background style of your webpage?

26.1 Layout

To change background style of your webpage, select “Layout” tab from the top of the site editor.
You will get a window something like follows (depends on the design you choose from)

Background Style

1. Here you see the current preview of selected site.

2. To change the background properties click the link “Website Background” and you will get an interface as shown below.

Background Style

Here you get two options:

1. Using the first set of controls you can change background color. The new color will over-ride default style.

2. You can also set a background image to your website by using the second set of controls.



Note:

Either you can specify background color or you can define a background image for your webpage.
Also it is possible to set Background color and background images simultaneously.

26.2 Change Background Color

To define a background color, click the square next to the label “background color” and you will get a color picker as shown below.

Background Style

Choose the appropriate color by moving the selection on the color palate.

If you want to clear the selection, click on the link “Remove Color” and choose another color if required.

Click on SAVE to apply the background color. You can see the page something like the following:

Background Style

 

26.3 Apply Background Image

You can set a background image for a single occurrence or repeat in X direction or in Y direction or in both directions

Background Style

As mentioned above, use the second set of controls to add background image.

You have a file browser to specify image and a dropdown list which contains the various background tiling styles

By clicking on the file browser, you will get the file up-loader to select the image file.

After specifying, it will upload the file automatically and you see the window as follows.

Background Style

Choose the appropriate style of image tiling from the given list.

Click on SAVE to save the Settings.

Here is an example which shows the background image when selecting “Tile in X direction”

Background Style

This example shows the background image when select “Tile in both direction”

Background Style

Note: The appearance of the background image varies based on the size / dimensions of the image you have selected.

26.4 Edit an existing Background Image or color

If you want to change the image or color applied for background style, click on “Website Background” from layout tab and you can
see the editor as follows.

Background Style

To change the background color, click on “Remove Color” link.

To change the background image click on “Edit” and repeat the steps you followed in the previous attempt.

Also to change the Background tiling, choose the appropriate option from the list.

If you want to remove the background image, click on “Remove”.

After making the appropriate changes, click on SAVE to apply background style.