Community Documentation

Customizing the breadcrumbs

Last updated August 10, 2011. Created by rkerr on May 17, 2006.
Edited by Arshad Chummun, bekasu, bryan kennedy, Dublin Drupaller. Log in to edit this page.

description

Perhaps your theme requires the breadcrumb div to always exist, even if it is empty. This snippet allows you to include the title in the breadcrumb.

<?php if ($breadcrumb && $breadcrumb != '<div class="breadcrumb"></div>'): ?>
  <?php print $breadcrumb; ?>
<?php else: ?>
  <div class="breadcrumb">&nbsp;</div>
<?php endif; ?>

Or, you may want to print the current title of the page after the breadcrumb links.

In template.php:

function mytheme_breadcrumb($breadcrumb) {
  $sep = ' &gt; ';
  if (count($breadcrumb) > 0) {
    return implode($sep, $breadcrumb) . $sep;
  }
  else {
    return t("Home");
  }
}

In Drupal 7:

In template.php:

function mytheme_breadcrumb($variables) {
  $sep = ' &gt; ';
  if (count($variables['breadcrumb']) > 0) {
    return implode($sep, $variables['breadcrumb']) . $sep;
  }
  else {
    return t("Home");
  }
}

In page.tpl.php:

<div class="breadcrumb"><?php print $breadcrumb . $title; ?></div>

Comments

My solution

To avoid some problems with order you need to use this code:

template.tpl.php

function phptemplate_breadcrumb($breadcrumb) {
   $home = variable_get('site_name', 'drupal');
   $sep = ' &raquo; ';
   if (count($breadcrumb) > 0) {
     $breadcrumb[0] = l(t($home), '');
     return implode($sep, $breadcrumb) . $sep;
   } elseif (drupal_get_title() !== '') {
     return l(t($home), '') . $sep;
   } else {
     return t($home);
   }
}

page.tpl.php

<div class="breadcrumb"><?php print $breadcrumb . $title; ?></div>

How do I get it styled the same way?

Hi,

I tested the code above and the styling failed. I'm not refering to CSS styling, but to characters and breaks.

In my theme (a modded version of Friends Electric) the default breadcrumb is: Home » Administer

I would like it to be Home » Administer » Menu

Instead, with the code above, it's

Home » Administer
Menu

So, there is no second » and the line breaks after Administer. I can probably fix the line break with CSS, but I don't know how to get the the separator into the statement.

I tried

<div class="breadcrumb"><?php print $breadcrumb &raquo; $title; ?></div>

(i.e. exchanging the . for ») and that turned out weird. The breadcrumb disappeared and was substituted with some garbage characters.

So, how do I do it?

/ Ayza

isn't it like this?

how about this?

<div class="breadcrumb"><?php print $breadcrumb ?> » <?php print $title; ?></div>

or

<div class="breadcrumb"><?php print $breadcrumb ?> &raquo; <?php print $title; ?></div>

this does not solve the line break though.

getting it to format right

the 'linebreak' happens because the $breadcrumb variable outputs not only the breadcrumb itself, but wraps it in a pair of <div class="breadcrumb"> tags. so when you tack $title on the end, it falls outside the <div> and gets put on a new line.

you can fix this by altering the CSS for the breadcrumb class. [found in themes > [yourthemename] > style.css] and adding a display: inline directive to it.

here's my breadcrumb class...

.breadcrumb
{
display: inline;
  margin-bottom: .5em;
font-size:80%;
font-weight:normal;
color:#aaaaaa;
}

then, just tack $title onto the end of $breadcrumb in your code [not forgetting to wrap it in the "breadcrumb" class as well, so it styles the same!] and robert is your uncle!

<?php
print $breadcrumb."<span class=\"breadcrumb\"> &raquo; ".$title."</span>";
?>

didn't know that!

i didn't know that $breadcrumb outputs the links in a div wrap. thanks for that info!

little off topic:
hmmm....most themes i've downloaded wrap the print $breadcrumb code in divs...so is it redundant then?.... checked the generated source code of my site and its:

<div class="breadcrumb"><div class="breadcrumb"><a href="/forside">Forside</a> » <a href="/admin" title="">administrasjon</a></div></div>

because the code in my page-admin.tpl.php is:
<?php if ($breadcrumb): ?><div class="breadcrumb"><?php print $breadcrumb; ?></div><?php endif; ?>

i can just use.... <?php if ($breadcrumb): ?><?php print $breadcrumb; ?><?php endif; ?> instead, right?

but going back to the topic... well i am very confused.
if $breadcrumb wraps/outputs the links in divs already, then basing from your code above:

<?php
print $breadcrumb."<span class=\"breadcrumb\"> &raquo; ".$title."</span>";
?>

won't the generated html output be

<div class="breadcrumb">
     <a href="/home">Home</a> » <a href="/level1" title="">Level One</a></div>
<span> » Level Two Title</span>
  ?

pardon my ignorance but won't the <span> » Level Two Title</span> fall outside the div as well? the css stylings will be the same as the breadcrumbs but wont it still be placed in a new line? so....maybe wrap the title in div as well? then have the breadcrumb div and title div have a float:left in css (an attribute that confuses me more) and then ends with a clear:both in an element?

well.. i better try your suggestion first then or probably it's about time for me to learn css! :-)

"...pardon my ignorance but

"...pardon my ignorance but won't the » Level Two Title fall outside the div as well? the css stylings will be the same as the breadcrumbs but wont it still be placed in a new line?..."

yes. the span does fall outside the div. but you need to put your 'level two title' into a span [styled the same as the preceding div] in order to style it the same as the rest of the breadcrumb trail

the new span won't be on a new line, because you've changed the CSS for the 'breadcrumb' class to give it a 'display' property of 'inline'. this stops the content following it from being put on a new line. [by default 'div' tags have a display property of 'block' which renders them with a newline immediately before and after]

Modules conflicting with page title

Considering that many of the modules do not conform to the same rules with breadcrumbs and page titles, it is likely some modules may lead you to an:

Event » Event

<?php
/*
    phptemplate_breadcrumb($breadcrumb) modification
    File: template.php
    Use: Hide breadcrumb trails with only 1 crumb, regardless of crumb name ("home" is)
        a popular single-crumb that people like to have removed in some templates.
    Through: PHPTemplate function override
    Benefits: Does not involve extra code in separate view.
*/
function phptemplate_breadcrumb($breadcrumb) {
   
$home = variable_get('site_name', 'drupal');
   
$sep = ' &raquo; ';
   
// Check if breadcrumb has more than 1 element.
    // Options: Change to the number of elements/crumbs a breadcrumb needs to be visible.
   
if (count($breadcrumb) > 1) {
       
$breadcrumb[0] = l(t($home), '');
       
/*
            Optional: Include page title in breadcrumb.
       
            drupal_get_title() !== ''
                Check if title blank, if that is the case, we cannot include trailing page name.
            strstr(end($breadcrumb),drupal_get_title()) == FALSE
                Some modules will make it so path or breadcrumb will involve duplication of
                title and node name (such as in the Events module) to remove this, simply
                take out  && strstr(end($breadcrumb),drupal_get_title()) == FALSE
           
            Use: Simply uncomment the if structure below (3 lines).
            Special Use: If you wish to use this regardless of elements/crumbs in a breadcrumb
                simply cut/paste the statements inside the "if (count($breadcrumb) > 1)" outside
                of the structure, and delete the extranneous structure.
        */       
           
if ( (drupal_get_title() !== '') && (strstr(end($breadcrumb),drupal_get_title()) ) == FALSE) {
               
$breadcrumb[] = t(drupal_get_title(), '');
            }
       
        return
implode($sep, $breadcrumb);
    } else {
       
// Would only show a single element/crumb (or none), so return nothing.
        // You can remove this statement.
   
}
}
?>

This seems to give a clean

This seems to give a clean path. thanks for the post. Here's my spin.
For home I used the site acronym HTFL then Home OR 'HTFL Home'

function phptemplate_breadcrumb($breadcrumb) {
//$home = variable_get('site_name', 'drupal');
$home = 'shorter name - like a site acronym then home';
// $sep = ' » ';
$sep = ' » '; // i used == & # 1 8 7 ;
if (count($breadcrumb) > 0) {
$breadcrumb[0] = l(t($home), '');
// return implode($sep, $breadcrumb) . $sep;
return implode($sep, $breadcrumb);
} elseif (drupal_get_title() !== '') {
return l(t($home), '') . $sep;
} else {
return t($home);
}
}

Preview of my path:
HTFL Home » Resources » Recommended Web Sites

Custom Breadcrumbs for language prefix and domain

Find the i18n fr and change the home link for one domain in a multisite install:

function phptemplate_breadcrumb($breadcrumb) {
$site = $_SERVER["HTTP_HOST"];
$language = explode(’/',$_REQUEST['q']);
if (($site == ‘myswissdomain.ch’ && $language[0] == ‘fr’) || ($site == ‘www.myswissdomain.ch’ && $language[0] == ‘fr’)){ $home = ‘d’accueil’; }
else {$home = ‘Home’;}
$sep = ‘ » ‘;
$breadcrumb[0] = l(t($home), ”);
return ”.implode($sep, $breadcrumb).”;
}

More breadcrumb customization

Some people like to use the menu_breadcrumb module to create breadcrumbs. One issue with this is "duplicate" looking breadcrumbs showing up when editing nodes. If you consider these extra crumbs superfluous but still want to append page title to the breadcrumb you might be stuck with breadcrumbs that looks like: Home >> About Us >> About Us...

Here is some code that will get rid of the "duplicate" breadcrumbs. Note: this is removing any breadcrumbs that have duplicate names, keeping the lowest level breadcrumb with that name in tact.

<?php
function phptemplate_breadcrumb($breadcrumb) {  
  
//prevent duplicate titles in breadcrumb trail (ie: Home >> My account >> My account)
  
foreach($breadcrumb as $value):
      
//find all link text
      
preg_match_all('/>(.*)</', $value, $matches);
      
//compile text into array
      
$text[] = $matches[1][0];
   endforeach;
  
//start counting breadcrumbs
  
$i = 0;
  
//compare current string to prior text
  
foreach($text as $value):
      
//if there is a match, add to duplicates array
      
if($recent == $value){ $duplicates[$i] = $i; }
      
$recent = $value;
      
$i++;
   endforeach;
  
//check if there are any duplicates
  
if($duplicates):
      
//remove duplicate titled links from breadcrumb trail
      
foreach($duplicates as $value){ unset($breadcrumb[$value]); }
   endif;
}
?>

Here is modified code from above to use DIV elements to replace your 'Home' link and separators. Note that you can change the location.href to a different page. I have it linked here to the root or '/' but you could change that to '/home' or '/node/1' or whatever else you need it to be.

<?php
function phptemplate_breadcrumb($breadcrumb) {  
  
//hard rewrite for home button
  
$home = '<div class="home-button" onClick="location.href=\'/\'"></div>';
  
//create a separator to replace the default '>>'
  
$sep = '<div class="separator"></div>';
  
  
//create breadcrumb string
  
if (count($breadcrumb) > 1):
          
//remove the 'home' breadcrumb
          
unset($breadcrumb[0]);
        
/*this string will be used mostly - it
         replaces missing 'home' breadcrumb
         and separates each breadcrumb with $sep  */
        
$string = $home.$sep.implode($sep, $breadcrumb);
  
//only 1 breadcrumb used on home
  
elseif(count($breadcrumb) == 1):
       
//use the hard rewrite
    
$string = $home;
   endif;
  
  
//return new breadcrumb string inside div
  
return '<div class="breadcrumb">'.$string.'</div>';
}
?>

And of course, you can combine both of these into a nice new breadcrumb template like so:

<?php
function phptemplate_breadcrumb($breadcrumb) { 

   foreach(
$breadcrumb as $value):
      
preg_match_all('/>(.*)</', $value, $matches);
      
$text[] = $matches[1][0];
   endforeach;

  
$i = 0;
   foreach(
$text as $value):
       if(
$recent == $value){ $duplicates[$i] = $i; }
      
$recent = $value;
      
$i++;
   endforeach;

   if(
$duplicates):
       foreach(
$duplicates as $value){ unset($breadcrumb[$value]); }
   endif;
  
  
$home = '<div class="home-button" onClick="location.href=\'/\'"></div>';
  
$sep = '<div class="separator"></div>';
  
   if (
count($breadcrumb) > 1):
           unset(
$breadcrumb[0]);
        
$string = $home.$sep.implode($sep, $breadcrumb);
   elseif(
count($breadcrumb) == 1):
    
$string = $home;
   endif;

   return
'<div class="breadcrumb">'.$string.'</div>';
}
?>

no home button

I follow the code and have replace the location.href=\'/node/333\'

But I can't see the home button. And just in case someone asks I have replaced the name with the my theme name_breadcrumb.

any ideas?

thanks for this. How can I

thanks for this.

How can I add a first and last breadcrumb class?

About this page

Drupal version
Drupal 4.6.x, Drupal 4.7.x, Drupal 7.x
Audience
Themers

Theming Guide

Drupal’s online documentation is © 2000-2012 by the individual contributors and can be used in accordance with the Creative Commons License, Attribution-ShareAlike 2.0. PHP code is distributed under the GNU General Public License.