Site logo

Archived topic

How to Enable Breadcrumbs using SEOPress in GeneratePress

5 replies · Started by Ali on December 25, 2018

Viewing posts 1–6 of 6

Good day :)

I'm creating a new post for topics "Breadcrumbs", "SEOPress", "GeneratePress"

How to Enable Breadcrumbs using SEOPress in GeneratePress

i hope this post will help all those people who are looking for this information.

1. Enable breadcrumbs in SEOPress and Save Changes!

seopress breadcrumbs

2. Copy following code:

<?php if(function_exists('seopress_display_breadcrumbs')) { seopress_display_breadcrumbs(); } ?>

3. Go to GP Hooks, Find "Inside Content Container" and paste there

4. Tick mark "Execute PHP" and hit "Save Hooks"

generatepress

5. Now you'll see breadcrumbs on your Blog Posts! Congrats! :D

This is how it'll look like (color might be different):

Onecrack.com post

6. To make it look beautiful, i tried few things. Some worked and Some not! This is what worked!

So, you'll have to copy following code and add it in on "ADDITIONAL CSS" (check screenshot) and hit save!

(Credit goes to those who created this. I don't remember the sites!)

Here's the CSS Code:

.breadcrumb {
font-size: 13px; color:#fff; font-weight: 400;}
/* Style the list */
ul.breadcrumb {
  padding: 10px 16px;
  list-style: none;
  background-color: #eee;
}

/* Add a slash symbol (>) before>behind each list item */
.breadcrumb li+li:before {
  padding: 0px 0px;
  color: #2074BE;
  content: ">\00a0";
}
.breadcrumb {
    padding: 3px 15px;
    margin-bottom: 20px;
    list-style: none;
    background-color: #f5f5f5;
    border-radius: 4px;
}
.breadcrumb a {
    color: #428bca;
    text-decoration: none;
}

putting css code

7. This is how it'll look like:

final look

For me, it looks great. But, it's your choice to keep it or not! :)

8. There's one last thing i would like to ask the developer which i couldn't find anywhere :D .

If you check my blog post:

https://onecrack.com/best-wireless-routers/

You see that the last part of the breadcrumbs is an actual 'LINK'. Is there any way to make the last part of breadcrumbs just text? No link?

This one:

clickable link

This is how i want it (non-clickable):

non clickable

So, this last step will also help lots of people! (including me)

I hope my post will help people looking for this exact solution.

Waiting for the support to help. <3

A bundle of thanks

Muhammad Sameer

Hi there,

Thanks for sharing the solution!

As for your last question, this is something you will need to ask SEOPress' support as it's not controlled by GeneratePress.

Hope this helps!

Okay, so i talked to the SEOPress support! they cleared everything to me!!

There's NO need to remove the link from the last part of Breadcrumb!! In fact, It's BEST for SEO! (Recommended by Google itself) :)

https://developers.google.com/search/docs/data-types/breadcrumb

Have an amazing day!

Muhammad Sameer

Glad you figured out :)

Can you please update this tutorial for GeneratePress 2021?

This archived topic is closed to new replies.