Fixing SharePoint’s Wiki by adding a home button and repairing the breadcrumb

Posted at: 11:41 on 04 August 2009 by Muhimbi

loopback It has been less than a week since we released our free SharePoint Infuser and we are already at our third blog posting.

Today we are fixing something that has been bothering us for a long time, which is the lack of proper navigation in the SharePoint Wiki, particularly the lack of a ‘home’ button and the fact that the Breadcrumb navigates to allitems.aspx. Grrrrrr.

So, in order to fix this we use SharePoint Infuser to insert the appropriate JavaScript into every Wiki Page in one go. Similar workarounds have been available for a while, but they need to be applied to each wiki page separately, which isn’t a scalable solution.

We are using Chris Chapman’s article on how to add buttons to the Wiki Toolbar as a starting point, we then add some JQuery magic to locate the appropriate breadcrumb link and set its URL to the wiki home page in a way that works across different languages as this page is not always called ‘home.aspx’.

 WikiHome


Follow the steps outlined below to implement the changes on your Wiki:

  1. Download and install Muhimbi’s SharePoint Infuser on one of your Web Front End Servers.
     
  2. Ensure you have Designer privileges, more specifically the Add and Customize Pages right.
     
  3. From the Site Actions / Site Settings screen, select Infuse custom content in the Look and Feel column.
     
  4. Copy the script at the end of this posting and paste it into Infuser’s code window. If you are using IE then you may want to paste it in WordPad first , otherwise all line breaks are stripped out.
     
  5. Click the Save button and navigate to any Wiki page.
     

Note that the script below works without modification on a ‘Wiki Page Library’. In order to make it work on a ‘Wiki Site’ change the ‘wikiHome’ variable to ‘../’ or whatever the equivalent of ‘home.aspx’ is in your language.

<!-- Load the JQuery Libraries that ship with Infuser -->
<script type="text/javascript" src="/_layouts/Muhimbi.Infuser/JQuery/jquery-1.3.2.min.js"></script>
 
<script type="text/javascript">
    function addWikiHomeButton()
    {
        // ** Are we on a wiki page?
        if($("table.ms-wikitoolbar").length > 0)
        {
            // Wiki home page that works across multiple languages
            var wikiHome = ".";
 
            // Fix the breadcrumb title
            $("span[id$=PlaceHolderTitleBreadcrumb_ContentMap] a:last").attr("href", wikiHome);
 
            // make copies of the layout cells for the wiki toolbar
            var $tdSeparator = $("table.ms-wikitoolbar tbody tr td.ms-separator:first").clone();
            var $tdToolbar = $("table.ms-wikitoolbar tbody tr td.ms-toolbar:first").clone();
            var $tdLastCell = $("table.ms-wikitoolbar tbody tr td.ms-toolbar[width]:last").clone();
            var $parent = $("table.ms-wikitoolbar tbody tr td.ms-toolbar[width]:last").parent();
 
            // remove the last TD element (padding)
            $("table.ms-wikitoolbar tbody tr td.ms-toolbar[width]:last").remove();
 
            // now build a link
            var $select = "<a href='" + wikiHome + "' class='ms-toolbar'>Wiki Home<a>";
 
            // add a separator pipe, append the link and then the padding
            $parent.append($tdSeparator).append("<td class='ms-toolbar' nowrap>" +
            $select + "</td>").append($tdLastCell);
        }
    }
 
    jQuery.event.add(document, "ready", addWikiHomeButton);
</script>

.

Labels: , ,

3 Comments:

  • How do I add breadcrumbs or some sort of navigation to a document library? Users are getting lost when they have to drill down into folders,etc.

    By Anonymous Anonymous, At 23 December, 2009 00:19  

  • Although anything is possible depending on your requirements, I am not sure if there is an easy solution.

    Have a look at http://www.endusersharepoint.com. They have an excellent set of articles about customising pretty much any part of SharePoint without the need for any kind of server side changes.

    By Blogger Muhimbi, At 23 December, 2009 08:47  

  • Will this bread-crumb display the parent-child hierarchy as well or are you always destined to go to the home page ?

    Is something like the following even possible in Sharepoint wiki ?

    home->SDLC->Coding Standards->Java

    Sharepoint wiki is a joke ! It deserves the same punishment as that printer got in OfficeSpace.

    By Blogger Rajiv Kadayam, At 17 May, 2012 17:17  

Post a Comment

Subscribe to Post Comments [Atom]

Subscribe to News feed

Headlines
Archives