A Single Breadcrumb for All SharePoint Pages

February 8 2010 18 comments

SharePoint’s out-of-the-box breadcrumb control is kinda a strange animal. Basically you have three different kinds of breadcrumbs in SharePoint. Each of these breadcrumbs are using different provider for their back-end:

  • Layout Pages / Administration Pages use SPXmlContentMapProvider,
  • Publishing Pages use CurrentNavSiteMapProviderNoEncode, and
  • Form Pages (AllItems.aspx, EditForm.aspx, DisplayForm.aspx, etc.) use SPContentMapProvider

This is all fine, when you have different master pages, or when you override the master page’s breadcrumb place holder with appropriate breadcrumb control defined in your page layout. In out-of-the-box publishing site templates the breadcrumb handling goes something like this:

  • Application.master defines a breadcrumb for layouts pages
  • Publishing page layouts override master page’s (e.g. default.master) breadcrumb (either by overriding PlaceHolderTitleBreadcrumb, or hiding PlaceHolderTitleBreadcrumb and pushing a new one in PlaceHolderMain, like in DefaultLayout.aspx)
  • default.master defines a default breadcrumb that is used for everything else, like for example form pages, and non-publishing team site page layouts

All this creates a cruft in you page layouts, because you have to repeat the same overrides in all your page layouts. This is also a problem, when you want to have a single master page for all your pages (using an HttpModule to override application.master and setting both custom master and system master to point to the same master page).

This isn’t a problem if you replace the default breadcrumb with a more intelligent one. Here is a code for a generic breadcrumb control that works for all kinds of pages described above:

using System;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;
using Microsoft.SharePoint.Publishing;
using Microsoft.SharePoint.Publishing.Navigation;
using Microsoft.SharePoint.WebControls;

namespace Sininen.Meteoriitti.SharePoint.Web.UI
{
    public class Breadcrumb : UserControl
    {
        protected SiteMapPath ContentMap;
       
        public Breadcrumb()
        {
            Load += BreadcrumbLoad;
        }

        void BreadcrumbLoad(object sender, EventArgs e)
        {
            if (Page is UnsecuredLayoutsPageBase)
            {
                ContentMap.SiteMapProvider = "SPXmlContentMapProvider";
            }
            else if (Page is PublishingLayoutPage)
            {
                ContentMap.RenderCurrentNodeAsLink = false;
               
                var provider =
                    SiteMap.Providers["CurrentNavSiteMapProviderNoEncode"] as
                    PortalSiteMapProvider;

                if (provider != null)
                {
                    provider.IncludePages =
                        PortalSiteMapProvider.IncludeOption.Always;
                    ContentMap.Provider = provider;
                }
                else
                {
                    ContentMap.SiteMapProvider =
                        "CurrentNavSiteMapProviderNoEncode";
                }
            }
            else
            {
                ContentMap.SiteMapProvider = "SPContentMapProvider";
            }
        }
    }
}

And the ascx-file for the above code behind:

<div class="breadcrumb">
    <asp:SiteMapPath
        id="ContentMap"
        SkipLinkText=""
        NodeStyle-CssClass="ms-sitemapdirectional"
        runat="server" />
</div>

Now you just have to replace the PlaceHolderTitleBreadcrumb place holder’s content with the new breadcrumb user control in your master page.

Popularity: 7% [?]

18 comments to “A Single Breadcrumb for All SharePoint Pages”

  1. [...] check it out! These guys already have a batch of posts, ranging from topics like breadcrumb navigation all the way to an installation pitfall checklist. And more is coming… So if you’re into [...]

  2. Dilip Nikam says:

    Thanks Aapo …..

    Its solve my problem. Nice Article.

    Additional Web.config changes.

    Add below entry under your siteMap

  3. Janey says:

    This looks like JUST what I need!!! The OOB breadcrumbs don’t get it.

    However, I’m a designer and not a developer in SharePoint 2010, though I have been modifying the default master and CSS quite a bit to make it more user friendly.

    I have no idea where to plug in the code you provided on this page. And I have not dealt with any .aspx pages at all. Suggestions most appreciated.

  4. Kalle says:

    Well, this could be accomplished without coding, just placing this code (from v3) to the masterpage: <asp:SiteMapPath SiteMapProvider=”SPContentMapProvider” id=”ContentMap” SkipLinkText=”" RenderCurrentNodeAsLink=”true” NodeStyle-CssClass=”ms-sitemapdirectional” runat=”server” />

  5. Aapo Talvensaari says:

    Kalle,

    I’m sorry, but did you read the article? Please test your breadcrumb on these:

    1. Publishing Pages (/Pages/Default.aspx, /Pages/SubPage.aspx)
    2. Layouts Pages (/_Layouts/Settings.aspx, /_layouts/ListGeneralSettings.aspx)
    3. Forms Pages (AllItems.aspx, EditForm.aspx, etc.)

    Your solution doesn’t work. The whole point of this article was that you need to have different SiteMapProvider in different kind of pages. Your SPContentMapProvider is ok for Forms Pages.

  6. Kalle says:

    Well, as I have tested, it works on all those three pagetypes. This is the situation in SharePoint 2010 with publishing feature activated. I’m not saying your coding is wrong, I’m just pointing that “a single breadcrumb for all SharePoint pages” can be accomplished a little bit easier way.

  7. Janey says:

    Kalle,

    I am using SharePoint 2010 with the publishing feature activated. The code you list is exactly the code I am using after trying many other things. It works better than most, but it still does not cover all the 3 different items that Aapo lists.

    Example: I have a left nav set up for Discussion Boards as one of the items. When the user clicks on Discussion Boards, the breadcrumb just shows to the site name, and does not include Discussion Boards. If I drill down further to a particular discussion, then that particular discussion name will appear in the breadcrumb.

    And I’d love to get rid of the aggravating “Home” that appears in the breadcrumb for any site or subsite home. WTF were they thinking when they put that in there?

  8. Aapo Talvensaari says:

    Kalle and Janey,

    I have to re-try this with 2010, maybe things have changed a little bit. Kalle when I said it doesn’t work, I meant that it doesn’t render correct breadcrumb items. It renders breadcrumb, but not the breadcrumb that it should. I will come back to this after I have tested the different options in SP2010. This article was originally written for 2007.

    In 2010 they have this PopoutMenu breadcrumb with SharePoint:ListSiteMapPath that has by default these providers: SiteMapProviders=”SPSiteMapProvider,SPContentMapProvider”.

    Well… they gave us new top navigation and quick launch data providers, maybe they did something to breadcrumb too in 2010.

  9. Noob says:

    Hi..the sharepoint 2010 breadcrumb is killing me. I can’t get the masterpage to display the full breadcrumb AND with the flyout menu (like in document library).. I am having trouble find some good example for this. Do you have any ideas?

    I have used this, I think I copied it out from the original and edited it, but it rendered out duplicates of links its weird..

    I need it to be like this:
    Home > current site collection > subsite > document library > all documents (fly out menu)

    Home

    Please help! ;-(

  10. Noob says:

    Sorry one more, I have tried this.. this breadcrumb is really the trail that I want.

    How can I get the document fly out menu to work with this breadcrumb?

     

    Thanks

  11. Kalle says:

    One solution is to use jQuery and move/copy the 2010 default breadcrumb from dropdown menu and the fly-out -menu from titlearea to somewhere else. This is the easiest solution, if the only access is Sharepoint Designer and browser… Of course the solution from Aapo is more customizable and better for developers, who are familiar with Visual Studio and have access with Sharepoint hive.

  12. Joe says:

    Hi There,

    This article doesn’t provide enough guidance on how to implement these changes. Please provide more information on how to create the user control. where the code goes. Is VS required? What needs to be in SPD?

    Thank you,

  13. [...] span#ctl00_PlaceHolderTitleBreadcrumb_ContentMap { padding-left:10px; } I must give credit to this site for the bottom part of their post. This entry was posted in blog and tagged asp, css, [...]

  14. Vinod says:

    Hi,
    I want this feature as webpart. How to create as webpart I’m a Designer.
    As same the quicklauch to be as webpart any idea would be appreciate.

    thanks
    V

  15. Dan says:

    Aapo, would you be so kind as to explain how to implement this for us new to SharePoint development? Specifically, where does the first block of code you provide? And what about the second? I think others have posted similar comments asking for this, would appreciate your guidance.

  16. Thanks for this simple and straight forward solution!

  17. Charlie says:

    Hi,
    Im gonna jump in a year later and ask again, how to implement this code? Those of us new to Sharepoint development seem to be getting ignored across the internet. We cannot join your superior developers club without a little help…

  18. Hattie says:

    Thanks for another informative website. The place else may I am getting that type of info written in such an ideal
    way? I have a challenge that I am simply now running on,
    and I have been at the look out for such information.

Leave a Reply