Drupal breadcrumb categories

There are two hierarchies in Drupal that you can bind your breadcrumbs to . You can bind your breadcrumbs to either the sites menu, or the sites taxonomy but you can't do either right out of the box. Unfortunately when you create a page you aren't given the option of using a custom breadcrumb trail. You can't just type it in a field and hit "go".

There are modules that take advantage of both the menu and taxonomy structures. Here is a breadcrumb module comparison that shows some of the features of the main players.

As a last resort, you can always create a series of templates based on the particular node (by creating node-x.tpl.php files) or create a custom block just for that page that you can position using CSS but why not let a module do the work for you?

Theming breadcrumbs

Most of the themes out there for Drupal run on PHPTemplate these days and PHPTemplate uses template.php in order to store it's theme functions.

This is where you will find (or place) the base function for the output for the breadcrumb.

In this example I'm looking at the Marinelli theme. Inside the template.php file the code that returns the themed breadcrumb trail follows:
/**
* Return a themed breadcrumb trail.
*
* @param $breadcrumb
* An array containing the breadcrumb links.
* @return a string containing the breadcrumb output.
*/
function phptemplate_breadcrumb($breadcrumb) {
if (!empty($breadcrumb)) {
$breadcrumb[] = drupal_get_title();
array_shift($breadcrumb);
return '<div class="path"><p><span>'.t('You are here').'</span>'. implode(' / ', $breadcrumb) .'</p></div>';
}
}
What this function does is to insert some HTML around the existing breadcrumb while spreading the stored variable array out into text, fresh and ready to display in the page.tpl.php or other theme template file.

This is an example of an already over-ridden (themed) breadcrumb. You could use your own implementation if nothing exists by placing a similar function into your own template.php file (when using the PHPTemplate system -- which you likely are by default).

The finalized $breadcrumb output is going to look something like this:
<div class="path"><p><span>You are here</span>Autos </p></div>

You can style it using CSS how you see fit.

What this doesn't address however is how to get more than one category listed in the breadcrumb. For that you're going to need some help addressed in the next post, Drupal breadcrumb categories.

Drupal breadcrumb html over-ride.

If you are trying to do something freaky with your breadcrumbs (that you can't find a way to implement programatically using the administrative interface or a custom module) you can make use the Drupal templating system in order to place a custom breadcrumb on any single node, formatted however you like in HTML.

To do this, the first thing you will need to get is the node id of the page you are trying to modify. To find the node id, navigate to the Content/List section. If you have trouble navigating to that section of the site, simply put this path at the end of your domain name: /admin/content/node/overview

You will see your particular node in the list of content displayed. To the right of your page/node, hover your mouse over the "edit" link. The link will display the node id in the form of /node/18/edit?destination=admin/content/node/overview (where the node id in this case is 18).

Now to create a custom node template to display your html breadcrumb.

With a local copy of your drupal theme, find the current template that is used for your node. Look for files with the .tpl extension. If your node is a page, open the page.tpl file for editing. Don't save over it. You'll be saving it to a different filename after you edit it.

Inside the .tpl file, locate the string to text that reads:

Delete it and replace it with your HTML.

To use this template file only for the node that you wish it displayed on, simply save as so the filename reads (in this case) "page-node-18.tpl". Upload it to your current theme's directory.

Your theme might put these files in a templates subfolder so take a look around and test to be sure.

What are Drupal breadcrumbs?

Breadcrumbs are used to tell the user of a web site both where they are on the site and the hierarchy above the current location. It is a web page navigational element.

Hansel and Gretel used breadcrumbs to mark their path in the woods in order to the find their way back home in case they got lost. Much like this, breadcrumbs are used to "step you back" in the direction of the home page, up the directory or category structure to the main page of the site.

It wasn't until I started using Drupal as a CMS that I became familiar with the breadcrumb terminology and the Drupal books I read didn't provide a definition.

Breadcrumbs typically look like this (with the current location of the user displayed farthest to the left):

Home -> Category Name -> Article Name

Each one of the entries in the breadcrumb trail are usually hot-linked to the corresponding page.

The current wikipedia article on breadcrumbs describes them in different types. I believe their current description of "Attribute Breadcrumbs" is probably more indicative of the introduction of a tag-breadcrumb hybrid than it does a "type" of breadcrumb, but luckily with the use of Drupal's powerful taxonomy and templating features, you can set up your breadcrumb structure in pretty much any way you can imagine.

There are modules that can help you customize the breadcrumbs if the more advanced features of Drupal aren't at your command yet.