Breadcrumbs in SF4
Hi,
Do I have to create a widget for Breadcrumbs now that it is not included in SF4.0?
Hello Chris,
You can use the standard ASP.NET SiteMapPath control and it will display navigation path of your website.
<
asp:SiteMapPath
ID
=
"SiteMapPath1"
Runat
=
"server"
></
asp:SiteMapPath
>
Thanks!
Ivan,
I tried that and it does not display the current node. Is it me or is there a problem with the sitefinity site map.
Many thanks,
Andrei
Hi Andrei,
I managed to reproduce the behavior with missing current node in the latest release. You can try using this code which should fox the issue
1. Template
<
asp:SiteMapPath
ID
=
"SiteMapPath1"
runat
=
"server"
RenderCurrentNodeAsLink
=
"true"
>
<
CurrentNodeTemplate
>
<
asp:HyperLink
runat
=
"server"
ID
=
"CurrentNodeLink"
></
asp:HyperLink
>
</
CurrentNodeTemplate
>
</
asp:SiteMapPath
>
protected
void
Page_Load(
object
sender, EventArgs e)
this
.SiteMapPath1.ItemCreated +=
new
SiteMapNodeItemEventHandler(SiteMapPath1_ItemCreated);
void
SiteMapPath1_ItemCreated(
object
sender, SiteMapNodeItemEventArgs e)
if
(e.Item.ItemType == SiteMapNodeItemType.Current)
var currentNode = GetCurrentPageNode();
var link = e.Item.FindControl(
"CurrentNodeLink"
)
as
HyperLink;
link.Text = currentNode.UrlName;
link.NavigateUrl = currentNode.UrlName;
public
static
PageSiteNode GetCurrentPageNode()
PageSiteNode result =
null
;
result = SiteMapBase.GetCurrentProvider().CurrentNode
as
PageSiteNode;
if
(result !=
null
)
result = SiteMapBase.GetFirstPageDataNode(result);
return
result;
Ivan,
That worked just fine. Will I need the fix with the full release, or is it just a bug?
Many thanks,
Andrei
---------------
P.S. How do people mark a post as "answer"???
Hello Andrei,
We will have a breadcrumb control in Q1 or Q2, until then you need to use this solution.
Greetings,
Ivan Dimitrov
the Telerik team
After reviewing several threads the following worked for my RC v4.0.992.0. Allowing for the current node Name field (Title property) to be displayed as well as the correct Url. Also removed the "Pages >" start node and added CssClass styling option.
Alot of thanks to others from: http://www.sitefinity.com/devnet/forums/sitefinity-4-x/general-discussions/asp-sitemappath-not-rendering-correctly.aspx
1. Template
<
asp:SiteMapPath
ID
=
"SiteMapPath1"
runat
=
"server"
RenderCurrentNodeAsLink
=
"true"
>
<
CurrentNodeTemplate
>
<
asp:HyperLink
runat
=
"server"
ID
=
"CurrentNodeLink"
></
asp:HyperLink
>
</
CurrentNodeTemplate
>
</
asp:SiteMapPath
>
protected
void
Page_Load(
object
sender, EventArgs e)
protected
override
void
OnInit(EventArgs e)
base
.OnInit(e);
SiteMapPath1.SkipLinkText = String.Empty;
SiteMapPath1.CssClass = CssClass;
SiteMapPath1.ItemCreated +=
new
SiteMapNodeItemEventHandler(SiteMapPath1_ItemCreated);
[CssClassProperty]
public
string
CssClass
get
;
set
;
void
SiteMapPath1_ItemCreated(
object
sender, SiteMapNodeItemEventArgs e)
if
(e.Item.ItemType == SiteMapNodeItemType.PathSeparator)
e.Item.CssClass = CssClass +
"Separator"
;
else
e.Item.CssClass = CssClass +
"Link"
;
// hide the root node, and it's following path separator
if
(e.Item.ItemIndex == 0 || (e.Item.ItemIndex == 1 && e.Item.ItemType == SiteMapNodeItemType.PathSeparator))
e.Item.Visible =
false
;
else
if
(e.Item.ItemType == SiteMapNodeItemType.Current)
using
(var sf = App.WorkWith())
var pageNode = sf.Page().PageManager.GetPageNode(
((Telerik.Sitefinity.Web.PageSiteNode)e.Item.SiteMapNode).Id);
var link = e.Item.FindControl(
"CurrentNodeLink"
)
as
HyperLink;
link.Text = pageNode.Title.Value;
link.NavigateUrl = (e.Item.SiteMapNode).Url.Replace(
"~/"
,
"/"
);
Hi,
I attempted to recreate what you stated above and I was able to successfully add the control to my toolbox. But when I try to drag the new control onto my page, I get the following error:
Could not load type 'SitefinityWebApp.Controls.CustomBreadcrumb'.
I'm not really a programmer and I don't want to bother my developers with this, but I'm really not sure what I did wrong.
Here's the exact code in my template:
<%@ Control Language="C#" AutoEventWireup="true" CodeBehind="CustomBreadcrumb.ascx.cs"
Inherits="SitefinityWebApp.Controls.CustomBreadcrumb" %>
<
asp:SiteMapPath
ID
=
"SiteMapPath1"
runat
=
"server"
RenderCurrentNodeAsLink
=
"true"
>
<
CurrentNodeTemplate
>
<
asp:HyperLink
runat
=
"server"
ID
=
"CurrentNodeLink"
></
asp:HyperLink
>
</
CurrentNodeTemplate
>
</
asp:SiteMapPath
>
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;
using System;
using System.Collections.Generic;
using System.Linq;
using Telerik.Sitefinity;
using Telerik.Sitefinity.Abstractions;
using Telerik.Sitefinity.Configuration;
using Telerik.Sitefinity.GenericContent.Model;
using Telerik.Sitefinity.Libraries.Model;
using Telerik.Sitefinity.Model;
using Telerik.Sitefinity.Modules.Pages.Configuration;
using Telerik.Sitefinity.Security.Model;
using Telerik.Sitefinity.Services;
using Telerik.Web.UI;
namespace SitefinityWebApp.Controls
public partial class CustomBreadcrumb : System.Web.UI.UserControl
protected void Page_Load(object sender, EventArgs e)
protected override void OnInit(EventArgs e)
base.OnInit(e);
SiteMapPath1.SkipLinkText = String.Empty;
SiteMapPath1.CssClass = CssClass;
SiteMapPath1.ItemCreated += new SiteMapNodeItemEventHandler(SiteMapPath1_ItemCreated);
[CssClassProperty]
public string CssClass
get; set;
void SiteMapPath1_ItemCreated(object sender, SiteMapNodeItemEventArgs e)
if (e.Item.ItemType == SiteMapNodeItemType.PathSeparator)
e.Item.CssClass = CssClass + "Separator";
else
e.Item.CssClass = CssClass + "Link";
// hide the root node, and it's following path separator
if (e.Item.ItemIndex == 0 || (e.Item.ItemIndex == 1 && e.Item.ItemType == SiteMapNodeItemType.PathSeparator))
e.Item.Visible = false;
else if (e.Item.ItemType == SiteMapNodeItemType.Current)
using (var sf = App.WorkWith())
var pageNode = sf.Page().PageManager.GetPageNode(
((Telerik.Sitefinity.Web.PageSiteNode)e.Item.SiteMapNode).Id);
var link = e.Item.FindControl("CurrentNodeLink") as HyperLink;
link.Text = pageNode.Title.Value;
link.NavigateUrl = (e.Item.SiteMapNode).Url.Replace("~/", "/");
Hi Orion,
The control is not registered properly. Please take a look at this post.
Kind regards,
Ivan Dimitrov
the Telerik team
I actually used that link to learn how to register new controls but I'm apparently doing something wrong. I'm attaching a screenshot of the parameters I currently have in place on this control.
Can you see something missing or wrong? I tried eliminating the space from the name and title fields but that hasn't made a difference yet.
I received a similar error at first and rebuilding the project in Visual Studio seemed to work. Telerik might be able to comment with a better solution though.
Fantastic! Thank you so much. Not being a programmer myself I had no idea I could just "rebuild" the project like that. I'm never let down by the Sitefinity community.
So the current node is rendering but what if you don't want it to be a hyperlink? I feel like since you're already on that page, it's pretty typical for for that text in the breadcrumb to not be a hyperlink.
I tried modifying this text in the template: RenderCurrentNodeAsLink="false" but that didn't seem to work.
Does anybody know how to modify the code I used above to remove the link from the current node?
Thanks!
Code to render the current node as a Label rather than a HyperLink.
1. Template
<
asp:SiteMapPath
ID
=
"SiteMapPath1"
runat
=
"server"
RenderCurrentNodeAsLink
=
"false"
>
<
CurrentNodeTemplate
>
<
asp:Label
runat
=
"server"
ID
=
"CurrentNodeItem"
></
asp:Label
>
</
CurrentNodeTemplate
>
</
asp:SiteMapPath
>
protected
void
Page_Load(
object
sender, EventArgs e)
protected
override
void
OnInit(EventArgs e)
base
.OnInit(e);
SiteMapPath1.SkipLinkText = String.Empty;
SiteMapPath1.CssClass = CssClass;
SiteMapPath1.ItemCreated +=
new
SiteMapNodeItemEventHandler(SiteMapPath1_ItemCreated);
[CssClassProperty]
public
string
CssClass
get
;
set
;
void
SiteMapPath1_ItemCreated(
object
sender, SiteMapNodeItemEventArgs e)
if
(e.Item.ItemType == SiteMapNodeItemType.PathSeparator)
e.Item.CssClass = CssClass +
"Separator"
;
else
e.Item.CssClass = CssClass +
"Link"
;
// hide the root node, and it's following path separator
if
(e.Item.ItemIndex == 0 || (e.Item.ItemIndex == 1 && e.Item.ItemType == SiteMapNodeItemType.PathSeparator))
e.Item.Visible =
false
;
else
if
(e.Item.ItemType == SiteMapNodeItemType.Current)
using
(var sf = App.WorkWith())
var pageNode = sf.Page().PageManager.GetPageNode(
((Telerik.Sitefinity.Web.PageSiteNode)e.Item.SiteMapNode).Id);
var currentNode = e.Item.FindControl(
"CurrentNodeItem"
)
as
Label;
currentNode.Text = pageNode.Title.Value;
That worked perfectly! Thank you very much.
Hey Ivan,
Has there been a date set for the release of the breadcrumb control? I have a project due at the end of March and I'm wondering if I should wait or try using the code work-around.
Thanks,
Jeff
Hi Jeffrey,
The implementation of this feature is scheduled for Q2 due in July.
Please, use the suggested workaround.
Greetings,
Kalina
the Telerik team
How do I add, "Home" to the beginning of the breadcrumb chain in this example code?
FYI: This no longer appears to work in the latest internal build. My sitemappath has completely disappeared.
Hello Zak,
Can you put a VS debugger point in ItemCreated
and see whether there are items? If so, then the problem is in the logic you copied.
Greetings,
Ivan Dimitrov
the Telerik team
There are apparently no items, as I never hit the breakpoint.
Hi Zak,
Subscribe for the event from the template OnItemCreated and the code you use should work. There are some issues when you do this from the code behind.
Greetings,
Ivan Dimitrov
the Telerik team
Hi Ivan,
I am using the last version of Sitefinity.
I have tried with both cases and it is not firing the ItemCreated event. Do you have any idea what can be the issue?
Thanks,
Armen
Same here. Our breadcrumbs have stopped working in sitefinity 4.1. We have tried wiring this up in the template, in the codebehind, and both.. None are working. Break points are hit in page load and init, but ItemCreated is never hit. Renaming the method in the codebehind while it is declared in the ascx file causes the compilation error you would expect ("SiteMap_ItemCreated does not exist"). But a breakpoint inside of SiteMap_ItemCreated never gets hit.
@Drew, I don't have the post handy but SiteMapPath is broken in Sitefinity 4.1 upgrade.
You can get around it by building it manually, not a real solution as the whole reason for paying for a CMS is that it's supposed to do this stuff already.
If I come across the post that has the manual solution (provided by Telerik) I'll post it here for you.
Cheers,
Phill
Thanks Phil, I appreciate the heads up. This looks like the post in question.
http://www.sitefinity.com/devnet/forums/sitefinity-4-x/general-discussions/internal-build-sitemappath-and-radsitemap-not-working.aspx
Thanks again,
Drew
Yes, that was the post I was thinking of. Pretty amazing that this bug got introduced, not sure how they didn't notice something like this.
A Breadcrumbs widget is now available on the Sitefinity Marketplace!
www.sitefinity.com/.../breadcrumbs-widget.aspx
Nelson,
Thanks for letting us know about the Breadcrumb control, but is there now a Breadcrumb control in 4.2 or not? If I have to I can use a third party breadcrumb control, but seeing this is pretty standard these days I'm surprised if it is not there yet as Q2 has come and gone. I hate having to rely on yet another company/developer to update their stuff as the Sitefinity version moves on.
However if it is in 4.2 I am not finding it.
Thanks,
Garry
Hi Garry,
We do not have the breadcrumb widget in 4.2, but it's planned for 4.3. We have posted some wireframes to showcase what we are thinking of it to be, in the UX Forum category.
Regards,Thank you for being the most amazing .NET community! Your unfailing support is what helps us charge forward! We'd appreciate your vote for Telerik in this year's DevProConnections Awards. We are competing in mind-blowing 20 categories and every vote counts! VOTE for Telerik NOW >>
Evening all,
I've tried using the most recent snippet of code but Im getting the following error, can anyone point me in the right dirtection as to what Im missing?
*blahblahblahblahblah*\UserControls\CustomBreadcrumb.ascx.cs(40): error CS0103: The name 'App' does not exist in the current context
I do not see where App is defined or referenced?
You need add a using directive at the top of the page to Telerik.Sitefinity
using Telerik.Sitefinity;
Or change
App.WorkWith() to Telerik.Sitefinity.App.WorkWith()
Ahhh all sorted, thank you sacpaker.
I'll blame it on being a long day but I think I was just being a little dim.
Iain
Hello Iain,
Could you please let me know where you were able to get the latest code snippet? Did you use the one mentioned in this post, as I did use the one here and the breadcrumb is not displaying anything.
Thank you for your time.