How to add breadcrumbs to WordPress easily
In this post, you will learn how to easily add breadcrumbs to WordPress without worrying about coding errors.
You’ll also get to know the definition of breadcrumbs, their origin, and types, and how to add them using the Yoast plugin.
Ready to go?
What are breadcrumbs, and how did they get their name?
This is not a food niche blog, and the breadcrumbs we are going to discuss have nothing to do with bread or baking, so what are they and where did they get their name?
Breadcrumbs were first mentioned in the German fairy tale “Hansel and Gretel.”
These two young, poor children were abandoned in the forest by their father (a woodcutter) and his second wife.
The children had overheard their father’s wife pleading with him to abandon them in the forest or the family would perish from starvation.
On the second day, the kids took a slice of bread and left a trail of bread crumbs behind to follow and return home. Unfortunately, the birds ate the breadcrumbs and… (Are you enjoying the tale?)
Helloooooo, back to our post.
This is where breadcrumbs got their name.
What are breadcrumbs in a blog?
Breadcrumbs in your blog serve the same purpose as the “bread crumbs” in the tale: to help you find your way back.
I know, you need an example
Look at this (taken from another post):
The reader can see that he is currently on page “Optimize blog site structure.”
He can simply go back to the previous page, which is a category page (blogging), and/or go back to the blog page and home page.
This is the same as the “bread crumbs” trait the children left behind.
In other words, breadcrumbs are navigational tools that assist readers in knowing where they are and how far they are from the main page of a website.
They are displayed as clickable links to help navigate the site easily without the need for the back button.
Should we add breadcrumbs to WordPress?
It is important to add breadcrumbs to WordPress for both SEO and user experience benefits.
Better SEO and UX means higher ranking.
The first benefit of adding breadcrumbs to your website is that it enhances its structure and makes it easier to navigate.
It is, in addition to other types of optimization, considered an added value that pleases readers and helps search engines.
READ MORE>> How to optimize your blog’s site structure easily
READ MORE>> How to do technical SEO-the full guide
Furthermore, when you add breadcrumbs to WordPress (or another platform not to be discussed here), they are displayed as clickable links that serve as internal linking.
Internal links have huge value and impact when used properly because they:
- Reduce the bounce rate by taking your readers from page to page
- Keep readers hooked on your blog
- Increase your blog’s dwell time
- Increase crawlability after search engines have a better understanding of your content
Should we add breadcrumbs to our website? Yes, we should. That’s the best answer.
READ MORE>> What is internal linking and how to boost SEO with
Types of breadcrumbs
There are three main types of breadcrumbs: hierarchy-based, history-based, and attribute-based.
Hierarchy-based breadcrumbs
Hierarchy-based breadcrumbs are also known as location-based breadcrumbs.
This type of breadcrumb helps users understand your website’s hierarchy structure.
But, of course, it is not only used for this reason.
The main reason why we use location-based breadcrumbs is to help users move from their current location to a broader one.
Suppose someone is looking for a fitness tracker to buy. He searches on Google and finds what he wants at “Best Buy.” The browser will open a page that displays breadcrumbs, as in the image below:
As you can see, the user’s current location is on the page “Fitness trackers,” which is a part of the higher-level page “Fitness Trackers & Accessories.”
Every page on the left is at a higher level than those on the right.
By using this type of breadcrumb, users can browse the higher-level category to get more choices instead of going back to the search engine results page.
History-based breadcrumbs
A history-based breadcrumb is another type of navigation that shows the reader their current location and the steps they took (the path) to get there.
For example, if a user is on a website that sells cameras and browsing the section of cameras by brand, a history-based breadcrumb might look like this:
Home > cameras > Sony
The user can easily return to the previous page he visited before arriving at his current location.
Attribute-based breadcrumbs
This type is commonly used on e-commerce platforms.
It shows the attributes that a user has recently selected on a page. It also shows which category this page falls under.
Let’s look at this example:
Home> women’s clothing> Dresses> red dress> wrinkle resistant
Home, women’s clothing, and dresses are location-based breadcrumbs. After that, “red dress” and “wrinkle resistant” are attribute-based breadcrumbs.
How to add breadcrumbs to WordPress using the Yoast plugin
Since this post is about how to add breadcrumbs to WordPress, we are going to do it with the help of plugins.
The first step is to install the Yoast plugin.
Dashboard>>plugins>>Add new, then type “Yoast” in the search bar.
Install and activate it.
If you already have “Yoast” installed in your WordPress, let’s move on to the next step.
From the dashboard, go to Yoast SEO > Settings. (Search appearance in older WordPress versions)
It will take you to the settings page of the Yoast plugin.
Then go to “Advanced” and click on “breadcrumbs.”
You can change the appearance of the breadcrumb, such as the separator, but I recommend leaving them alone.
Scroll down and enable “Show blog posts in breadcrumbs” and ” Bold the last page” as seen in the image below
Now scroll down again until you find: “How to insert breadcrumbs in your theme”
Enable breadcrumbs for your theme and click on the link “Our help article…”
This will take you to the Yoast website to get the link that you are going to insert into your WordPress.
On the Yoast post, scroll down to find the code, copy it, and go back to your dashboard.
Now that you have copied the code, you have two choices for installing it: either by installing the PHP code into your theme header or by installing a new plugin, which I recommend.
How to add breadcrumbs to your WordPress without coding
If you have little knowledge of coding, I don’t recommend using this method. This is because it will stop working once you decide to change the theme since the code will be inserted into the theme header.
Anyway, let’s learn how to do it.
Go to your dashboard, scroll down, and click on “appearance,” then click on “theme file editor.”
On the right side of the screen, scroll down until you find “Theme Header.”
Click on it, then paste the code under the head> tag and save the changes. That’s it.
The second method (that I use and recommend) is using another plugin to help insert the code.
Go to the Plugins tab. Add new and search for a plugin called “Head, Footer, and Post Injections.”
Install and activate it.
Back on your dashboard, go to “Settings” and select “Header and Footer.”
Select “Post,” then paste your code in the “Desktop” section.
Save your changes and enjoy having breadcrumbs on your site.
This is simply how to add breadcrumbs to WordPress with Yoast using two methods.
Are you going to start using breadcrumbs? Let me know in the comment section below.
Do not forget to subscribe to my newsletter to receive every new update and also join my Facebook Group for more tips.
Share this pin with your friends
FAQs
What are breadcrumbs on a website?
Breadcrumbs on a website
Breadcrumbs, also known as “breadcrumb trails,” are a type of navigation menu typically found at the top of a page. They are a way for users to quickly and easily understand their current location and the hierarchy of the web pages. Breadcrumbs are usually displayed as a list of clickable links that represent the user’s current location and the path they took to get there
Do websites still need breadcrumbs?
Do websites still need breadcrumbs?
Absolutely, breadcrumbs are still required on websites for a variety of reasons. Breadcrumbs are useful for navigation, search engine optimization, and improving the user experience. They give users a clear and straightforward path to follow, making it easier for them to navigate the page. Breadcrumbs also help search engine crawlers better identify the structure and content of a website, which improves SEO. Lastly, they provide visual help to the user, making it easier for them to identify where they are on the page.
If you’re still here it means that you enjoyed reading, so why don’t you join my newsletter and share my content?