Adding a background image

The Style Designer provides you with full control over the background of your site. You can use either a color or image as the background of your site. On certain styles, you also have the option to use a preset theme. 

To set a color as the background of your site, please follow these steps:

1. Click Style > Designer. Alternatively, click on the direct access icon to the right of your banner area (the small Color Palette icon next to the Refresh button).

2. The Style Designer will open on the left-hand side of the screen.

3. In the "Colors" section, click Page Background.


User-added image


4. Click Background Color.


User-added image


5. Select a color in the color picker or enter a hex color code.


User-added image


6. Click Save located at the bottom right-hand corner of the Style Designer. You will be asked, "Would you like to apply these changes to all pages?" You can either click Yes or No.


To add an image as the background of your site, please follow these steps:

1. Click Style > Designer. Alternatively, click on the direct access icon to the right of your banner area (the small Color Palette icon next to the Refresh button).

2. The Style Designer will open on the left-hand side of the screen.

3. In the "Colors" section, click Page Background.


User-added image


4. Click Edit, and then click Select Image.


User-added image


5. The File Manager will open. If your image has already been uploaded to your File Manager you will be able to browse and select it, alternatively click Upload Files to upload your image from your computer.


User-added image


6 Once your background image has been added to the Style Designer, the following editing options will be available:

  • Position - select the starting position of your background image.
  • Size - select the size of your background image.
  • Repeat - select if, and how, the background will be repeated.
  • Attachment - determine if the image is fixed, or scrolls with the rest of the page.
  • Background color - select a color to sit behind your background image (this option may hide the image).
  • Foreground color - select a color to sit in front of your background image (this option may hide the image). You can change the transparency of this color by moving the slider to the far right of the foreground color settings.

 

User-added image


7. Click Save located at the bottom right-hand corner of the Style Designer. You will be asked, "Would you like to apply these changes to all pages?" You can either click Yes or No.
 

To add a preset theme as the background of your site, please follow these steps (only available on select styles):

1. Click Style > Designer. Alternatively, click on the direct access icon to the right of your banner area (the small Color Palette icon next to the Refresh button).

 

User-added image


2. The Style Designer will open on the left-hand side of the screen.

3. In Presets, click Themes.

 

User-added image


4. Click on a theme to apply it to your site.

 

User-added image


5. Click Save located on the bottom right-hand corner of the Style Designer to save the theme to your site.

Please note: Some of our templates contain preset backgrounds, and you will not be able to change the backgrounds of these styles. If your current template does not support changing backgrounds, the categories "Theme" and "Backgrounds" simply won't appear within the Style Designer.

For more information on personalizing your template, please check out our tutorial: Personalize your Style.

Was this article helpful?
0 out of 0 found this helpful