All Collections
Design your site
Custom CSS
Using an image as site background
Using an image as site background
Ashmita Taneja avatar
Written by Ashmita Taneja
Updated over a week ago

[Required Permissions: Account Administrator, Content Administrator, Editor, Author ]

The custom CSS below allows you to use an image as background for your site, which will be applied to subpages in the site, and all the sections in each subpages, if those subpages and sections have transparent background.

The image must be hosted online, and may have to be publicly accessible. Different content delivery services can accomplish this for you, and you may also use Zoomforth's utility to host your image. You can refer to this article about our native hosting utility. The user of our native hosting utility requires the role administrator access.

Custom CSS to use an image as site background

body {
   background: #fff url(https://res.cloudinary.com/dincfrj36/image/upload/v1574988338/Random%20stuff/sitebackground_snbln1.png);
   background-repeat: no-repeat;
   background-position: center;
   background-size: cover;
}


The second line is where the URL of the hosted image is to be paste. Replace everything in the parenthesis with your content URL.

Below are the ways on how you can add the custom CSS for you site:

1. Via the site editor

This isolates the custom CSS to applied only to the individual site, and doesn't require administrator access to accomplish. You can refer to this article for more details.

2. Via theme editor

Custom CSS applied through the theme editor affects all site using the theme. Administrator access is also required to pull up the theme editor and apply the changes. You can refer to this article for more details.

Did this answer your question?