Modified 03 April 2017 by Ian Weatherhogg

When your site is created using files and folders from Google Drive, you can add your own style and design using CSS.

Styling your OverDRIVE site couldn't be easier.

The steps are simple and if you don’t know CSS, you can simply copy and paste the code in bold below.

When you are logged into your OverDRIVE site, click Settings , select Site Settings in the drop down menu, when the menu opens select Developers. In here you will see a JS and a CSS box. The CSS box is where you copy your code. Use our examples below and give it a go. Make sure you add a space between each snippet of code.

Background image: This code will set an image as the background for every page on your OverDRIVE site - you will need to edit the url so that it points to the image you wish to use.

/*add background image to page*/

body{

background-image:url("https://cdn.overdrive.io/images/backgrounds/pixabay.com/blue-88523_1920.jpg");

}

Add a background image to the site banner:

This code adds an image to the Banner of your OverDRIVE site, as above you will need to edit the url.

/*add background image to banner*/

div#od-banner {

background-image:url("https://cdn.overdrive.io/images/backgrounds/pixabay.com/blue-88523_1920.jpg");

}

If you have some styling ideas and want to share them with the OverDRIVE team and other OverDRIVE admins please send your code and description to us at helpdesk@overdrive.io - we will add the best ideas here.

For more information and help with CSS in OverDRIVE, click here.

About OverDRIVE

OverDRIVE is an Enterprise Content Management (ECM) system, that allows you to quickly and easily create great-looking workspaces and sites from your folders and files inside Google Drive, and other content from across Google Apps.