Breadcrumbs are a simple navigation tool that lay out the current path a reader has taken on your site. They make it easy to find yourself in a website’s hierarchy and come with some SEO benefits too.

The Yoast SEO plugin adds a breadcrumb feature (amongst others) and this quick guide will show you how to integrate them into your MD child theme.

To add breadcrumbs, we’re going to hook a small code snippet Yoast provides into one of MD’s hooks for easy placement. No need to override any templates, and we’ll slightly modify the code to present our breadcrumbs with a clean design.

Let’s quickly cover the steps to adding breadcrumbs to your site, with a few different placement options:

Step 1: Activate Yoast SEO + Breadcrumbs

All you need to do is install + activate the Yoast SEO plugin and then enable the breadcrumbs feature by going to SEO > Advanced > Breadcrumbs and clicking the “Enabled” switch.

After this step, head over to your child theme’s functions.php file.

Step 2: Hook Breadcrumbs into Template

The 2 separate examples below will show you how to hook in breadcrumbs full-width, after the header and to the top of the content box.

Simply paste either function (but not both) and respective hook into your functions.php file to place the embed code.

Note: to best fit the different placements, the HTML in each function is slightly different.