In this post I’ll show you how you can retrieve something from the current user’s profile and then do something based of its value with a little help of jQuery and CSS. In this example I have used a typical AD field (office) that are imported into SharePoint’s profile information. You can use any field that exist as a property in the profile information like Country, manager, profile picture or even use a custom property in SharePoint.


Let’s say we want display something at the Intranet for those users that works in London and display some other stuff for the one’s that works in Paris. This can be used in a many different scenarios, hide/show web parts, controls or fields in the page layout or maybe set a cookie based on the value or do something related to the branding, redirect users to different pages and much more. Hopes this example gives you some ideas for a cool implementation of your own!

Let’s try this out

Use SharePoint Designer 2010 and open the custom master page, your custom CSS file and your JS file.

First you need to declare SPCWC tag prefix in your custom master page. It’s just to include the following line for example just below the last existing tag prefix

<%@ Register Tagprefix="SPSWC" Namespace="Microsoft.SharePoint.Portal.WebControls" Assembly="Microsoft.SharePoint.Portal, Version=, Culture=neutral, PublicKeyToken=71e9bce111e9429c" %>

Then you need to load and make the profile properties available through the pages that are connected to your custom master page. This attribute is needed for some of the properties, but in this example you don’t need it. You can for example paste the following tag just below the existing WebPartPages:SPWebPartManager tag.

<SPSWC:ProfilePropertyLoader id="m_objLoader" LoadFullProfileOfCurrentUser="true" runat="server"/>

Finally it’s time to include the HTML somewhere in your custom master page including the profile property value.

<div class="Office">
<SPSWC:ProfilePropertyValue PropertyName="Office" ApplyFormatting="false" runat="server"/>
<div class="OfficeOutput IfOffice s4-notdlg"></div>

Add the following script in an external JS file referenced from your master page.

var office = $('.Office > span').text();
if(office == 'Stockholm') {
$(".OfficeOutput").show().html('Working in Stockholm!');
else if(office == 'London') {
$(".OfficeOutput").show().html('Working in London!');
else {
// do something else

Add the following CSS in an external CSS file referenced from your custom master page.

.Office > span{display:none}
padding:4px; background-color:#304F6D;
color:#fff; font-family:"Segoe UI"; font-size:8pt

That’s all, hopes this gives some ideas or inspiration. Please comment if you have questions or if just want to discuss this.
/ Christian