How To Add Breadcrumbs To Your WordPress Website Or Blog

Breadcrumbs make navigation easy for both visitors and search engines. Many WordPress themes don’t come with breadcrumbs automatically.  So In this post I will tell you why you should add breadcrumbs to your website and how to add breadcrumbs to your theme.

Benefits To Visitors

Breadcrumbs first of all tell your visitors where they are and where they have been. Some visitors use the breadcrumbs as additional navigation. By using the breadcrumbs users can easily view content in their current category.

SEO Benefits

Breadcrumbs also play a role in SEO. They help search engines crawl your site. Breadcrumbs that start from your home page and then category names that are based on your targeted keywords and then the posts helps search engines determine your site structure.

Plugin Free Breadcrumbs

You can add breadcrumbs to your WordPress Website or blog by inserting the following hook into your functions.php file.  This will add the breadcrumbs right before the post.

[php]
/* Add Breadcrumbs */
function mybreadcrumbs() {
if(!is_home()){
global $post;
?>
<div id=”breadcrumbs”>
You are here: <a href=”<?php%20bloginfo(‘home');%20?>”>Home</a> >
<?php $parent = $post->post_parent;
$parent_title = get_the_title($parent);
echo ‘<a href=”‘.get_permalink($parent)%20.'”>' . $parent_title .(”); ?> </a> >
<?php the_title(”); ?>
</div>
<?php
}}
/* Add above content */
add_action(‘loop_start', ‘mybreadcrumbs');

/* End Breadcrumbs*/
[/php]

Then add css to your style.css to give it the desired look.
[css]
#breadcrumbs {
background-color: #ADBDBC;
height: 20px;
width: 645px;
color: #000000;
text-align: left;
font-variant: small-caps;
}

#breadcrumbs a:link,
#breadcrumbs a:visited {
color: #000000;
font-size: 16px;
font-weight: bold;
text-decoration: none;

}

#breadcrumbs a:hover {
color: #ffffff;
font-weight: bold;
}

[/css]

Breadcrumbs With Plugins

If you don’t want to use code you could use a plugin, such as Yoast Breadcrumbs to add the breadcrumbs.  But…If you use the WordPress SEO by Yoast plugin it also has a breadcrumb feature. Under Internal Links enable Breadcrumbs and customize the verbiage to meet your needs.

Below is a list of five other breadcrumb plugins that can be found in the WordPress Plugin Directory.

1. Breadcrumb NavXT
2. Breadcrumb Trail
3. WordPress Breadcrumbs
4. BreadCrumb NavXT Widget
5. Breadcrumbs Plus  (No longer available in the WordPress.org plugin directory)

So you decide if you want to add breadcrumbs to your website or blog. You can add breadcrumbs manually using the a hook and css or you can use one of the many plugins available online.

Resources

• WordPress Codex
• ThesisthemeTools.com