Color coding CSS based on site

Question

We are rebranding our Intranet and would like to use color as a method of helping people know their current location on the site. For example, collaboration sites local color might be green, projects yellow,  communities orange, etc. So there would be a few elements in the Master Page which would change to the "local" color when the user entered a new area of this Intranet. The Site Map will be a Viso slide which also demonstrates this color coordination with the current site.

What is the best way to achieve this? I am thinking that adding a relative CSS style sheet or somehow using a conditional statement in the Master Page might be the way but is there a better way to do this?I would prefer something that allows changes to a Master Page to be pushed down without over-writing the local area CSS color.

I am a Sharepoint Administrator knowledgable of Master Pages and CSS but not a developer so I need way to do this with SharePoint Designer.

Thanks for any ideas that you night have.

Answer 1

Hi ,

You can create different themes as per you requirement for different sites.Visit the link http://erikswenson.blogspot.com/2010/01/sharepoint-2010-themes.html for more help.

---

Please click "Propose As Answer" if a post solves your problem or "Vote As Helpful" if a post has been useful to you.

Answer 2

Without code and VS development...I think that you are onto something...place a custom CSS with the color coding locally on every site, then point the masterpage to a relative URL so that it picks up the 'site version' of the css.

Use this in the Masterpage(adapt the url...):

<SharePoint:CssRegistration ID="MySIteSTyleCSS" name="<%$SPUrl:~site/_catalogs/styles/sitestyles.css%>" After="corev4.css" runat="server" >

Regards

---

Thomas Balkeståhl - Technical Specialist - SharePoint - http://blksthl.wordpress.com

Answer 3

Hi,

if you activate SharePoint Server Publishing Site collection Feature and site features you can specify a custom CSS files for all of your sites from site settings => Master page(under look and feel). so you can use green CSS for one site and yellow CSS for another site.

Mustafa Yılmaz

Answer 4

More ideas; with JS it's posible to identify sites based on the structure levels (position by URL), by counting slashes you can do something based on conditions like apply different classes depending of the URL position.

/ C

---

Blog: chrisstahl.wordpress.com Twitter: @Cstahl

Answer 5

Thanks, Mustafa, this works perfectly for us.