0

I know we can manually edit the breadcrumb title for a page or post using Yoast SEO's breadcrumb functionality.

But with thousands of posts and pages on an existing site this isn't desirable.

My brain goes full potato when it comes to stuff other than html and css and maybe hacking some existing PHP code snippets to do my bidding with a lot of trial and error. So that's why I'm reaching out to the community here.

Example:

A child page about blue widgets lives at:

https://www.example.com/widgets/blue

By default I believe the automatically generated breadcrumb path for this child page of a parent page would look something like:

Home > We make the most amazing widgets in the world > Our Blue widgets are everything you need!

The filter would instead:

  1. Use the url slug for each page [widgets] and [blue] as the breadcrumb title.
  2. Capitalize the first letter of only the first word.
  3. Turn any dashes (-) in the slug into spaces for the breadcrumb title.

And output a breadcrumb that looks like this:

Home > Widgets > Blue

The filter would target pages, posts and categories across the board so that all webpages on the site would have a breadcrumb with breadcrumb titles based on the url slugs of the different parts of the breadcrumb path.

If it is possible to still manually override the filter by entering a custom breadcrumb title in the existing Yoast SEO custom breadcrumb title field, that would be awesome.

I have tried to find existing code snippets that come close to this functionality but haven't been succesful so far.

Any help or links you are willing to provide will be appreciated very much. Thank you in advance for taking the time to reply.

1

Yoast does have a filter for you to use. See here: https://gist.github.com/jmcclellan/b2d97ffee0e924e28fa1

I used this to add "parent" pages to custom post types. We wanted to use pages as our category landers w/ custom post types as children. Yoast would not output the parent page slug by default since there is technically no real relationship, so we used this function to override and splice in the parent slug for each custom post type. You should be able to modify this solution for your needs:

add_filter("wpseo_breadcrumb_links", "wpse_100012_override_yoast_breadcrumb_trail");

function wpse_100012_override_yoast_breadcrumb_trail($links)
{
    $post_type = get_post_type();

    if ($post_type === 'claims') {
        $breadcrumb[] = array(
            'url' => '/claim',
            'text' => 'claim'
        );
        array_splice($links, 1, -3, $breadcrumb);
    }
    return $links;
}

For the lowercase styling, just use CSS:

#breadcrumbs {
    text-transform: lowercase;
}        
| improve this answer | |
0

I actually needed to do this today it turns out, so I went ahead and wrote a solution for pages. I don't use posts, other than CPT for this project, but with a little modification this can work for posts as well. I left my previous answer as it does provide a solution that may be enough for certain uses.

add_filter('wpseo_breadcrumb_links', 'wpse350538_customize_yoast_breadcrumbs');

function wpse350538_customize_yoast_breadcrumbs($links)
{
    //get current page slug and make it pretty
    $current_page = sanitize_post($GLOBALS['wp_the_query']->get_queried_object());
    $slug = $current_page->post_name;
    $slug_pretty = str_replace('-', ' ', $slug);

    if (is_page()) {
        //this page has ancestors
        if ($current_page->post_parent) {
            //set the first breadcrumb to homepage
            $links = array(
                0 => array(
                    'url' => get_home_url(),
                    'text' => 'home'
                )
            );
            //get a list of parent pages, loop through them and add to link array
            $parents = get_post_ancestors($current_page->ID);
            foreach ($parents as $parent) {
                $id = get_post_field('ID', $parent);
                //make sure we don't add the current page twice
                if ($id !== $current_page->ID) {
                    //get parent slug and make it pretty
                    $parent_slug = get_post_field('post_name', $current_page->post_parent);;
                    $links[] = array(
                        'url' => get_permalink($id),
                        'text' => str_replace('-', ' ', $parent_slug)
                    );
                }

            }
            //lastly, add current page to link array
            $links[] = array(
                'url' => $slug,
                'text' => $slug_pretty
            );

        } else {
            // this page is top level so we just use the slug and make it pretty
            $links = array(
                0 => array(
                    'url' => get_home_url(),
                    'text' => 'home'
                ),
                1 => array(
                    'url' => $slug,
                    'text' => $slug_pretty
                )
            );
        }

    }

    return $links;
}
| improve this answer | |
  • Thank you for sharing the code for a possible solution and a closely related need others may have! I'll be testing it soon. – tfmwa Apr 23 at 16:18

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.