The Arcive of Official vBulletin Modifications Site.It is not a VB3 engine, just a parsed copy! |
|
Postbit Legacy - Usergroup Backgrounds vb4 Details »» | |||||||||||||||||||||||||||||
Postbit Legacy - Usergroup Backgrounds vb4
Developer Last Online: Jan 2012
Updated for vBulletin 4.0.1!!!!
Hey Everyone! I went ahead and updated my vb3.x.x mod to work with the new coding in vBulletin 4. There are a few more modifications to make than the last time, but overall, I think you will find this very easy. To start, let's look at a screenshot of what this mod will do for you, it's the image behind the username and the posbit information. This will not do anything else but assign a special background to the specified usergroup and assign the regular styling to all other usergroups: DEMO: http://ltxtech.com/forums/showthread...or-New-Upgrade Now that you have decided to continue with the modification, let's begin! Navigate to: Style Manager --> Click on the << >> Next to the template you are editing -->CSS Templates postbit.css FIND: Code:
.postbitlegacy .userinfo { float:{vb:stylevar left}; position: relative; width: {vb:math {vb:stylevar postbitlegacy_userinfo_width}-{vb:math {vb:stylevar padding}*2}}; padding: 2px {vb:stylevar padding} {vb:math {vb:stylevar padding}/2}; font-size: {vb:stylevar small_fontSize}; display:block; background: {vb:stylevar postbit_userinfo_background}; _background-image: none; _margin-top: -{vb:math {vb:math 16px*{vb:stylevar line_height}} + {vb:stylevar padding}-{vb:stylevar postbit_border.borderWidth}}; clear:both; } Code:
/*Custom Postbit Background - Image*/ .postbitlegacy .userinfo2 { float:{vb:stylevar left}; position: relative; width:{vb:math {vb:stylevar postbitlegacy_userinfo_width}-{vb:math {vb:stylevar padding}*2}}; padding: 2px {vb:stylevar padding} {vb:math {vb:stylevar padding}/2}; font-size: {vb:stylevar small_fontSize}; display:block; background: #xxxxxx /*url(url to image here) no-repeat*/; _margin-top: -{vb:math {vb:math 16px*{vb:stylevar line_height}} + {vb:stylevar padding}-{vb:stylevar postbit_border.borderWidth}}; clear:both; } FIND: Code:
.postbitlegacy .userinfo .postuseravatar img, .eventbit userinfo .eventuseravatar img { border: {vb:stylevar postbitlegacy_avatar_border}; outline: {vb:stylevar postbitlegacy_avatar_outline}; max-width: {vb:math {vb:stylevar postbitlegacy_userinfo_width} - {vb:math {vb:stylevar padding}*2}- {vb:math {vb:stylevar postbitlegacy_avatar_outline.borderWidth}*2} - {vb:math {vb:stylevar postbitlegacy_avatar_border.borderWidth}*2}}; } Code:
/*Custom Postbit Background - Avatar Border*/ .postbitlegacy .userinfo2 .postuseravatar img, .eventbit userinfo .eventuseravatar img { border: {vb:stylevar postbitlegacy_avatar_border}; outline: {vb:stylevar postbitlegacy_avatar_outline}; max-width: {vb:math {vb:stylevar postbitlegacy_userinfo_width} - {vb:math {vb:stylevar padding}*2}- {vb:math {vb:stylevar postbitlegacy_avatar_outline.borderWidth}*2} - {vb:math {vb:stylevar postbitlegacy_avatar_border.borderWidth}*2}}; } Code:
.postbitlegacy .userinfo a.username, .eventbit .userinfo a.username { clear:right; font-size:21px; font-weight:none; width: auto; max-width:{vb:math {vb:stylevar postbitlegacy_userinfo_width} - {vb:math {vb:stylevar padding}*2} - 20px}; word-wrap:break-word; } Code:
/*Custom Postbit Background - Username Style*/ .postbitlegacy .userinfo2 a.username, .eventbit .userinfo a.username { clear:right; font-size:21px; font-weight:none; width: auto; max-width:{vb:math {vb:stylevar postbitlegacy_userinfo_width} - {vb:math {vb:stylevar padding}*2} - 20px}; word-wrap:break-word; } Code:
.postbitlegacy .userinfo .postuseravatar, .eventbit .userinfo .eventuseravatar { display:block; margin:{vb:math {vb:stylevar padding}/3} auto 0; text-align:center; width: auto; } Code:
/*Custom Postbit Background - Avatar Position*/ .postbitlegacy .userinfo2 .postuseravatar, .eventbit .userinfo .eventuseravatar { display:block; margin:{vb:math {vb:stylevar padding}/3} auto 0; text-align:center; width: auto; } Code:
.postbitlegacy dl.userinfo_extra dt, .postbitlegacy dl.user_rep dt { float: {vb:stylevar left}; text-align: {vb:stylevar left}; /*color: {vb:stylevar shade_color};*/ margin-{vb:stylevar right}: {vb:stylevar padding}; margin-{vb:stylevar left}: 0; min-width:60px; width:auto !important; width:60px; } /*Custom Postbit Background - Userinfo Alignment*/ Code:
.postbitlegacy dl.userinfo_extra2 dt, .postbitlegacy dl.user_rep dt { float: {vb:stylevar left}; text-align: {vb:stylevar left}; /*color: {vb:stylevar shade_color};*/ margin-{vb:stylevar right}: {vb:stylevar padding}; margin-{vb:stylevar left}: 0; min-width:60px; width:auto !important; width:60px; } Navigate to: Style Manager --> Click on the << >> Next to the template you are editing -->Postbit Templates postbit_legacy: FIND: Code:
<div class="userinfo"> Code:
<vb:if condition="is_member_of($post, #)"><div class="userinfo2"> <vb:else /> <div class="userinfo"> </vb:if> Code:
<dl class="userinfo_extra"> Code:
<vb:if condition="is_member_of($post, #)"><dl class="userinfo_extra2"> <vb:else /> <dl class="userinfo_extra"> </vb:if> All right! You should now have a styled postbit legacy background image for a specific usergroup! I can't really provide support, I'm extremely busy with work and life, but if I pop in from time to time I'll try to help. Also, please, please, please create your own background image. I do not want my image being used. If you would like to setup the modification and use my image to get it up and running, that's fine. But I am asking that you create your own after it's installed properly. Good luck guys! Screenshots
Supporters / CoAuthors Show Your Support
|
Comments |
#12
|
||||
|
||||
It is possible, I'll get it sorted out once I update this mod to work with vb4 PL2, because right now I guarantee that everything will work from beta 4 to the new version.
|
#13
|
||||
|
||||
|
#14
|
|||
|
|||
Definitely looking forward to this, excellent mod... I was thinking about paying someone to make it a few years back for a site idea I had... but this is just wonderful! Kudos!
|
#15
|
||||
|
||||
Very nice and useful indeed...
Thanks. tagged |
#16
|
|||
|
|||
|
#17
|
|||
|
|||
What should the dimensions of the images be in pixels? and If they are smaller than the actual "rectangle" where all the information is under the avatar etc.. is the image placed on the bottom or to the top or to the left or right? Like how is it shifted/placed?
Thanks. |
#18
|
|||
|
|||
I think there's something wrong...
Your modification says to find the following: Code:
.postbitlegacy .userinfo { float:{vb:stylevar left}; position: relative; width:{vb:math {vb:stylevar postbitlegacy_userinfo_width}-{vb:math {vb:stylevar padding}*2}}; padding: 2px {vb:stylevar padding} {vb:math {vb:stylevar padding}/2}; font-size: {vb:stylevar small_fontSize}; display:block; } Code:
.postbitlegacy .userinfo { float:{vb:stylevar left}; position: relative; width:{vb:math {vb:stylevar postbitlegacy_userinfo_width}-{vb:math {vb:stylevar padding}*2}}; padding: 2px {vb:stylevar padding} {vb:math {vb:stylevar padding}/2}; font-size: {vb:stylevar small_fontSize}; display:block; background: {vb:stylevar postbit_userinfo_background}; _background-image: none; _margin-top: -{vb:math {vb:math 16px*{vb:stylevar line_height}} + {vb:stylevar padding}-{vb:stylevar postbit_border.borderWidth}}; clear:both; } |
#19
|
||||
|
||||
I haven't updated this to the newest VB release. This was written on beta 4, so the instructions are only for beta 4.
|
#20
|
||||
|
||||
|
#21
|
||||
|
||||
Updated for 4.0.1
|
|
|
X vBulletin 3.8.12 by vBS Debug Information | |
---|---|
|
|
More Information | |
Template Usage:
Phrase Groups Available:
|
Included Files:
Hooks Called:
|