Monday, May 3, 2010

Display Breadcrumbs Trail in a simple way

Here is very crisp and short way of implementing Breadcrumb for ASP.net Website.

Create a Link for Home,link for primary link and if you have secondary link and a label to display page user enterd.
HyperlinkHome>[hyperlink1]>>[hyperlink2]>[lblPageName].

Create 3 properties for Primarylink1 and secondarylink(if any) and for label.
public string primarylinkpagecode{ get; set; }
public string primarylinkpageText { get; set; }
public string SecondarylinkpagecodeCode { get; set; }
public string SecondarylinkpageText { get; set; }
public string PageTitle { get; set; }
The page's which are going to utilize this breadcrumb should pass the respective values to the above properties.

Ex:
Home>Cameras>Sony>Sony cybershot
UCBreadCrum.Link1Code = Cameras;
UCBreadCrum.LinkText = Cameras;
UCBreadCrum.Link2Code = Sony;
UCBreadCrum.Link2Text = Sony;
UCBreadCrum.Title = Sony Cybershot;

If you have any static pages and want to implement breadcrumbs below are value and properites to be passed.

1.Breadcrumb for a static
Home>Company


Link2Code="static"
Link2Text="Company"
2.If you want to display breadcrumb trial as
Home>Company>About us the

Link2Code="static"
Link2Text="Company"
Title="About uS"
And Keep the URL for Company in web.cofig and make sure the Like2TExt(Company) and web.config key name should be same(Even same case) .



below sample code for Displaying Breadcrumb for static page.

if (Link2Code == "static")
{
lbl1.Visible = true;
lbl2.Visible = false;
lbl3.Visible = true;
hlHome.Visible = true;
hlHome.Text = "Home";
hlHome.NavigateUrl = "../Forms/Index.aspx";
hlLink2.Text = " " + Linke2Text + " ";
hlLink2.Visible = true;
lblName.Text = " " + Title;
lblName.Visible = true;
hlLink2.NavigateUrl = System.Configuration.ConfigurationManager.AppSettings[Linke2Text];
}


If you need more information on implementing breadcrumb for dynamic content pages like any detail pages ,let me know.

Happy coding

No comments: