Go Back   vb.org Archive > vBulletin Article Depository > Read An Article > vBulletin Tips & Tricks
Reload this Page Nexia's HowTo: add style to usergroups html markups
FAQ Members List Calendar Search Today's Posts Mark Forums Read
Nexia's HowTo: add style to usergroups html markups
nexialys
Guest
Posts: n/a

 

Show Printable Version Email this Page Subscription
nexialys 05-12-2009, 10:00 PM
You see my markup?



How did i attach an umbrella beside my name, is a mystery for many of you who are interested to make their membernames unique.

But it's quite simple when you play a little with CSS elements.

First, instead of placing all the code in your Usergroup HTML Markup, you make it easier to edit and lighter for the browser by making your markups small and quick. Write is the same way as i did, creating a new class for the style.


Remember that this detail is found when you edit your usergroups... this example is the admins one.

Then you go to your Style Manager, and edit the Main CSS of your prefered style... you go to the bottom of the page, in the "Additional CSS Definitions" and put the new class style in the SECOND field (the first one is overwritten by most of the products you can play with).

the example of my own class looks like this:
HTML Code:
.ug_admin {
font-family: "Lucida Grande", sans-serif;
font-weight: bold;
color: #800080;
background-image: url(style/umbrella.png);
background-repeat: no-repeat;
padding-left: 13px;
}
example explained:
1- i changed the family of the font to have a more ergonomical one, Lucida is great
2- made the font in bold
3- changed the color for magenta
4- to make the umbrella show everywhere, i make it the background-image, no repeat
5- i add some padding to the left so the background image is without text over it
See, it's easy. but to learn about the CSS elements is more complicated than that, and you can have a need for a tutorial... here is a great link: CSS Tutorial

have some fun designing your usergroups!
Reply With Quote
  #2  
Old 05-21-2009, 11:29 AM
HyperActiv HyperActiv is offline
 
Join Date: Mar 2009
Location: Israel
Posts: 33
Благодарил(а): 0 раз(а)
Поблагодарили: 0 раз(а) в 0 сообщениях
Default
GREAT ONE!
thanks!
Reply With Quote
  #3  
Old 05-21-2009, 12:18 PM
plazzman plazzman is offline
 
Join Date: Oct 2008
Posts: 68
Благодарил(а): 0 раз(а)
Поблагодарили: 0 раз(а) в 0 сообщениях
Default
This is pretty awesome. And on that note, would it be possible to have a username of a banned member have a strikethrough?
Reply With Quote
  #4  
Old 05-21-2009, 02:55 PM
Lynne's Avatar
Lynne Lynne is offline
 
Join Date: Sep 2004
Location: California/Idaho
Posts: 41,180
Благодарил(а): 0 раз(а)
Поблагодарили: 0 раз(а) в 0 сообщениях
Default
Quote:
Originally Posted by plazzman View Post
This is pretty awesome. And on that note, would it be possible to have a username of a banned member have a strikethrough?
Doing that is default vbulletin and has nothing to do with this article. Just use the HTML markup in the Banned Usergroup. Hit the ? mark next to this feature in the admin cp if you need help. The css to use to strikethrough is:
Code:
text-decoration: line-through;
Reply With Quote
Reply

« Previous Thread | Next Thread »
Thread Tools

Posting Rules
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts
BB code is On
Smilies are On
[IMG] code is On
HTML code is Off
Forum Jump


All times are GMT. The time now is 10:57 PM.

Contact Us - Archive - Top

Powered by vBulletin® Version 3.8.12 by vBS
Copyright ©2000 - 2024, vBulletin Solutions Inc.
X vBulletin 3.8.12 by vBS Debug Information
  • Page Generation 0.04168 seconds
  • Memory Usage 2,233KB
  • Queries Executed 18 (?)
More Information
Template Usage:
  • (1)SHOWTHREAD
  • (1)ad_footer_end
  • (1)ad_footer_start
  • (1)ad_header_end
  • (1)ad_header_logo
  • (1)ad_navbar_below
  • (1)ad_showthread_beforeqr
  • (1)bbcode_code
  • (1)bbcode_html
  • (1)bbcode_quote
  • (1)footer
  • (1)forumjump
  • (1)forumrules
  • (1)gobutton
  • (1)header
  • (1)headinclude
  • (1)modsystem_article
  • (1)navbar
  • (4)navbar_link
  • (120)option
  • (4)post_thanks_box
  • (4)post_thanks_button
  • (1)post_thanks_javascript
  • (1)post_thanks_navbar_search
  • (4)post_thanks_postbit_info
  • (3)postbit
  • (3)postbit_onlinestatus
  • (4)postbit_wrapper
  • (1)spacer_close
  • (1)spacer_open
  • (1)tagbit_wrapper 
Phrase Groups Available:
  • global
  • inlinemod
  • postbit
  • posting
  • reputationlevel
  • showthread
Included Files:
  • ./showthread.php
  • ./global.php
  • ./includes/init.php
  • ./includes/class_core.php
  • ./includes/config.php
  • ./includes/functions.php
  • ./includes/class_hook.php
  • ./includes/modsystem_functions.php
  • ./includes/functions_bigthree.php
  • ./includes/class_postbit.php
  • ./includes/class_bbcode.php
  • ./includes/functions_reputation.php
  • ./includes/functions_post_thanks.php 
Hooks Called:
  • init_startup
  • init_startup_session_setup_start
  • init_startup_session_setup_complete
  • cache_permissions
  • fetch_threadinfo_query
  • fetch_threadinfo
  • fetch_foruminfo
  • style_fetch
  • cache_templates
  • global_start
  • parse_templates
  • global_setup_complete
  • showthread_start
  • showthread_getinfo
  • forumjump
  • showthread_post_start
  • showthread_query_postids
  • showthread_query
  • bbcode_fetch_tags
  • bbcode_create
  • showthread_postbit_create
  • postbit_factory
  • postbit_display_start
  • post_thanks_function_post_thanks_off_start
  • post_thanks_function_post_thanks_off_end
  • post_thanks_function_fetch_thanks_start
  • post_thanks_function_fetch_thanks_end
  • post_thanks_function_thanked_already_start
  • post_thanks_function_thanked_already_end
  • fetch_musername
  • bbcode_parse_start
  • bbcode_parse_complete_precache
  • bbcode_parse_complete
  • postbit_display_complete
  • post_thanks_function_can_thank_this_post_start
  • postbit_imicons
  • tag_fetchbit_complete
  • forumrules
  • navbits
  • navbits_complete
  • showthread_complete