Notifications
Clear all

wpForo 1.x.x [Closed] Custom badge icons/images?

3 Posts
2 Users
3 Reactions
1,013 Views
Posts: 2
Topic starter
(@vaiiav)
New Member
Joined: 5 years ago

Is there a way I can change a user's badge to something other than a fontawesome icon? Custom png, or another icon of my choosing? Thank you!

2 Replies
Tutrix
Posts: 1522
(@tutrix)
Noble Member
Joined: 5 years ago

@vaiiav

you can replace the fontawesome icon with css "background"

Example i replace your half-star here in the forum with garfield 😉 

Video = https://www.screencast.com/t/zeXVcZlDw8

search for the code with the browser inspector
you will find this

.fa-star-half::before {
content: "\f089";
}

the replace code looks like

.fa-star-half::before {
content: "";
background: url(/wp-content/uploads/wpforo/avatars/garfield_4.jpg);
background-size: 30px;
background-repeat: no-repeat;
width: 30px;
height: 30px;
left: 0;
position: absolute;
margin-top: -20px;
margin-left: 35px;
}

add your code to custom css

Dashboard > Forums > Settings > Style (custom css)

 

1 Reply
(@vaiiav)
Joined: 5 years ago

New Member
Posts: 2

@tutrix Excellent. Thank you!