Notifications
Clear all

wpForo 1.x.x [Solved] Breadcrumb direction in rtl site

12 Posts
2 Users
1 Reactions
3,262 Views
Posts: 9
Topic starter
(@eranshefi)
Active Member
Joined: 6 years ago

Hi

Breadcrumb is going from left to right (screenshot attached).

How can I change it to go from right to left?

Thanks

11 Replies
Sofy
Posts: 4790
 Sofy
Admin
(@sofy)
Support Team
Joined: 7 years ago

Hi @eranshefi,

Could you please leave your forum URL to allow us to check it? 

10 Replies
(@eranshefi)
Joined: 6 years ago

Active Member
Posts: 9
Sofy
 Sofy
Admin
(@sofy)
Joined: 7 years ago

Support Team
Posts: 4790

Hi @eranshefi,

Please navigate to Dashboard > Forums > Settings > Styles admin page, add the following CSS code in "Custom CSS code" textarea, save it, delete all caches and check again:

#wpforo #wpforo-wrap .wpf-breadcrumb {
transform: rotateY(180deg) !important;
}
(@eranshefi)
Joined: 6 years ago

Active Member
Posts: 9

It works, but text is now the mirrored (attached)..............................

:(((

Any other solutions?

Sofy
 Sofy
Admin
(@sofy)
Joined: 7 years ago

Support Team
Posts: 4790

Ah @eranshefi yes I see. 

I will update the topic a little later. Please wait for a while. 

(@eranshefi)
Joined: 6 years ago

Active Member
Posts: 9

Thanks!

Sofy
 Sofy
Admin
(@sofy)
Joined: 7 years ago

Support Team
Posts: 4790

@eranshefi,

Please remove the code I've provided in this post and add the following one. 

#wpforo #wpforo-wrap .wpf-breadcrumb {
 display: flex;
}

.wpf-item-element.wpf-root:after {
 display: none;
}

#wpforo #wpforo-wrap .wpf-breadcrumb div.active:after {
 right: -20px;
 box-shadow: -2px 2px;
}

#wpforo #wpforo-wrap .wpf-breadcrumb div:after {
 right: -15px;
 box-shadow: -2px 2px;
}
(@eranshefi)
Joined: 6 years ago

Active Member
Posts: 9
Sofy
 Sofy
Admin
(@sofy)
Joined: 7 years ago

Support Team
Posts: 4790

ok @eranshefi I see, add this code and let us know if you see any other issue:

#wpforo #wpforo-wrap .wpf-breadcrumb div{
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}

#wpforo #wpforo-wrap .wpf-breadcrumb .wpf-root {
border-left: none;
}
(@eranshefi)
Joined: 6 years ago

Active Member
Posts: 9

Great! Thanks a lot!!!!

Will this be embedded in the next version, so I can erase the custom code then?

 

 

Sofy
 Sofy
Admin
(@sofy)
Joined: 7 years ago

Support Team
Posts: 4790

@eranshefi,

yes, we'll add the code in new version release.