Breadcrumbs for Drupal 6

When creating useful websites, it's important to get the big things right. But taking care of the small things often enhances design and usability. Breadcrumbs are such things. While not making up for bad design, they help making navigation easier by allowing a quick overview of where someone is at inside the website's hierarchy and quick access to higher site levels.

 

As Jakob Nielsen puts it:

  • Breadcrumbs show people their current location relative to higher-level concepts, helping them understand where they are in relation to the rest of the site.
  • Breadcrumbs afford one-click access to higher site levels and thus rescue users who parachute into very specific but inappropriate destinations through search or deep links.
  • Breadcrumbs take up very little space on the page.

 

So breadcrumbs are a navigational tool that...

starts with the homepage and ends with the current page

 

With Drupal 6 out in the wild for quite some time now, it's too bad the breadcrumbs feature lack the current location. In fact, as people override the default function, people consider the previous level as current.

 

Consistent breadcrumbs for Drupal 6

To allow for the default breadcrumbs to be themed, put this preprocess function in your template.php...

/**
* Allow themable breadcrumbs
*/
function mytheme_breadcrumb($breadcrumb) {
  if (!empty($breadcrumb)) {
    foreach($breadcrumb as $value) {
        $crumbs .= '<div class="breadcrumb">'.$value.'</div>&nbsp;::&nbsp;';
    }
  }
  return $crumbs;
}

 

To add the current location to them, add this preprocess function (or modify the already existing one)

function phptemplate_preprocess(&$variables, $hook) {
    /* Make active page title in breadcrumbs */
    if(!empty($variables['breadcrumb'])) $variables['breadcrumb'] = '<div class="breadcrumbs">'.$variables['breadcrumb'].'<div class="breadcrumb current">'.$variables['title'].'</div></div>';
}

 

Now that's something that will go into our theme framework.

 

1 reactie

  • 1. Door Anonymous (not verified) 26 Jun, 2009 | hiiiiiiiiiiiii
     

    it is drupal page

  • Post new comment

    The content of this field is kept private and will not be shown publicly.
    • Allowed HTML tags: <a> <em> <strong> <cite> <code> <ul> <ol> <li> <dl> <dt> <dd> <h1> <h2> <h3> <br> <br/> <p> <img>
    • Lines and paragraphs break automatically.
    • Web page addresses and e-mail addresses turn into links automatically.