Style yoast seo breadcrumbs

In this article we will show you how to insert and Style yoast seo breadcrumbs. Yoast SEO is great tool for any wordpress website. It understands the seo well and gives us all insights to improve our ranking. They have a inbuilt breadcrumbs feature which you can include in any of theme template files.


This is the php code you need to insert into your theme’s template file. Question may be arising in your mind how to find which file and where to add in that file.

How to find template file ?

Well inside your theme’s root directory look for these files.

single.php is template file for single post.

page.php is template file for single page template.

single-{custom_post_type}.php is template file for single custom post type. for example for movies cpt it should be single-movie.php

for texonomy.php look into same structure as archive.php

You can get more information on template files here.

What code to add ?

if ( function_exists('yoast_breadcrumb') ) {
  yoast_breadcrumb( '<p id="breadcrumbs">','</p>' );



Where to add in template file ?

Normally we prefer it just after

<div class="content">

but you can experiment with that as well.


How to style yoast seo breadcrumbs ?

For that you need to add some extra css code. Here’s a sample code.

#breadcrumbs {font-size: 17px; color: #8e908f;margin:1em 0 2em 0;}
#breadcrumbs a { font-size: 17px; display: inline; border: none; padding: 0; text-transform: none;}

You can adjust colors , font-size in the code.


Please do use our wordpress theme detector tool   to find out themes or plugins your site it using.

Leave a Comment

Your email address will not be published. Required fields are marked *