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: 2018.10.05)

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 (656):
  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.

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

© 2009–2018 Dimox.net  •  Privacy Policy