Use an Icon/Image for the Home Breadcrumb

This is a really easy one. However, as I’ve been asked about it several times in the past few weeks, I’m going to post about it.

One way of using an image rather than just text for the home breadcrumb was covered in the Vista-Like Breadcrumbs for WordPress article back in 2009. However, that guide is more or less an advanced topic, and directly accesses the bcn_breadcrumb_trail class, something that is currently not recommended.

Since at least Breadcrumb NavXT 3.0, the settings page allows you to use valid HTML in some fields. In the future this will be more obvious due to settings page tweaks as it is not exactly obvious that this is possible. There are really only three steps to changing from text to an image for the home breadcrumb:

  1. Go to the Breadcrumb NavXT settings page (under Settings > Breadcrumb NavXT).
  2. On the “General” tab, look for the “Home Template” option.
  3. Replace the text value of the “Home Template” option with the valid HTML for your image. e.g.
    <img src="http://YOUR_URL/YOUR_HOME_IMAGE" alt="Home"/> where YOUR_URL is the URL for your website, and YOUR_HOME_IMAGE is the name of the image, including file extension.

That’s it, and it also works for the “Blog Breadcrumb” and “Mainsite Breadcrumb” in setups that have these breadcrumb types.

-John Havlik

[end of transmission, stay tuned]

3 thoughts on “Use an Icon/Image for the Home Breadcrumb

      • Yeah, this has changed for Breadcrumb NavXT 4.0+. Initially, I thought that it no longer made sense to allow HTML in the home title. However, now I think I’m going to go back on that for 4.1.

        -John Havlik

Comments are closed.