• This site uses cookies. By continuing to use this site, you are agreeing to our use of cookies. Learn more.

XF 1.5 Setting up custom user banners

Exemption

Active member
#1
Ok so I want to have my banners like


So I inspected element and got the colors and put
Code:
.userBanner.Moderator
{
color: #006600;
background-color: #00CC33;
border-color: #006600;
}
in the extra folder but I got

and I want the background color to be on the ends like the top one :)
 

Amaury

Well-known member
#4
That should be all you need. It's how we set banners up on KH-Flare 2014 and they appear like that.

You may have other CSS conflicting with your CSS.
 

Dylan V

Well-known member
#6
Hi,

Remove everything you did before you apply what I wrote below.

Here:

Screenshot_1.png

Put this: userBanner bannerCustom and change Custom with what you want.

Now, go to EXTRA.css and add this:
Code:
.userBanner.bannerCustom
{
    color: #000000;
    background-color: #000000;
    border-color: #000000;
}

.userBanner.bannerCustom.wrapped span
{
    background-color: #000000;
}
Change Custom with what you've put on the image above and #000000 with the color of your choice.

This:
Code:
.userBanner.bannerCustom.wrapped span
applies to that:

Screenshot_2.png
 

Exemption

Active member
#7
Hi,

Remove everything you did before you apply what I wrote below.

Here:

View attachment 111041

Put this: userBanner bannerCustom and change Custom with what you want.

Now, go to EXTRA.css and add this:
Code:
.userBanner.bannerCustom
{
    color: #000000;
    background-color: #000000;
    border-color: #000000;
}

.userBanner.bannerCustom.wrapped span
{
    background-color: #000000;
}
Change Custom with what you've put on the image above and #000000 with the color of your choice.

This:
Code:
.userBanner.bannerCustom.wrapped span
applies to that:

View attachment 111042
Amazing it worked! Thanks so much :)