Monday 7 November 2011

Change the "Welcome" link font color in SharePoint



As part of configuring enterprise search for a company's portal, one of the requirements was changing the look and feel of the SearchCenter. In short, they wanted a very Google like UI - I.e. nothing too flashy or heavy.

So, I started off creating a minimal master page and adjusting the layouts - nothing major just positioning the controls etc.. Now, to change the appearance of the webparts required modifications to the default styles located in the core.css file and thanks to Heather Solomons CSS Reference Chart this was pretty much easy. But when it came to changing the font color of the "Welcome" link, changes to the styles mentioned by her weren't working....

Took me a while, but managed to find the solution by examining the source of the generated web page. Seems that the style in use for the font color of the "Welcome" link is: .ms-SPLink A:link,.ms-SPLink A:visited

To change the font color, modify the existing class like:

.ms-SPLink A:link,.ms-SPLink A:visited
{
color: #FFFFFF; /*#2A4666; this is the font color for the "Welcome" Link*/
text-decoration:none;
}

and if you want to change the font color on mouse over then add a new class:
.ms-SPLink A:hover
{

color: #66FFFF; /*this is the font color for the "Welcome" Link - mouse over*/
text-decoration:none;
}


Do remember that changes to the core.css file will result in changes that will be reflected all over the portal. So, if you only want the change to appear in on site don't go change the cosre.css file....