What are breadcrumbs in a WordPress theme? It’s the extra navigation hierarchy or page trail shown at the top of many WordPress themes just under the header as indicated by the red arrow in the image below. It shows you the way back from where you came. For example, it might look something like:

Home > Bike Products > Wheels

Many people like this because it can be functional but because of the space it takes up on every page, many people want to remove it.

So the important question is…

 

How do I remove the breadcrumbs from my WordPress theme?

Elegant Themes - Remove Breadcrumbs

This fix uses the WordPress Editor and making changes here without knowing what you’re doing can cause major problems on your site. I recommend backing up your site and using child themes before making changes in the WordPress Editor.

themeforest1

I use Elegant Themes for most of the sites I build.  This description explains how to remove breadcrumbs in Elegant Themes but it works very similar in most WordPress themes and it’s actually pretty easy. Just go into the Editor under the Appearance menu in WordPress. In the page templates that you are using, you’ll need to remove the lines that look something like this:

<?php get_template_part('includes/breadcrumbs'); ?>

You’ll need to remove that line from every page template you use on your site to get rid of the breadcrumbs on the pages. Make sure to click SAVE in the editor after you delete the line of code. Simple as that!

If  this post helped you out, please stay connected or click a share button below. You can also subscribe to my YouTube channel below where I share more tips like this one.

 

Find Ryan Bowman On Google+
  • Deeptoad

    Disco!

    I thank you for this post. Worked like a charm. I found that line of code in the header file for my Elegant Theme install. Gone and so are the crumbs and white space. Thanks again!

    • http://WebEminence.com/ Ryan Bowman

      Glad this helped you out. Breadcrumbs serve their purpose but I find myself removing them on most of my sites. I think it’s a common fix that many people are looking for.

  • Michal

    Thank You for this post. It was wery useful.

  • Benny Vasquez

    Your post was spot on, and accomplished exactly what I wanted. I’ve hit a snag, though, and am wondering if you’ve seen it before.

    When using a custom template for the full-width page (starting with ET’s full-width template) where ALL I did was remove the line of php that you referenced, the pricing table (part of ET’s shortcodes) no longer displays correctly (specifially: it’s wrapping anything after the second [ pricing ] ). I feel like there’s got to be something super simple that I’m missing, but it’s completely eluding me.

    Have you ever seen that before?

    • http://WebEminence.com/ Ryan Bowman

      Hey Benny, Removing the breadcrumbs code shouldn’t affect the pricing table shortcode in any way. I’m not sure what you mean by “it’s wrapping anything” but it sounds like you may have deleted a closing tag of some sort on accident. You can post the problem in the ET support forum or email me if you need more help and I’ll see if there’s something I can do.

      • Benny Vasquez

        Thanks for offering to take a look. I sent details through your contact form. If you don’t have any quick/easy ideas, the ET forums were my next stop, for sure.

  • ikyo

    Sorry…but WHAT A BAD idea !
    1/ Using the WordPress editor is lethal because, if you make a mistake, you’ll ruin the whole site
    1/ Removing a code line in the parent theme will prevent the next update

    It’s not the best solution, but it’s the easiest one…you may just add
    #breadcrumbs {display: none;}
    in the style sheet to remove all the breadcrumbs

    • http://WebEminence.com/ Ryan Bowman

      Hey Ikyo, I understand what you’re saying.

      1. The WordPress editor is there for a reason and some people have to use it. People do need to be careful and have a backup as I warn in the video. I did make a note in the video that using Child themes is the safest option. I don’t use Child themes for this fix because it’s so simple and I’d rather not duplicate all my page templates in a child theme for this easy fix. I’ll just redo it if I ever update the theme. It takes 5 seconds.

      2. Not sure what you’re saying in your 2nd point about preventing an update. Maybe you’re saying that you’ll lose the updates to the theme when you update it. Another good reason to use child themes.

      3. The reason I don’t use #breadcrumbs {display: none;} is on some themes it leaves the space for the breadcrumbs but deletes the text. So I prefer to remove the code for it to collapse the space. What you say will work for some people. They will still want to be using a child theme though or they’ll lose the change with an update.

      • ikyo

        Good analysis Ryan
        You’re right in the 3 points
        Thanks for your answer

  • Sandy

    YOU! are my new best friend. Thank you so very much. xoxoxoxoxo

    • http://WebEminence.com/ Ryan Bowman

      Glad you found this helpful, Sandy!

  • James Welbes

    I’m using the picturesque theme, and neither your solution, or the #breadcrumbs {display: none;} solution work. =[

    • James Welbes

      I found a solution. In Editor, I had to edit the functions.php page. Took out the line referring to breadcrumbs. it’s gone.

      • http://WebEminence.com/ Ryan Bowman

        Glad you figured it out. Same idea but your breadcrumbs line was in a different location.

    • http://WebEminence.com/ Ryan Bowman

      Hi James, this solution is specifically for Elegant Themes. I don’t think Picturesque is a theme from Elegant Themes. However, a similar method should work on most themes.

  • Chris Pete

    Great stuff. I was was scratching my head over this, it looked like an option that should be naturally embedded in the Appearance-> Theme Options from Elegant Themes. But no.
    Finding the magic word breadcrumbs lead me to your site, and..jackpot.
    I dont like modifying files that will be updated later, but I like ElegantThemes better. So, I sucked it up and did the mod. Works like a charm. Thanks. http://www.geoboxers.com

    • http://WebEminence.com/ Ryan Bowman

      Hey Chris. I’m glad you got this figured out. It would be nice to have an on/off switch for this in the ePanel but it’s not there yet.

      You should read up on using child themes, it will allow you to update your theme later and not lose the changes that you made in the Child Theme. The breadcrumbs fix is so fast and easy that I don’t mind doing it in the parent theme though and if I ever update, I’ll just do it again.

  • iman

    Thanks for great stuff. I’m using Divi theme and a white space appeared under the menu on top of the page.. Do you have any idea how can I fix this?

    • http://WebEminence.com/ Ryan Bowman

      I don’t think Divi has breadcrumbs so the space is from something else. Divi has a lot of space built into the theme and it would need to be changed in the CSS most likely. It’s hard to say exactly what would fix it because there are so many different layouts with Divi and I’d have to see your specific situation. You may want to post a question in their support forum.

  • Quinn

    I was wondering if you knew how to edit it further… I’m using the Eino theme and currently the breadcrumbs are date based (Home > 2014 > August) but I’d rather they be category based (Home > Games > Reviews). Any idea of this is possible?

    • http://WebEminence.com/ Ryan Bowman

      Definitely possible but I can’t cover it here. Check your theme options to see if they allow you to edit it. If not, you’d have to edit the theme files for the breadcrumbs. This is pretty technical though.

      • Quinn

        Poop. Oh well, worth an ask. My technical skills are about equal to a potato. Thank you!

        • http://WebEminence.com/ Ryan Bowman

          On 2nd thought, there are some plugins that will probably do this. Search WordPress Plugin directory for breadcrumbs plugins.

  • mlfant

    If you’re using any elegantthemes build, use this code to prevent breadcrumbs from showing:

    #breadcrumbs {
    display: none;
    }

    • http://WebEminence.com/ Ryan Bowman

      Yeah, that should work most of the time although sometimes it will leave the space for the breadcrumbs but delete the space I’ve noticed. Also, by leaving the line

      You’re making the theme call the breadcrumbs.php file on every page which is unnecessary and will add extra milliseconds to your site load time. That’s why I prefer to just delete the line.

      • mlfant

        Thanks for that info! I’ve gone through and deleted that string you highlighted from all the pages I could think of. It still seems like there may be some space in-between on my site, but glad to know how to remove it. The site isn’t that detailed to where it needs that kind of analysis.

        • http://WebEminence.com/ Ryan Bowman

          You may need to edit the CSS to eliminate the extra space.