Try Now
More in this section

Forums / Developing with Sitefinity / Breadcrumbs customisation

Breadcrumbs customisation

4 posts, 0 answered
  1. Peter
    Peter avatar
    30 posts
    08 Dec 2010
    08 Dec 2010
    Link to this post

    I need to modify sitefinity's breadcrumbs from this:


    to this:

    Home > 

    So if the breadcrumb is on the root page, it needs to have the > after it.
    Im an absolute beginner, so go easy on me!

  2. Ivan Dimitrov
    Ivan Dimitrov avatar
    16072 posts
    25 Oct 2016
    08 Dec 2010
    Link to this post
    Hi Peter,

    You have to create a custom class that inherits from Breadcrumb and override Initializecontrols method where you can change the way that the item will be rendered

    protected override void InitializeItem(SiteMapNodeItem item)
    SiteMapNode node1 = item.SiteMapNode;
     if(node1.Title == "Home")
           Literal literal2 = new Literal();
           literal2.Mode = LiteralMode.Encode;
           literal2.Text = node1.Title + ";

    Best wishes,
    Ivan Dimitrov
    the Telerik team
    Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Public Issue Tracking system and vote to affect the priority of the items
  3. James@Nw
    James@Nw avatar
    265 posts
    05 May 2009
    08 Dec 2010
    Link to this post
    Hi Ivan,

    Thanks for getting back to us. Can you please give us a step by step process on how to do this please?

  4. Jacques
    Jacques avatar
    427 posts
    28 Jun 2007
    09 Dec 2010
    Link to this post
    Hopefully this might prove useful to someone. Here's how we managed to get this working.

    1. We created a class in the App_Code folder called CustomBreadcrumb.cs
    2. We surrounded the class with a namespace CompanyName.Extensions
    using System;
    using System.Collections.Generic;
    using System.Linq;
    using System.Web;
    using System.Web.UI.WebControls;
    namespace CompanyName.Extensions

    3. We inherited from Telerik's breadcrumb class
    namespace CompanyName.Extensions
        public class CustomBreadcrumb : Telerik.Cms.Web.UI.Breadcrumb

    4.We overrode the InitializeItem method as suggested and placed conditional statements in to insure that only current items get an extra ">" literal added to it.
    protected override void InitializeItem(System.Web.UI.WebControls.SiteMapNodeItem item)
        //if this item is not a path separator
        if (item.ItemType != SiteMapNodeItemType.PathSeparator)
            SiteMapNode node = item.SiteMapNode;
            //express the condition to add the extra literal
            bool condition = (item.ItemType == SiteMapNodeItemType.Current);
            //if the node does not child nodes
            if (condition)
                //create a literal control
                Literal literal = new Literal();
                //set the mode to encode
                literal.Mode = LiteralMode.Encode;
                //add the text and >
                literal.Text = " > ";
                //add the literal to the control collection

    5. Finally we added a reference to the custom control in the web.config file under the telerik>cms>toolboxControls node as follows:
    <add name="Custom Breadcrumb" section="Navigation" type="CompanyName.Extensions.CustomBreadcrumb, App_Code"/>

Register for webinar
4 posts, 0 answered