Subscribe to RSS Follow me on Twitter
Hi, I'm a web developer and blogger from Russia. My nickname is Dimox.
Sorry for my English, it's not my native. Read more about me and my blog.

Wordpress Breadcrumbs Without a Plugin

301109'
Wordpress Breadcrumbs Without a Plugin
Written by Dimox

Breadcrumbs is an important element of a web site navigation, which boosts his usability. Especially it concerns to a sites with a complex structure. Unfortunatelly, I don’t use breadcrumbs on my sites, may be because their structure is very simple or because I could not find a way of making breadcrumbs, suitable for me.

I have seen a different ways of a breadcrumbs implementation on WordPress sites, but not one of them I does not like, because all of them does not display a full chain of links. So I have created my version of WordPress breadcrumbs without a plugin.

Yes, there is a ready plugins for WordPress breadcrumbs, but I prefer to use a short code snippets, which doing the same.

Features of my version of WordPress breadcrumbs

  • Displays a full chain of links to the current page. For example, if the current post is in a second level category, so breadcrumbs will looks like this:

    Home » Category » Subcategory » Post Title

    But all, what I have seen, displays only such an option (excluding plugins):

    Home » Subcategory » Post Title

    The same applies to pages and subpages. For example, for a 3rd level page breadcrumbs will looks like this:

    Home » Page Level 1 » Page Level 2 » Page Level 3

  • Breadcrumbs is appearing on a following types of WordPress pages:

    • paged navigation (like sitename.com/page/2/);
    • category archive;
    • tag archive;
    • daily archive;
    • monthly archive;
    • yearly archive;
    • author archive;
    • single post page;
    • single page;
    • attachment page;
    • search results;
    • 404 error page.
  • adding a page number (if archive page is second or more);

  • custom symbol of delimiter;

  • custom text for a ‘Home’ link;

  • current crumb styling.

WordPress breadcrumbs function code

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
function dimox_breadcrumbs() {
 
  $delimiter = '»';
  $name = 'Home'; //text for the 'Home' link
  $currentBefore = '<span class="current">';
  $currentAfter = '</span>';
 
  if ( !is_home() && !is_front_page() || is_paged() ) {
 
    echo '<div id="crumbs">';
 
    global $post;
    $home = get_bloginfo('url');
    echo '<a href="' . $home . '">' . $name . '</a> ' . $delimiter . ' ';
 
    if ( is_category() ) {
      global $wp_query;
      $cat_obj = $wp_query->get_queried_object();
      $thisCat = $cat_obj->term_id;
      $thisCat = get_category($thisCat);
      $parentCat = get_category($thisCat->parent);
      if ($thisCat->parent != 0) echo(get_category_parents($parentCat, TRUE, ' ' . $delimiter . ' '));
      echo $currentBefore . 'Archive by category &#39;';
      single_cat_title();
      echo '&#39;' . $currentAfter;
 
    } elseif ( is_day() ) {
      echo '<a href="' . get_year_link(get_the_time('Y')) . '">' . get_the_time('Y') . '</a> ' . $delimiter . ' ';
      echo '<a href="' . get_month_link(get_the_time('Y'),get_the_time('m')) . '">' . get_the_time('F') . '</a> ' . $delimiter . ' ';
      echo $currentBefore . get_the_time('d') . $currentAfter;
 
    } elseif ( is_month() ) {
      echo '<a href="' . get_year_link(get_the_time('Y')) . '">' . get_the_time('Y') . '</a> ' . $delimiter . ' ';
      echo $currentBefore . get_the_time('F') . $currentAfter;
 
    } elseif ( is_year() ) {
      echo $currentBefore . get_the_time('Y') . $currentAfter;
 
    } elseif ( is_single() && !is_attachment() ) {
      $cat = get_the_category(); $cat = $cat[0];
      echo get_category_parents($cat, TRUE, ' ' . $delimiter . ' ');
      echo $currentBefore;
      the_title();
      echo $currentAfter;
 
    } elseif ( is_attachment() ) {
      $parent = get_post($post->post_parent);
      $cat = get_the_category($parent->ID); $cat = $cat[0];
      echo get_category_parents($cat, TRUE, ' ' . $delimiter . ' ');
      echo '<a href="' . get_permalink($parent) . '">' . $parent->post_title . '</a> ' . $delimiter . ' ';
      echo $currentBefore;
      the_title();
      echo $currentAfter;
 
    } elseif ( is_page() && !$post->post_parent ) {
      echo $currentBefore;
      the_title();
      echo $currentAfter;
 
    } elseif ( is_page() && $post->post_parent ) {
      $parent_id  = $post->post_parent;
      $breadcrumbs = array();
      while ($parent_id) {
        $page = get_page($parent_id);
        $breadcrumbs[] = '<a href="' . get_permalink($page->ID) . '">' . get_the_title($page->ID) . '</a>';
        $parent_id  = $page->post_parent;
      }
      $breadcrumbs = array_reverse($breadcrumbs);
      foreach ($breadcrumbs as $crumb) echo $crumb . ' ' . $delimiter . ' ';
      echo $currentBefore;
      the_title();
      echo $currentAfter;
 
    } elseif ( is_search() ) {
      echo $currentBefore . 'Search results for &#39;' . get_search_query() . '&#39;' . $currentAfter;
 
    } elseif ( is_tag() ) {
      echo $currentBefore . 'Posts tagged &#39;';
      single_tag_title();
      echo '&#39;' . $currentAfter;
 
    } elseif ( is_author() ) {
       global $author;
      $userdata = get_userdata($author);
      echo $currentBefore . 'Articles posted by ' . $userdata->display_name . $currentAfter;
 
    } elseif ( is_404() ) {
      echo $currentBefore . 'Error 404' . $currentAfter;
    }
 
    if ( get_query_var('paged') ) {
      if ( is_category() || is_day() || is_month() || is_year() || is_search() || is_tag() || is_author() ) echo ' (';
      echo __('Page') . ' ' . get_query_var('paged');
      if ( is_category() || is_day() || is_month() || is_year() || is_search() || is_tag() || is_author() ) echo ')';
    }
 
    echo '</div>';
 
  }
}

Simply paste this function into a functions.php file of your theme and then paste the following code in a place of your theme, where breadcrumbs must appearing:

<?php if (function_exists('dimox_breadcrumbs')) dimox_breadcrumbs(); ?>

All that remains to do for now, is to design your breadcrumbs with CSS. You can use #crumbs for styling breadcrumbs block and #crumbs .current for styling a current crumb.

Function works on WordPress 2.5 or higher.

Category: WordPress

Comments on: "Wordpress Breadcrumbs Without a Plugin" (134)

  1. 86

    Very Useful and thank you very much

  2. 87
    @
    linda said:

    Wow you just made my night and it works great! I’ve been looking for something straight forward like this. Thanks!

  3. 88

    Thanks for the code…exactly what I was looking for. Great work!

  4. 89

    Great article! Very helpful and already in at my site. Thanks for this posting. It works very well!

  5. 90

    Thanks for this code, it’s exactly what I needed.

  6. 91

    This is great, but for some reason I don’t get a breadcrumb that tells me I’m on the main page. So, for the about page I’ll get Home / About, but I need to have just Home on the home page. Is there any way to do that?

  7. 93

    Thank you, thank you, thank you!!!

  8. 94

    You Sir, are my hero. I’ve tried many breadcrumb plugins that came close to my needs but all the bloated code made my brain hurt when trying to edit. Your solution has a small footprint and is easy to implement my changes.
    Thanks so much :)

  9. 95

    Dear admin, I just want to add my blog description in HOME.. how is the way to do that.., here is for example :
    > If i am in Homepage then the code will shown :
    Home >> Description of my blog
    > If iam in page 2 of my blog then the code will shown :
    Home >> Description of my blog >> Page 2

    Thats all i wanna ask.. i hope you could provide me with the solution that you have.. thanks.

    Max

  10. 97

    Dimox,

    You have written a fantastic breadcrumb program! Thank you for sharing it with the WordPress community.

    One question for you… when ever I try to display the breadcrumb on a custom post type page I get this error: “Catchable fatal error: Object of class WP_Error could not be converted to string in /xx/public_html/wp-content/themes/xx/functions.php on line 379″

    Any thoughts on how I could correct this?

    Thanks again!

  11. 98

    Thank You very much!!! It’s work!! It’s work!!!

  12. 100

    Hi, thanks for the nice function.

    I am trying to adapt it to my needs but I guess my PHP knowledge is not strong enough .

    On the single page I would like the last breadcrumb to be a link back and not the post name.

    something like

    home > category > return (has to be active, i.e. a link back to previous crumb, in my case the category)

    thanks
    Massimo

    • 101

      I not see a sense in such a link. You can just click on category link and this will be the same.

      • 103

        LOL! you are right … the fact is that I use it on a classified ads web site and the ad title is the post title but i prefer something standard there rather than the post title (some can be weird too!).

        I guess I could also simply avoid that crumb on the single page. How would I do that then?

        • 105

          In this code:


          } elseif ( is_single() ) {
          $cat = get_the_category(); $cat = $cat[0];
          echo get_category_parents($cat, TRUE, ' ' . $delimiter . ' ');
          echo $currentBefore;
          the_title();
          echo $currentAfter;

          remove the following:


          echo $currentBefore;
          the_title();
          echo $currentAfter;

  13. 102

    Hi Dimox!

    I have one question:

    For a link like this one: site.com/cars/?author_name=george (where ‘cars’ is a category) is it possible to have the author name in the breadcrumb?
    eg. Archive by category ‘Cars’ & author ‘George’

    Thank you for this neat function,
    Victor

    • 104

      Paste this code:


      if(isset($_GET['author_name'])) {
      global $author;
      $userdata = get_userdata($author);
      echo '& author ' . $userdata->display_name;
      }

      after these rows:


      single_cat_title();
      echo '&amp#39;' . $currentAfter;

      • 106

        Thanks Dimox, that works like a charm.

      • 107

        I’m back :)

        On single post pages that reside in certain categories instead of
        “Home » Category » Subcategory » Post Name”
        it only shows
        “Home » Subcategory » Post Name”

        Maybe the problem is in the code below?

        elseif ( is_single() ) {
        $cat = get_the_category(); $cat = $cat[0];
        echo get_category_parents($cat, TRUE, ‘ ‘ . $delimiter . ‘ ‘);
        echo $currentBefore;
        the_title();
        echo $currentAfter;
        }

        I guess that it grabs the first category (alphabetically – empiric observation) a post is found in and not the child category.

        Is there a workaround?

        Or maybe the problem is somewhere else.

  14. 108

    Hi dimox., im back.., last time i post this question

    I just want to add my blog description in HOME..

    . Right now i just wondering how to add image attachment page description in your breadcrumb, what i mean is like this :

    If in single post :
    home >> category >> single post title ( just like it was )

    how to do in image attachment :
    home >> title of single post >> title of image attachment

    here where i found these kind of breadcrumb :
    http://www.lincah.com/2010-kicherer-mercedes-benz-sls-supersport-edition-black/2010-kicherer-mercedes-benz-sls-supersport-edition-black-front-angle-view

    can you help me adding this to your breadcrumb so i can have similar breadcrumb result.

    Thanks

  15. 111

    Great stuff! Thanks for the code ;)

  16. 112
    Antonio Prohias said:

    Hi,

    How would I replace » with an image?

    Thank you

  17. 113
    Antonio Prohias said:

    nevermind:

    $delimiter = ‘

    Cheers

  18. 114

    Hi very neat code :) will this work with wp 3.0.1 ?
    Thank you

  19. 116

    Thank you Dimox.

    You said that some functionality in the code will not work in wordpress 3.0,
    Can you please post the code for wordpress 3.0 or tell us what to delete in the function?

    Great work!
    Thank you.

  20. 117

    One more question please:

    How can I limit the number of child crumbs?
    I.E, if I have: home > category > subCategory > subSub category
    I want just: home > category > subcategory

  21. 121

    Hi Dimox, thank you for the great code, it works fine. One last thing: In the “single page mode” I would like the last breadcrumb not to be shown.

    Home » Category » Subcategory
    instead of your
    Home » Category » Subcategory » Post Title

    How and where can I modify the code?
    When deleting the code like in your comment/answer 105 there still the delimter “»” remains at the end.

  22. 122
    @
    Quang Huy said:

    Hello,

    Can you help me rewrite this code for displays a full chain of links to the current page?

    http://pastie.org/1124683

    Thanks you very much !

  23. 128

    thx. easy come. easy go.

  24. 129
    Old Castle said:

    Hi,

    Any idea when your breadcrumb will works with custom post types?

Leave a comment





Tag Cloud