Workstack allows you to customize the look and feel of the interface to match your organization's branding.
However, before you get started you'll need to know (or at least know someone else) who knows CSS and web coding.


Customizing the CSS

There is an input field named Custom CSS that allows you to paste in your own CSS code to style the Workstack interface.

You can find this field in the Calendar Preferences or in your Personal Settings within the admin section.

Custom CSS in Calendar Preferences

Note: The example CSS code shown has rebranded the left-hand toolbar and logo - it uses the following CSS code:

----------------------------------------------------------
#team-menu {
    background: #503638;
}
#team-menu-zoom-slider {
    background-color: rgba(0,0,0,0.6);
}
#team-menu-zoom-slider .ui-slider-handle {
    background-color: #7f5e61;
}
.cube-off {
    background: #503638 url(http://stylemba.net/wp-content/uploads/2012/04/Nike-Golf-Square-Logo-300x300.png) no-repeat;
    background-size: 100%;
}
.cube-on {
    background: #503638;
}
----------------------------------------------------------


Things to remember

Every time you make a change to the CSS code you will need to refresh the browser in order to see the changes take effect.

Custom CSS only changes the front-end interface of Workstack and does not style the admin screens.

The CSS changes are on a per user basis so if you wanted all users on your team to see the changes they would need to update their own Custom CSS fields with the same code.

Did this answer your question?