How To Create a Breadcrumb Navigation with the Easy Breadcrumb module in Drupal 8

Mar 06, 2017
The Easy Breadcrumb module in Drupal 8: improve your navigation easily

Websites of the future should be both easy to use and easy to build.

We love to discuss how Drupal 8, the latest framework’s release, fits both criteria. Websites get more accessible and mobile-friendly, configuration is handier to manage, fast search is easier to implement — the list could go on. Improving your website’s navigation by adding breadcrumbs is also easy, thanks to a special Drupal module called Easy Breadcrumb already available for Drupal 8. Read on to find out more about what breadcrumbs are and how this module works.

Breadcrumbs: navigation elements… right from the fairy-tale!

The name of the module is inspired by the fairy-tale about Hansel and Gretel. These kids scatter breadcrumbs to help themselves find their way back home through the woods.

Modern websites are, thankfully, not like woods (well, most of them — at least the ones whose owners care about usability). Even kids can find their way through good sites thanks to such elements as navigation menus, search boxes and — as an additional convenience feature — breadcrumbs.

Breadcrumbs help users quickly jump to a higher-level page, as well as clearly see where they are within the site’s hierarchy. They reduce bounce rate by tempting the user to make a click to the main menu. Breadcrumbs are most helpful on multi-level sites where the content is grouped into categories.

They are actually text links separated by symbols like >, », / or other, and hierarchically arranged according to the following principle: Homepage > Category > Subcategory > Current page.

Building Breadcrumb Navigation

The Easy Breadcrumb Drupal module

When you see how it works, you will say “Easy!” This Drupal module offers you ready blocks to embed on your site’s pages, usually near the header. It automatically generates breadcrumbs using the current URLs, as well as the pages’ titles.

For example, let’s assume you have this URL: mens-clothing/mens-jackets/mens-spring-jackets. The module will generate a breadcrumb like this: Home > Men’s clothing > Men’s Jackets > Men’s spring jackets. The presentation may vary according to the module's settings.

To get the best from working with the module, you can configure a bunch of parameters in your admin screen here: Admin — Configuration — User Interface — Easy Breadcrumb. These options include using the page’s title instead of the URL, applying custom separators, ignoring uncapitalized words and many more.

To have the proper URLs automatically prepared before you proceed to breadcrumb creation, you could also use the Pathauto Drupal module.

The Easy Breadcrumb and Drupal 8

One of the module’s maintainers, Greg Boggs, says that Drupal 8 has refactored breadcrumbs and made them much easier to extend or replace.

Though this module’s general breadcrumb implementation is similar to that of Drupal 8 core, the Easy Breadcrumb adds some important features to provide better practices. They include the ability to have the current page as an unlinked crumb, to hide or change the homepage link, to display unlinked paths, to exclude certain pages, etc.

Greg Boggs also announced a nice improvement on his Twitter: the module now clears the breadcrumb cache when its configuration changes, so you no longer need to use Drush.

If you need any assistance in installing and configuring the Easy Breadcrumb module on your Drupal 8 or Drupal 7 website, or if you want custom functionality for any aspect of your site’s navigation,  contact Drupal online support. Your visitors will always quickly find their path to any place on your site, almost like in a fairy-tale!

 Get new blog posts by email