A simple way to boost your SEO and lower your bounce rate at the same time

Breadcrumbs. You’ve probably heard your blog should have them. You might hate them. Many bloggers do…because they’re not always very pretty.

What you’ve heard is true: your blog should use breadcrumbs. Today we’ll go over what breadcrumbs are, how they will help your blog grow, and how to turn them on and how to make them look better.

What are breadcrumbs?

It’s the list of links that shows at the top of a blog post or category page that shows the path to where you are now. It usually starts with “Home” and then has a category name, and then the name of the post.

How do breadcrumbs help your blog?

Google loves breadcrumbs

You know how important it is to make Google happy. There are a bunch of things you should be doing with each blog post to make sure it’s optimized for SEO. BUT, the good news is that turning on breadcrumbs are a once-and-done SEO boost for your blog.

That’s the best kind of SEO work, right?!

There are a couple reasons search engines like breadcrumbs:

1. They help explain to search engines like Google how your blog is structured, and how posts on your site are related to each other.
   One way this helps you is that if Google sees that you have lots of posts that are related to each other, they are more inclined to send visitors to your blog post, because there is a better chance that person will find what they need.
2. They count as internal links
   For the same reason as above, search engines love internal links, and breadcrumbs count–without any manual linking from you!

How breadcrumbs lower your bounce rate

They tell your visitor right up front that you have more information on the subject.

I’ve used this example on my blog before, but there was a blog post I found via Pinterest once that answered a big struggle I had always had with my hair. I was so excited. I really wanted to see what else she had for me. But there were no internal links to other content that would be relevant for me, there were no breadcrumbs so I could go up one step and see all the posts she had in that category. I went to the homepage, and it just showed her latest posts, which didn’t have anything to do with my type of hair. So I naturally assumed that she didn’t have any other information for me.

That’s when we lose our visitors.

So having breadcrumbs is one more safeguard against your visitor getting lost and leaving.

When someone lands on your post from Google or Pinterest, they’ll see the breadcrumbs right away, with a link to the category, and they’ll know that once they’re done reading the post, they can scroll back up and find more…and they often do!

Again, breadcrumbs are a change you can make once and it will help you with every blog post.

How do you turn breadcrumbs on?

If you have a Genesis theme for your blog, it’s going to be SO easy for you.

If you don’t have a Genesis theme, I recommend using the Yoast plugin.

They are easy to set up and customize with Yoast, BUT your theme may or may not display them automatically. So I recommend turning them on and setting them up, and if they don’t show on your blog, reach out to the developer of your theme and ask for help. (Or of course, you can hire someone like me to add the code for you!)

To set them up with Yoast, in your dashboard, click on “SEO” then click “Search Appareance.” You’ll see the tab that says “Breadcrumbs” and you can go through all the options there!

Save your work, and then check out your blog to see if they’re showing.

But what if your breadcrumbs are ugly?

The look CAN definitely be changed if you’re willing to tweak a little CSS and/or PHP. If that’s not something you want to do, reach out to a developer who can fix them up for you quickly.

First, start with some inspiration. My favorite place to go to get ideas are retail sites.

Here is an example of CSS you can use to customize the look of the breadcrumbs. You can paste this code into the “Additional CSS” field in your WordPress Customizer screen:

If you use a Genesis theme, use this code:

 .breadcrumb {
    border: none;
    text-align: center;
    margin-bottom: 0;
    color: gray;
    font-size: 13px;
    text-transform: uppercase; 
}

 a.breadcrumb-link {
    color: gray; /*Changes color of links*/
    text-decoration: none; /*Removes underlines*/
} 

If you use Yoast for breadcrumbs:

 .breadcrumb {
    text-align: center;
    margin-bottom: 0;
    color: gray;
    font-size: 13px;
    text-transform: uppercase; 
}

 .breadcrumb a {
    text-decoration: none;  /*Removes underlines*/ 
    color: gray;  /*Changes color of links*/ 
} 

That code will change the color of the text from black to gray, the font size to 13 pixels, center it on the page, etc. Playing with the code will not break your blog.

Bonus tip for breadcrumbs on your blog:

If you’re using the Yoast SEO plugin (which is a good idea), then the category that shows in your breadcrumb will be whichever category you have set as the “Primary Category” inside your blog post.