Adding the css code on breadcrumbs

[shinny0129]

Hi,

First, The question is “could you add a new class with slugs on breadcrumbs?”.

 

What I would like to do is to add a font icon “before the title on breadcrumbs” with their own one such as post categories,product categories,pages,forums or user profile page (with their avatar).

 

<Single Post pages, single Product pages, topic and replies pages must be the slug which belong to.>

 

Simply, I have tried to add a icon and it works with css below;

 

section.breadcrumbs-container div.container h1.page-title::before { content: “<font code>” }

 

I would like to add css code on the breadcrumbs like…,

 

HTML

<section class=’container-wrap main-title alternate-color  border-bottom breadcrumbs-container’><div class=’container’><h1 class=”page-title kleo-<slug>”>TITLE</h1><div class=’breadcrumb-extra’>

 

CSS

section.breadcrumbs-container div.container h1.kleo-<slug>::before{ content: “<font code>” }

 

This example, I wrote it like “kleo-<slug>”. Slugs… IDs…, not sure about this…

 

I guess the slug is the unique and much easier to classify and manage it all within CSS.

 

To determine all pages (post categories,product categories,pages or forums), it seems the slug is right for me.

 

To show their own avatar on user profile page title must be different.

 

Above all, kindly asking, would you please send me the code to add this css class on the breadcrumbs?

 

Also please consider to add their own avatar image on too?

 

Thank you for your support.

 

All best,

 

===== PS

 

This is for other kleo users who want to add font icons on bbpress.

 

I have added the font icons at front of a forum name with css like;

 

#bbp-forum-<forum_id> li.bbp-forum-info a.bbp-forum-title::before {

font-family: ‘<your own font file>’;

content: ‘\e000’;

}

 

[Laura]

Not marked as solution

[Radu]

Not marked as solution

[shinny0129]

Not marked as solution

[Radu]

Not marked as solution

[Author]

Posts