Username Customization

[Wing]

Hello all,

Where would I go for css style codes, or what mod would I need to download to get usernames stylization like this forum has: http://silvatales.com/


I did a quick search across the board, but have not been able to find any setup info on this. Guessing there is a mod somewhere for this functionality?

 

[TPerry]

Hello all,

Where would I go for css style codes, or what mod would I need to download to get usernames stylization like this forum has: http://silvatales.com/


I did a quick search across the board, but have not been able to find any setup info on this. Guessing there is a mod somewhere for this functionality?

You mean to give the different usergroups different colors for the usernames and also a little emblem beside certain groups names?
If so, go into each group you want to customize, go into the "User Name CSS" field and place something like this

font-weight: bold; makes text bold
color:#FF0000; defines the color
font-size: 8; defines the font size
background: transparent url('images/8ball.png') no-repeat; places an image (in this ccase an 8 ball) beside the user name
padding-left: 14px; adjusts the padding

Do not use the text highlighted in red in the area.

 

[Paul B]

I put some examples in the manual: http://xenforo.com/help/user-group-styling/

 

[Wing]

Great, I am specifically looking for the glow effect as shown on the forum I listed in the OP.
Any ideas on the css glow code?

 

[TPerry]

Great, I am specifically looking for the glow effect as shown on the forum I listed in the OP.
Any ideas on the css glow code?

You can try something like adding
text-shadow: 1px 4px 6px (color #);
into the user name css also.

http://www.webdevdoor.com/html-css/css3-text-glow-text-shadow/
http://line25.com/articles/using-css-text-shadow-to-create-cool-text-effects

 

[Wing]

You can try something like adding
text-shadow: 1px 4px 6px (color #);
into the user name css also.

http://www.webdevdoor.com/html-css/css3-text-glow-text-shadow/
http://line25.com/articles/using-css-text-shadow-to-create-cool-text-effects

Unfortunetly, that css code didnt add any changes to the names. I will take a look at those articles tho.

 

[TPerry]

Unfortunetly, that css code didnt add any changes to the names. I will take a look at those articles tho.

Play with this in your extra.css (it has a green color to it in this example). It will apply to all users.

.messageUserBlock a.username {
text-shadow: 3px 3px 4px rgb(14, 145, 14) !important;
}

will give you something like the first image below.

Using this

.messageUserBlock a.username {
text-shadow: 3px 3px 4px black !important;
}

will result in the second image.




If you want to do it in the members list, you would use

.memberListItem h3.username {
text-shadow: 3px 3px 4px #5C5B5B !important;
}

 

[Shelley]

Have you tried looking at this guide (which is basically the same kind of link Brogan link to. Add any styling to the usergroup you want certain styling to. http://xenforo.com/community/threads/usergroup-markup.5506/