I’m a huge fan of Beaver Builder, not so much a fan of Divi Builder; sometimes, when you’re building out pages in one of those (or others) you use a template that doesn’t have standard headers or footers. Though it’s not as in style as it used to be, some clients/UX designers still like having a breadcrumb at or near the top of the page.

So you reach for your favourite (or most available) plugin that builds a highly customizable breadcrumb trail, like Yoast SEO or Breadcrumb NavXT. Except all they do is slap it in the top of the page, or in the case of not using a template with no headers or footers, possibly not at all.

So the easiest way to do it: create your own shortcode.

Since both Yoast and NavXT require you to add code to your theme, we can take that code and create a shortcode that you can use anywhere you can put text. You could theoretically put it in the middle of your content, though I’m not sure why you’d do that. Anyway, on to the code!

In your functions.php file (or wherever you have custom code that gets called from functions.php), use the following:

Yoast

function my_breadcrumb() {
   if ( function_exists('yoast_breadcrumb') ) {
      return yoast_breadcrumb( '<p id="breadcrumbs">', '</p>', false);
   }
}
add_shortcode( 'my_breadcrumb', 'my_breadcrumb' );

Breadcrumb NavXT

function my_breadcrumb() {
   if(function_exists('bcn_display') && !is_front_page()) {
      $breadcrumb_output = '<div class="breadcrumbs" xmlns:v="http://rdf.data-vocabulary.org/#">';
      $breadcrumb_output .= bcn_display( true );
      $breadcrumb_output .= '</div>';
      return $breadcrumb_output;
   }
}
add_shortcode( 'my_breadcrumb', 'my_breadcrumb' );

Then on your page/post/custom post type, put this in a text block:

[my_breadcrumb]

Happy breadcrumbing!

(with thanks to Ash Weblog)