How to Customize the Genesis Breadcrumbs

Breadcrumbs are the path for the current page to the front page which indicates where you are, from where. It is a great way to provide the structured content and can be useful in various cases.

A well-structured Breadcrumbs shows in SERP result like this.

This feature is added by default in the Genesis framework and comes with the various customizations.

How to add Breadcrumbs?

Go to Genesis > Theme Settings > Breadcrumbs section and check the box to enable the breadcrumbs.

You can enable Breadcrumbs on all pages or specific pages. Save Changes.

Customize Breadcrumbs in Genesis

Any Genesis child theme outputs the default framework breadcrumbs customization found in /genesis/lib/classes/class-genesis-breadcrumb.php until we have not overwritten this.

Here are the default arguments function filtered within the class Genesis_Breadcrumb found in the /genesis/lib/classes/class-genesis-breadcrumb.php

	/**
	 * Constructor. Set up cacheable values and settings.
	 *
	 * @since 1.5.0
	 */
	public function __construct() {

		// Default arguments.
		$this->args = array(
			'home'                    => __( 'Home', 'genesis' ),
			'sep'                     => __( ' <span aria-label="breadcrumb separator">/</span> ', 'genesis' ),
			'list_sep'                => ', ',
			'prefix'                  => genesis_markup(
				array(
					'open'    => '<div %s>',
					'context' => 'breadcrumb',
					'echo'    => false,
				)
			),
			'suffix'                  => genesis_markup(
				array(
					'close' => '</div>',
					'echo'  => false,
				)
			),
			'heirarchial_attachments' => true,
			'heirarchial_categories'  => true,
			'labels'                  => array(
				'prefix'    => __( 'You are here: ', 'genesis' ),
				'author'    => __( 'Archives for ', 'genesis' ),
				'category'  => __( 'Archives for ', 'genesis' ),
				'tag'       => __( 'Archives for ', 'genesis' ),
				'date'      => __( 'Archives for ', 'genesis' ),
				'search'    => __( 'Search for ', 'genesis' ),
				'tax'       => __( 'Archives for ', 'genesis' ),
				'post_type' => __( 'Archives for ', 'genesis' ),
				'404'       => __( 'Not found: ', 'genesis' ),
			),
		);

    }

 

Modify the Breadcrumbs Display

You can modify the breadcrumbs using this in functions.php

<?php
//* Do NOT include the opening php tag shown above. Copy the code shown below.

//* Modify breadcrumb arguments.
add_filter( 'genesis_breadcrumb_args', 'genesiskit_breadcrumb_args' );
function genesiskit_breadcrumb_args( $args ) {
    $args['home'] = 'Home';
    $args['sep'] = ' / ';
    $args['list_sep'] = ', '; // Genesis 1.5 and later
    $args['prefix'] = '<div class="breadcrumb">';
    $args['suffix'] = '</div>';
    $args['heirarchial_attachments'] = true; // Genesis 1.5 and later
    $args['heirarchial_categories'] = true; // Genesis 1.5 and later
    $args['display'] = true;
    $args['labels']['prefix'] = 'You are here: ';
    $args['labels']['author'] = 'Archives for ';
    $args['labels']['category'] = 'Archives for '; // Genesis 1.6 and later
    $args['labels']['tag'] = 'Archives for ';
    $args['labels']['date'] = 'Archives for ';
    $args['labels']['search'] = 'Search for ';
    $args['labels']['tax'] = 'Archives for ';
    $args['labels']['post_type'] = 'Archives for ';
    $args['labels']['404'] = 'Not found: '; // Genesis 1.5 and later
return $args;
}

Customize Genesis Breadcrumbs

You can individually customize them if you do not want to add the above snippet.

We will use the same $args in a custom function to customize them. Each snippet mentioned below go on functions.php until no file name is added.

Remove → You are Here

//* Remove 'You are here' on the front of breadcrumb trail
add_filter( 'genesis_breadcrumb_args', 'gk_prefix_breadcrumb' );
function gk_prefix_breadcrumb( $args ) {
    $args['labels']['prefix'] = ''; 
    return $args;
}

Change → Home Text

//* Change the text at the front of breadcrumb trail
add_filter( 'genesis_breadcrumb_args', 'gk_home_text_breadcrumb' );
function gk_home_text_breadcrumb( $args ) { 
    $args['home'] = 'ICON_or_Text'; 
    return $args;
}

Change → Home Link URL

//* Modify Home breadcrumb link.
add_filter ( 'genesis_home_crumb', 'gk_breadcrumb_home_link' ); // Genesis >= 1.5
add_filter ( 'genesis_breadcrumb_homelink', 'genesiskit_breadcrumb_home_link' ); // Genesis =< 1.4.1
function gk_breadcrumb_home_link( $crumb ) {
	return preg_replace('/href="[^"]*"/', 'href="http://example.com/home"', $crumb);
}

Change → Breadcrumb Separator

//* Change the breadcrumb separator.
add_filter( 'genesis_breadcrumb_args', 'gk_change_breadcrumb_separator' );
function gk_change_breadcrumb_separator( $args ) {
    $args['sep'] = ' › ';
    return $args;
}

You can find more HTML number for symbols here.

Change → Breadcrumb Labels

//* Prefix author breadcrumb trail with the text 'Authored By'
add_filter( 'genesis_breadcrumb_args', 'gk_prefix_author_breadcrumb' );
function gk_prefix_author_breadcrumb( $args ) {
    $args['labels']['author'] = 'Authored By ';
    return $args;
}

Remove → Category

//* Remove Category from breadcrumb
add_filter ( 'genesis_post_crumb', 'gk_breadcrumb_category_post' ); 
function gk_breadcrumb_category_post( $crumb ) {
    $crumb = single_post_title( '', false );
    return $crumb;
}

It is recommended to add “Blog” Link to the breadcrumb so this snippet became more useful. Snippet is mentioned at the end.

Remove → Breadcrumbs

//* Remove Breadcrumbs
remove_action( 'genesis_before_loop', 'genesis_do_breadcrumbs' );

Remove → Breadcrumb from Specific Page

//* Remove the breadcrumbs on a specific page
add_action( 'genesis_before', 'genesiskit_remove_breadcrumbs' );
function genesiskit_remove_breadcrumbs() {
	// if we are not on front page, abort.
	if ( ! is_front_page() ) {
		return;
	}
    remove_action( 'genesis_before_loop', 'genesis_do_breadcrumbs' );
}

Re-position → Genesis Breadcrumbs

//* Reposition the breadcrumbs
remove_action( 'genesis_before_loop', 'genesis_do_breadcrumbs' );
add_action( 'genesis_after_header', 'genesis_do_breadcrumbs' );

Find Genesis hooks using Visual Hook Guide.

Re-position → Genesis Breadcrumb on Specific Page

//* Reposition the breadcrumbs on a specific page
add_action( 'genesis_before', 'genesiskit_resposition_breadcrumbs' );
function genesiskit_resposition_breadcrumbs() {
	// if we are not on front page, abort.
	if ( ! is_front_page() ) {
		return;
	}
    remove_action( 'genesis_before_loop', 'genesis_do_breadcrumbs' );
    add_action( 'genesis_after_header', 'genesis_do_breadcrumbs' );
}

Find Genesis hooks using Visual Hook Guide.

Add font Icon before Home

//* Use Font icon for Home breadcrumb
add_filter ( 'genesis_home_crumb', 'gk_breadcrumb_home_icon' ); 
function gk_breadcrumb_home_icon( $crumb ) {
     $crumb = '<a href="' . home_url() . '" title="' . get_bloginfo('name') . '"><i class="ionicons ion-home"></i> Home</a>';
     return $crumb;
}

Make sure you are loading the ionicons or change the class to your icon class.

Add “Blog” to Genesis Single Post Breadcrumbs

By default, it is You are here: Home / CATEGORY / SINGLE POST

We can change like this You are here: Home / Blog / CATEGORY / SINGLE POST

Bill Erickson wrote a snippet to do this. Add the following in functions.php

add_filter( 'genesis_single_crumb', 'be_add_blog_crumb', 10, 2 );
add_filter( 'genesis_archive_crumb', 'be_add_blog_crumb', 10, 2 );
/**
 * Add Blog to Breadcrumbs
 * @author Bill Erickson
 * @link http://www.billerickson.net/adding-blog-to-genesis-breadcrumbs/
 *
 * @param string original breadcrumb
 * @return string modified breadcrumb
 */
function be_add_blog_crumb( $crumb, $args ) {
	if ( is_singular( 'post' ) || is_category() )
		return '<a href="' . get_permalink( get_option( 'page_for_posts' ) ) . '">' . get_the_title( get_option( 'page_for_posts' ) ) .'</a> ' . $args['sep'] . ' ' . $crumb;
	else
		return $crumb;
}

Breadcrumbs are Good but are not for everyone. That totally depends on the site design and niche and the requirements.