XF 2.0 How to add a custom Group Badge to user info

[Gator]

I've been contacted twice recently via PM asking me how I added a custom Group Badge to the user info as seen on my website:



How to:

Go to: AdminCP > Appearance > Templates > and search for the "extra.less" file
Open the file and add this code (call it anything you want. In the example here, I called it ".mybadge" ):

.mybadge {
background-image: url('https://www.mywebsite.com/mybadge.png');
background-repeat: no-repeat;
background-position: center top;
padding-top:42px;
text-align: center top;
}

Then go to "Groups and Permissions > User Groups" and select the group you want to add a badge too.
Under User banner styling, check "Other, using custom CSS class name" and enter the name you gave it in the extra.less file as shown below:
NOTE: Be sure to remove the "." (dot) in front of the name as shown below:

 

[Ozzy47]

Thanks for the share, THE this might be better posted in the resources as a guide, https://xenforo.com/community/resources/categories/xenforo-tips-guides-2-x.43/add

 

[Gator]

Thanks for the share, THE this might be better posted in the resources as a guide, https://xenforo.com/community/resources/categories/xenforo-tips-guides-2-x.43/add

Okay, I added it as you suggested. Who knows, maybe it will help others.

https://xenforo.com/community/resources/how-to-add-a-custom-group-badge-banner-to-user-info.6341/

 

[Ozzy47]

I saw that.

I am sure someone will find it useful.

 

[whitewolf68]

I have tried and tried to get the badges to display and still nothing. Been working on this for well over 2 weeks. I must be missing something somewhere.

Copied you code and changed the name to .owner and to the proper url, entered owner in the user banner styling and still nothing. If there a switch or setting I need to turn on here? I was using a rank addon in version 1 that workedke a charm.

 

[Gator]

I have tried and tried to get the badges to display and still nothing. Been working on this for well over 2 weeks. I must be missing something somewhere.

Copied you code and changed the name to .owner and to the proper url, entered owner in the user banner styling and still nothing. If there a switch or setting I need to turn on here? I was using a rank addon in version 1 that workedke a charm.

Send me a PM with your website address and screenshots of what you did and I will help you figure it out.

 

[Pearson Wright]

This doesn't work.

 

[Gator]

I actually forgot all about this post ...Try this instead

Unmaintained - How to add a Custom Group Badge / Banner to User Info

Display image with "User banner text" in "User info" STEP 1: Go to: AdminCP > Appearance > Templates > and search for the "extra.less" file Open the file and add this code (Call it anything you want.) In the example here, I called it...

xenforo.com

 

[Jake Sully]

like Pearson Wright said, this one does not work neither does post Gator mentioned.

Update: it seems you have to assign a user title for the badge to show.

 

[javakhir]

P

Creating custom User banner styling

Aug 25, 2019

More or less

• Paul B
• XenForo tips & guides [2.x]

extra.less

your own code & image path

for example I use:

.adminbanner
{
background-image: url('/images/ranks/admin.png');
text-indent: -10000em;
background-repeat: no-repeat;
background-size: 150px 30px;
width: 155px;
height: 35px;

because I use Message user info block width: 155px