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
php the_breadcrumb(); ?>
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
- 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).
- If you need this as unordered lists, make the necessary replacements within the echo statements of the function.
- 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.