To add further styling to your Overdrive site, paste these snippets into the CSS box in Site Settings > Developers.

If you don`t know CSS, simply copy and paste each snippet (in the grey box) you wish to try out, adding a line space in between each one.

Hide the breadcrumb bar

You can hide the breadcrumb bar on any page from Page Settings > Layout, but this code will allow you to hide it for all pages.

/*hide breadcrumb bar*/
.od-breadcrumb-container {display: none;}

Remove empty table on pages with no content

This code will stop the Folder tables showing if there is no content on a page.

/*hide empty datatables*/
[od-ajax-records-total="0"] {display:none;}

Include a separate CSS file

Text files (and images) on your site can be accessed directly by inserting /assets/bypath at start of the URL.
Important: @import statements need to be at the top of the CSS input box.

@import url("/assets/bypath/assets/css_/sample.css");


There is lots more styling that can be done in Overdrive if you know CSS or Javascript, just add your code into the relevant boxes in Site Settings > Developers.

If you have some styling or customisation ideas and want to share them with us and other Overdrive admins please send your code and description to us at helpdesk@overdrive.io - we will add the best ideas here. If you don`t know CSS but have an styling idea, just send us the description and we`ll get our team onto it for you!