I recently stumbled across The Cats Who Code, because I had to come up with a breadcrumb for a client that needed this in his web design and didn’t want to use a plug in as I felt it was unnecessary so much stuff for a simple breadcrumb.

I found their solution to work except for the fact that I was working with pages instead of posts and I needed some sub navigation on a third level hierarchally as the client I was working with wasn’t going to deeper than this and if he did, I could revise the code (suggestions welcome of course).

The credit for making this code initially is for The Cats Who Code, which is a great site I use for tutorials on coding mostly.

The Fix

You have to basically copy this code instead of his, within your functions.php file in your WordPress theme; then, you need to call the PHP function from wherever you are going to use this breadcrumb (hope it’s at the top eh). You call this by calling it as follows:<? php the_breadcrumb(); ?>

The code

function the_breadcrumb() {
		global $post;
		if (!is_home()) {
			echo '';
			echo Home;

			echo " - ";
			
			 if ($post->post_parent) {
			echo '';
			echo get_the_title($post->post_parent);
			echo " - ";
		
			}
			
			if ( is_page() ) {
			echo the_title();
			}
		}
	}

Some notes

1. Take a good look at the double and single quotation marks; most people say “it doesn’t work” but they fail to look at this small (yet very important detail).
2. If you need this as unordered lists, make the necessary replacements within the echo statements of the function.
3. To style it, I used the <section> property of HTML 5 and styled the section on a block level basis and the paragraph and anchor links of it as well. I think this approach works t works best; I mean a breadcrumb really is just a paragraph of links. The section I then float it to the left (or right) depending on the design.

Any questions shoot them below; you know how busy Web design can get and sometimes I have a lot of work, but I will do my best.