Nick Hadlee's Blog on SharePoint and Other Occasional Rants…


Customise Breadcrumbs with jQuery the SharePoint Swiss-Army Knife
May 23, 2009, 2:22 pm
Filed under: Development, jQuery, SharePoint, WCM

Breadcrumbs in SharePoint seem to be a pet hate for many people, but they are a necessary evil as they provide a fundamental part of the SharePoint navigation. The stock standard SiteMapProvider SPContentMapProvider is good from within libraries and lists but is lousy for pages as described by Heather Solomon:

The main issue with the WSS site map provider is it will show directories you don’t want it to (mainly the Pages library) in the breadcrumb, and on some pages it will show ".aspx" on the end of the page name. The MOSS site map provider is more graceful, it just doesn’t show the list or library name in the breadcrumb.

So using the WSS breadcrumb we would get the following breadcrumb from within a library or list:

Site Name > Library or List Name > Folder Name

That is pretty useful for users, especially if they have a habit (I’m tempted to say bad habit!) of using folders to manage their content. The problem is what you see when viewing a page:

Site Name > Pages > PageName.aspx

What we really want to see is a very stripped down breadcrumb more like what the CurrentNavSiteMapProviderNoEncode provides:

Site Name

The best approach is to modify the relevant page layouts so we are using the CurrentNavSiteMapProviderNoEncode for our page level breadcrumbs. Then we have the SPContentMapProvider in the master page as the default breadcrumb provider and the nicer page level breadcrumb coming from CurrentNavSiteMapProviderNoEncode. The problem is what if we have lots of page layouts or even worse we don’t have any page layouts at our disposal – WSS or non publishing MOSS sites? Using a bit of jQuery we can mimic what the we could get with the CurrentNavSiteMapProviderNoEncode by using only the SPContentMapProvider breadcrumbs:

That might not be optimal jQuery (in fact I could almost guarantee its not so if anybody can suggest optimisations please let me know!) and this solution is not going to be very useful unless you can deploy it into your entire site via a web or site scoped feature. Jan Tielens provides a really good example on how to integrate jQuery into SharePoint using the AdditionalPageHead delegate control.

$(document).ready(function() {
	var pageIndex = -1;
	var offset = 2;
	var $spans = $("#ctl00_PlaceHolderTitleBreadcrumb_ContentMap > span");

	if($spans.eq($spans.length - 1).text().search(/\.aspx$/) > -1) {
		$spans.each(function(i) {
			if( $(this).text() == "Pages" ) {
				pageIndex = i;	
			}
		});	

		$spans.each(function(i) {
			if(i == (pageIndex - offset)) {
				$(this).addClass("ms-sitemapdirectional");
				var innerText = $(this).text();		
				$(this).empty();	
				$(this).text(innerText);
			} else if((pageIndex != -1) && (i > (pageIndex - offset))) {
				$(this).empty();
			}
		});
	}
});

Want to know more about jQuery? A simple google search on jQuery+SharePoint is a good start or take a look at what Jan Tielens or the guys and gals at End User SharePoint have got to say.

Advertisements


My SharePoint Saturday 16-05-09
May 16, 2009, 11:34 am
Filed under: Development, Search, SharePoint, WCM

I have so many posts in draft status and nothing ever getting published, therefore this is the super-quick-two-things-to-check-up-on-later post. As usual, at least of of late, the most interesting content I am finding is coming from twitter tweets. This just goes to show Joel Oleson’s post on the SharePoint community which talked about technologies like twitter is a fairly accurate reflection on the current state of things.

Via @harbars: Labs/samples for #SharePoint web content management on http://www.mssharepointdeveloper.com #WCM.

Via @SharePointMVPs: Matthew McDermott’s search session at Tech Ed OFC317 Search Challenges and Tricks

I must really get around to putting up those other posts!

[Updated 17-05-09]

A couple more interesting things from today:

Reza Alirezaei (@rezaal): Working with Structured Data in Microsoft Office SharePoint Server 2007 (Part 4): SharePoint Designer. Includes a nice demo on how to create a master/detail views on data with the incredibly useful Data Form Web Part.

Lars Fastrup: Microsoft SharePoint 2010 news from TechEd US 2009. Includes some interesting observations about new functionality/features in SharePoint 2010, like the office ribbon, gleaned by seeing it in action during some presentations.




%d bloggers like this: