One of the useful elements that a website should have (especially if it is a large site) is breadcrumb navigation. It allows the user to easily see where they are located within the site, and provides an easy way to get back to other pages within the hierarchy of the site.
Creating breadcrumb navigation for a concrete5 site is easy – it simply involves creating a custom template for the Auto-Nav block. This is accomplished with a single PHP file.
Step 1
Create a new PHP file, add the following code below, and save it as breadcrumb.php.
<?php
defined('C5_EXECUTE') or die(_("Access Denied."));
$aBlocks = $controller->generateNav();
global $c;
//output
show_breadcrumb($c);
function show_breadcrumb($c){
$nh=Loader::helper('navigation');
$breadcrumb=$nh->getTrailToCollection($c);
krsort($breadcrumb);
foreach($breadcrumb as $bcpage){
echo'<a href="'.BASE_URL.DIR_REL.$bcpage->getCollectionPath().'/">'.$bcpage->getCollectionName().'</a> > ';
}
echo$c->getCollectionName();
}
?>
Step 2
Next, in the blocks/ folder in the root of your concrete5 installation, add a new folder named autonav. In that autonav folder create another folder named templates. Then, put your breadcrumb.php file in the templates folder. (so the directory structure should look like this: blocks/autonav/templates/breadcrumb.php).
Step 3
Now, to implement your breadcrumb navigation, simply create a new Auto-Nav block wherever you want your breadcrumb navigation to appear in your theme. Once you’ve created your Auto-Nav block, click on it and choose ‘Set Custom Template.’ Breadcrumb should now be a choice in the drop down box. Choose it and hit ‘Update’. You should now have a nice breadcrumb navigation trail for your concrete5 site.
Source:
http://www.concrete5.org/index.php?cID=537
More information on Breadcrumb Navigation:
http://www.useit.com/alertbox/breadcrumbs.html
Happy New Year!
Thx for this, great!
Cheers
Huge props for this.
I just used it on a site I’m building for a client.
Thanks !!
excuse me, but what does this mean? i did everything in the directions but i get this when i try to publish.
parse error: syntax error, unexpected T-string in /home/freestyle/www/www/blocks/autonav/templates/breadcrumb.php on line 9
i’ve gotten it with another function before, but can’t seem to find out how to fix it .. i’m really new at this and would greatly benefit from some pointers..
@freestylemovement
try this link: http://www.parse-error-unexpected-t-string.com/
Make sure you copied the code correctly and it didnt strip out any code when you created the file.
Thanks for this, I really needed it. It didn’t work for me as written, the links within the breadcrumb were missing the “/index.php”. So I edited line 14 to look like this…
echo’getCollectionPath().’/”>’.$bcpage->getCollectionName().’ > ‘;
And then it worked fine.
OK, posting code didn’t work, here’s the relevant bit…
BASE_URL.DIR_REL.”/index.php”.$bcpage->getColl
As a note on getting the crumbs to look good, a bit of CSS to add separators might include (where your block is inside a div with class ‘bread’:
.bread ul li {
display:inline;
background:transparent url(divider.jpg) no-repeat scroll left center;
padding-right:10px; /*width of img + a bit*/
}
.bread li:first-child {
background:none;
padding-right:none;
}
That should put separators between, but not before the first one, and display them in a horizontal line.
I chose the custom template and it makes the page go realy weird: the footer block moves to the top and I can’t see a horizontal breadcrumb anywhere.
Any idea what I may be doing wrong (as you can tell, I am a newbie at this.)
Thanks
Luke
LukeH,
Hmmm, not sure. Can you send me a link to your site so I can take a look? You actually shouldnt need to create this breadcrumb template anymore. The new version of concrete5 already comes with one.
Yeah, the new version comes with one, but it looks like hell. Any idea how to style it so it looks all nice like yours?
Home > next crumb > next crumb
etc.?
On one line. I’m getting a stupid-looking tree type configuration and looking at the breadcrumb.php template that comes with C5 is no help. It also looks very different from the code you posted above.
The breadcrumb.php template that comes with concrete5 should look just like you want (you can see it here on the OfficeSpace demo: http://c5.sineceramedia.com/about/). Did you actually apply the template by clicking on the block and choosing Custom Template and then picking Breadcrumb from the drop down?
well, I replaced it with yours and it looks the way I wanted, so thank you! (That’s how C5 should ship standard; who wants an ugly tree breadcrumb?)
However, since this is old, it may LOOK pretty, but it doesn’t support the new function ‘replace_link_with_first_in_nav’ which I need.
Yeah, it does look just like I want… HOWEVER, Andrew pointed out that the new default breadcrumb template does not include the ‘replace_link_with_first_in_nav’ function.
“An oversight,” he said, because the header_menu custom template does have it. The team just forgot to add it to the breadcrumb for some reason. I need this functionality and have no clue how to fix the code.
Here were Andrew’s instructions to me, which I tried 5 different ways and could not get to work:
The change was only ever made to the main autonav
template and the header menu template, which was an oversight. You’ll want
to add this code at the top
$nh = Loader::helper(‘navigation’);
then inside the loop add
$pageLink = false;
if ($_c->getCollectionAttributeValue(‘replace_link_with_first_in_nav’)) {
$subPage = $_c->getFirstChild();
if ($subPage instanceof Page) {
$pageLink = $nh->getLinkToCollection($subPage);
}
}
if (!$pageLink) {
$pageLink = $ni->getURL();
}
and finally change the link to print out
echo(‘‘ . $ni->getName() . ‘‘);
So,
Finally got all the code in the right place.
Here is the new updated breadcrumb with all the functionality it’s supposed to have.
(hope it shows up. seems like your guestbook script interfered with the coding last time, maybe)…
generateNav();
$nh = Loader::helper(‘navigation’);
$c = Page::getCurrentPage();
$i = 0;
foreach($aBlocks as $ni) {
$_c = $ni->getCollectionObject();
$pageLink = false;
if ($_c->getCollectionAttributeValue(‘replace_link_with_first_in_nav’)) {
$subPage = $_c->getFirstChild();
if ($subPage instanceof Page) {
$pageLink = $nh->getLinkToCollection($subPage);
}
}
if (!$pageLink) {
$pageLink = $ni->getURL();
}
if (!$_c->getCollectionAttributeValue(‘exclude_nav’)) {
if ($i > 0) {
print ‘ > ‘;
}
if ($c->getCollectionID() == $_c->getCollectionID()) {
echo($ni->getName());
} else {
echo(‘‘ . $ni->getName() . ‘‘);
}
$lastLevel = $thisLevel;
$i++;
}
}
$thisLevel = 0;
This code doesn’t work when you try to compare versions – I get an error about redeclaring show_breadcrumb().
Laurence,
This code is actually obsolete now. The latest version of concrete5 already comes with a breadcrumb template for the auto nav block.