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

WordPress Breadcrumbs Without a Plugin

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;
    • custom post type;
    • 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;
  • integrated microdata from Schema.org.

WordPress breadcrumbs function (last updated: 2019.03.03)

Simply paste this function into the functions.php file of your theme (excluding <?php) 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 .breadcrumbs for styling breadcrumbs block and .breadcrumbs__current for styling a current crumb.

You can also look at breadcrumbs video tutorial, which show you how to install this function on TwentyTen WordPress theme.

Cоmmеnts (661):
  1. 1

    Hi, we translate the Breadcrumb with a javascript. but now i have a problem with the language additional code.

    German is ok:
    http://gasserceramic.ch/ziegelei/rapperswiler-rot/
    i can go back to “Ziegelei”: http://gasserceramic.ch/ziegelei

    but in other language we have this mistake:
    if you go back to Ziegelei you see this… http://gasserceramic.ch/?lang=frziegelei%2F
    (http://gasserceramic.ch/ziegelei/rapperswiler-rouge/?lang=fr)

    is there a possibility to set a fix URL or to define that the language-additional is at the end of a string? / URL?

  2. 3

    Thanks you sir!

  3. 4

    I have multiple categories for my post and I have marked one category as PRIMARY. But in breadcrumb it shows category by alphabetically order. Is there any way by which I can show the Primary category in breadcrumb?

  4. 6

    Hello, your code displays awesome breadcrumbs, the only problem is that Google’s rich snippet testing tools reports errors.

    It says it’s missing “item” and “position”

    Try for yourself

  5. 7

    I have updated the function. Added the “meta position” tag. Now there is no errors in Google’s rich snippet testing tools.

  6. 8

    Nice work, thanks!

    Btw, is possible add support to custom taxonomy?

  7. 10

    Hi,
    I am using LearnPress plugin and used your code in my theme, everywhere its working fine but at LearnPress course page and single course page not working. Can you please help?

    Thanks

  8. 11
    @
    Mike said:

    Great code! Thank you
    I have a static page and while displaying anything “below” the post page I would like to always display the “blog post” page title (as this is used to be a news section).
    Like “home > single_post_title() > category > post”

    Example: Home > News > Uncategorized › Taco
    Example2: Home > News > Archive by Category “x”

    I’ve only messed up the code/function so far by trying my self.
    Please advice

  9. 12
    @
    Amanda said:

    Is it possible to remove the hyperlink off the parent (Home / Parent / Child)?

    Thanks!

Соmmеnt раgеs: « 1 11 12 13
Lеаvе а Соmmеnt

© 2009–2019 Dimox.net  •  Privacy Policy