RSS

Improving Breadcrumb Trails in Drupal 6

Improving Breadcrumb Trails in Drupal 6

D6 Breadcrumbs

While working on our last project I realized that we haven't used breadcrumbs in a theme for a while (well that is not entirely really true, we use them a lot for the admin section). We came across of what we first thought was a bug; the breadcrumbs weren't following the primary links herarchy and were only displaying the "Home" link.

Google here we go, search... search... read... read... read more... and after a lot of trial and error I found the the solution: Custom Breadcrumbs and Menu Breadcrumb.

Now that you have these modules installed and enabled... sorry, what? Not ready yet? Ok, let me know when you're ready... (Meanwhile, Alberto is doing important research) ........................... Huh, what was that? Installation completed? Great, then let's continue.

To let the breadcrumb know about your menu hierarchies, basically all you have to do is enable Menu Breadcrumb module. However, if you want to add some configuration you need to go to Site configuration > Menu breadcrumb (URL: /admin/settings/menu_breadcrumb); here is a screenshot of our configuration:

In the following screenshot you can see a demostration of the module in action. In the primary links, when going to About > Why Sustainable Seafood, the breadcrumb result is Home » About » Our Team.

You maybe are wondering how the "Our Team" is showing up in the breadcrumb? well, in this case it was just a matter of zen's configuration. If you want the page title displayed in your breadcrumb go to Site building > Themes > Configure > "Your theme" and click the "Append the content title to the end of the breadcrumb" box under "Breadcrumb settings".

This is great, but what about content of specific content types that is not attached to any menu?

Here is where Custom Breadcrumbs comes into action. You basically need to create a breadcrumb style for each of your content types.

For this project, we have a content type named News, and we wanted to display all News under the URL path "/news" and then display every News node as "/news/here-goes-the-news-title". (I'm going to assume you know about Views and CCK, because the explanation of these modules goes out of the scope of this blog post.)

So for your custom breadcrumbs for News you need to go to Site building > Custom breadcrumbs (URL: /admin/build/custom_breadcrumbs) and click the "Add a new custom breadcrumb" link, as you can see in the screenshot I alredy have created it:

All you have to do to create a new custom breadcrumb is choose your node type, add a title (the text to display in your breadcrumbs), and then add the path (eg. /news) where the users will be redirected when they click on the title. Take a look to our configuration for News:

Once you submit the form, you just need to create some News content and see how it works. Here is a screenshot of a News node type (URL: /news/lorem-ipsum-dolor-sit-amet).

That's it, I hope this blog post has been of some help for you but if you have any questions feel free to fire me some comments here.

Now, I must go back to work!