Learning Center/OneLogin Documentation/User Documentation

Branding

Thomas Pedersen
posted this on March 31, 2010 10:08 pm

OneLogin allows you to rebrand the application to fit your corporate image. With very little effort, you can:

  • replace the OneLogin logo with your own
  • override styles for the web interface
  • override styles for email notifications

Directing users to a branded login page

In order to give users a branded login page, you must add a brand parameter to the login page URL. Typically, you would have a link to this page somewhere on an intranet.

    http://app.onelogin.com/login?brand=mybrand

After the first visit to this URL, OneLogin will remember the brand for subsequent visits.

Example CSS Template

The CSS below makes the background gray, the menu black and removes all the graphics from the menu items.

/*--- background color ---*/
.box {
  background: lightgray;
}

body {
  background: lightgray;
}

.bodybg {
  background: lightgray;
}

/*--- menu colors ---*/
.mainmenu ul li a, .submenu {
  background: black;
}

You can of course override any style you want, but this will cover the main elements on the page and get you started.

 

Comments

User photo
Neil Manchester

Where do I put the CSS?

Need to understand this a little more. Is the css hosted on the OneLogin servers or on my own?

Its a great feature once I understand how to use it.

February 21, 2011 07:43 am.
User photo
Thomas Pedersen
OneLogin Support

CSS is hosted on our server and injected into every page. You can enter the CSS under Account -> Branding.

February 21, 2011 07:46 am.
User photo
Chuck Daniels

Are those the only relevant styles that we can change? A more detailed branding/style guide would be helpful.

July 04, 2011 05:05 am.
User photo
Christian Pedersen
OneLogin Support

No, the entire stylesheet can be modified. The best way to experiment with the styles, is to download the Firebug extension for Firefox, and experiment with the different style. 

July 04, 2011 05:57 am.