[Resolved] Breadcrumbs built-in

[93487u5tr938ouh4trnos8fyoh]

Hi,

I am a new GeneratePress user and I am very happy with the theme.

I think breadcrumbs should be part of the theme itself and customizable as an element:

1) Not many people use SEO plugins that have breadcrumb display functionality built-in, only the schema markup.

2) Many people now use DISALLOW_FILE_EDIT true in their wp-config, which prevents execution of PHP which is needed for manual setup.

3) It’s too much of an important part of a modern site, it’s like the header, footer, menu etc, too important to be left out to be inserted manually.

4) Many people out there are not geeks and don’t understand code. Even if they need to follow tutorials, it’s much better for the average consumer to have that option built-in due to its importance, being an integral part of a modern site.

5) When it is built-in, there could be options for stylizing it, changing font etc. I don’t know how to do that even after following the guides.

6) Most of the modern themes do have breadcrumb support built-in.

[Marco]

+1

[David]

Hi there,

Thanks for the feedback. Breadcrumbs are best handled by a plugin. Whether that be SEO or a dedicated breadcrumb plugin like Breadcrumb NavXT. They provide a much greater level of customization then we would wish to inject into the theme.

A GP breadcrumb would be fairly redundant for the vast majority of sites that already have SEO in place. But we are always open to suggestions so maybe theres a simple solution we can add to our docs in the future.

[93487u5tr938ouh4trnos8fyoh]

Most of the plugins have that functionality built-in, because of the importance in the modern SEO. Google just likes structured data and most of the themes out there have that in the box. I remember the times when we installed plugins to handle our menus. I know it can be accomplished by a plugin, I am just saying that the majority of the themes have that built in. Keep adding plugin for each functionality and the usage of a light theme defies the purpose as the overall site is becoming heavier. What I said is also problematic as not only you need to have a plugin, but you have to lessen the security in order to execute the PHP from Yoast or another plugin. With WP powering 1/3 of the sites according to their stats, opening up another possibility for lessen the hackers I believe is a bad approach. Please consider using breadcrumbs built-in, in fact if you follow what Google wants now, in many of their A/B tests you’ll see breadcrumbs playing a significantly more important role, which means that is the future vector for them, making breadcrumbs a very important part of a site, just like the menu.

[Tom]

Really appreciate the feedback!

Breadcrumbs are quite complex, which is why there are pretty large plugins that handle them. If we’re able to find a simple solution, we’ll definitely consider adding them to the theme 🙂

[zenjukai]

This is actually easy to do by adding some code to your child’s function file and then creating a hook to place the breadcrumbs. I have it setup if you want the code? =)

[Tom]

I’d love to see it 🙂

Thanks!

[zenjukai]

Hey Tom,

Here yah go … so this is the test site I have up and running: https://shingen.ca/dv/generatepress/

The code I added was in two parts, the function file code and the CSS.

Function File Code –

// Breadcrumbs
function generatepress_breadcrumbs()
{
    $showOnHome = 0; // 1 - show breadcrumbs on the homepage, 0 - don't show
    $delimiter = '›'; // delimiter between crumbs
    $home = 'Home'; // text for the 'Home' link
    $showCurrent = 1; // 1 - show current post/page title in breadcrumbs, 0 - don't show
    $before = '<span class="current">'; // tag before the current crumb
    $after = '</span>'; // tag after the current crumb

    global $post;
    $homeLink = get_bloginfo('url');
    if (is_home() || is_front_page()) {
        if ($showOnHome == 1) {
            echo '<div id="breadcrumbs"><a href="' . $homeLink . '">' . $home . '</a></div>';
        }
    } else {
        echo '<div id="breadcrumbs"><a href="' . $homeLink . '">' . $home . '</a> ' . $delimiter . ' ';
        if (is_category()) {
            $thisCat = get_category(get_query_var('cat'), false);
            if ($thisCat->parent != 0) {
                echo get_category_parents($thisCat->parent, true, ' ' . $delimiter . ' ');
            }
            echo $before . 'Archive by category "' . single_cat_title('', false) . '"' . $after;
        } elseif (is_search()) {
            echo $before . 'Search results for "' . get_search_query() . '"' . $after;
        } elseif (is_day()) {
            echo '<a href="' . get_year_link(get_the_time('Y')) . '">' . get_the_time('Y') . '</a> ' . $delimiter . ' ';
            echo '<a href="' . get_month_link(get_the_time('Y'), get_the_time('m')) . '">' . get_the_time('F') . '</a> ' . $delimiter . ' ';
            echo $before . get_the_time('d') . $after;
        } elseif (is_month()) {
            echo '<a href="' . get_year_link(get_the_time('Y')) . '">' . get_the_time('Y') . '</a> ' . $delimiter . ' ';
            echo $before . get_the_time('F') . $after;
        } elseif (is_year()) {
            echo $before . get_the_time('Y') . $after;
        } elseif (is_single() && !is_attachment()) {
            if (get_post_type() != 'post') {
                $post_type = get_post_type_object(get_post_type());
                $slug = $post_type->rewrite;
                echo '<a href="' . $homeLink . '/' . $slug['slug'] . '/">' . $post_type->labels->singular_name . '</a>';
                if ($showCurrent == 1) {
                    echo ' ' . $delimiter . ' ' . $before . get_the_title() . $after;
                }
            } else {
                $cat = get_the_category();
                $cat = $cat[0];
                $cats = get_category_parents($cat, true, ' ' . $delimiter . ' ');
                if ($showCurrent == 0) {
                    $cats = preg_replace("#^(.+)\s$delimiter\s$#", "$1", $cats);
                }
                echo $cats;
                if ($showCurrent == 1) {
                    echo $before . get_the_title() . $after;
                }
            }
        } elseif (!is_single() && !is_page() && get_post_type() != 'post' && !is_404()) {
            $post_type = get_post_type_object(get_post_type());
            echo $before . $post_type->labels->singular_name . $after;
        } elseif (is_attachment()) {
            $parent = get_post($post->post_parent);
            $cat = get_the_category($parent->ID);
            $cat = $cat[0];
            echo get_category_parents($cat, true, ' ' . $delimiter . ' ');
            echo '<a href="' . get_permalink($parent) . '">' . $parent->post_title . '</a>';
            if ($showCurrent == 1) {
                echo ' ' . $delimiter . ' ' . $before . get_the_title() . $after;
            }
        } elseif (is_page() && !$post->post_parent) {
            if ($showCurrent == 1) {
                echo $before . get_the_title() . $after;
            }
        } elseif (is_page() && $post->post_parent) {
            $parent_id  = $post->post_parent;
            $breadcrumbs = array();
            while ($parent_id) {
                $page = get_page($parent_id);
                $breadcrumbs[] = '<a href="' . get_permalink($page->ID) . '">' . get_the_title($page->ID) . '</a>';
                $parent_id  = $page->post_parent;
            }
            $breadcrumbs = array_reverse($breadcrumbs);
            for ($i = 0; $i < count($breadcrumbs); $i++) {
                echo $breadcrumbs[$i];
                if ($i != count($breadcrumbs)-1) {
                    echo ' ' . $delimiter . ' ';
                }
            }
            if ($showCurrent == 1) {
                echo ' ' . $delimiter . ' ' . $before . get_the_title() . $after;
            }
        } elseif (is_tag()) {
            echo $before . 'Posts tagged "' . single_tag_title('', false) . '"' . $after;
        } elseif (is_author()) {
            global $author;
            $userdata = get_userdata($author);
            echo $before . 'Articles posted by ' . $userdata->display_name . $after;
        } elseif (is_404()) {
            echo $before . 'Error 404' . $after;
        }
        if (get_query_var('paged')) {
            if (is_category() || is_day() || is_month() || is_year() || is_search() || is_tag() || is_author()) {
                echo ' (';
            }
            echo __('Page') . ' ' . get_query_var('paged');
            if (is_category() || is_day() || is_month() || is_year() || is_search() || is_tag() || is_author()) {
                echo ')';
            }
        }
        echo '</div>';
    }
} // end the_breadcrumb()

Then I added this snippet so I actually didn’t have to create a hook, rather just replace the action placement.

// Added action instead of having to use hooks
add_action( 'generate_before_content', function() {
    if ( function_exists('generatepress_breadcrumbs') ) {
        generatepress_breadcrumbs( '<div class="grid-container grid-parent"><p id="breadcrumbs">','</p></div>' );
    }
} );

Then here is the CSS just to style it a bit.

/* Breadcrumbs */

#breadcrumbs {
    list-style: none;
    margin-bottom: 30px;
    overflow: hidden;
}

#breadcrumbs li {
    display: inline-block;
    vertical-align: middle;
    margin-right: 15px;
}

#breadcrumbs .separator {
    font-size: 18px;
    font-weight: 100;
    color: #ccc;
}

Enjoy and hope it helps. =)

Cheers
Mike

[Tom]

Thanks for this – appreciate it! 🙂

[zenjukai]

Your welcome, anytime. =)

[Steve]

I think this is an important functionality especially if you’re running an ecommerce site.

Update: Nevermind, I see an option to activate breadcrumbs under Theme Customization.

[Leo]

Glad to hear 🙂

[acela]

Greetings,

I’m moving over a site which has breadcrumbs built into its theme, and I’m wondering what the status of this issue is today in GeneratePress…

I see a number of suggestions to add breadcrumbs to the GP theme natively, and then zenjukai posted some code two years back – and then a few months ago Steve wrote above, “I see an option to activate breadcrumbs under Theme Customization”…

But, I don’t see / can’t find this option. Am I missing something?

Love GeneratePress! Thanks!

[Ying]

Hi there,

GeneratePress doesn’t have built-in breadcrumbs, but it’s not difficult to be added.
https://docs.generatepress.com/article/adding-breadcrumbs/

I see an option to activate breadcrumbs under Theme Customization

This option is generated by woocommerce for products, if your site is woocommerce site, then you will find the option in customizer.

[acela]

Ah, OK – thanks, that’s helpful to know… I’m not using WooCommerce so wasn’t seeing it. That’s a nice integration.

[Author]

Posts