Postbit Legacy - Usergroup Backgrounds vb4

[Fastbird]

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.php?9995-Official-To-Do-List-for-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:

.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;
}


ADD UNDER:

/*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;
}


---> Note: The Red xxxxxx is a color number. You need to specify a background color in case you aren't using an image. Remove the /* and */ around the url code to use an image. Otherwise it will just change the color of the box. I suggest fading the image to the color of the background you choose, as shown in the picture example.

FIND:

.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}};
}



ADD UNDER:

/*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}};
}


FIND:

.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;
}


ADD UNDER:

/*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;
}


FIND:

.postbitlegacy .userinfo .postuseravatar, .eventbit .userinfo .eventuseravatar {
display:block;
margin:{vb:math {vb:stylevar padding}/3} auto 0;
text-align:center;
width: auto;
}

ADD UNDER:

/*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;
}


FIND:

.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;
}

ADD UNDER:
/*Custom Postbit Background - Userinfo Alignment*/

.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;
}

That does it for the CSS file. Now we need to do one last thing, and that's edit the posbit_legacy template.

Navigate to:

Style Manager --> Click on the << >> Next to the template you are editing -->Postbit Templates

postbit_legacy:

FIND:
<div class="userinfo">


REPLACE:

<vb:if condition="is_member_of($post, #)"><div class="userinfo2">
<vb:else />
<div class="userinfo">
</vb:if>


FIND:
<dl class="userinfo_extra">
REPLACE:
<vb:if condition="is_member_of($post, #)"><dl class="userinfo_extra2">
<vb:else />
<dl class="userinfo_extra">
</vb:if>

The RED # is the ID of the usergroup that you want to have a unique background. In my example picture, the administrators have the custom image, so the # sign is replaced in the code with a 6, because the ID for the administrator usergroup is 6. To find the ID, go to usergroup options in the AdminCP and look at the chart. The group ID should be on the same line as the usergroup name.

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!

[SİMAR]

thanks man

[abouahmed]

nice mod

[Fastbird]

No problem guys! Glad it worked for you and you liked it!

[gedr80]

Thank you very much

[Dr.osamA]

thnxxxx

installed
________
Extreme Vaporizer Q (http://vaporizer.org)

[Cableguy69]

This hasn't worked right for me, Admin avatars were 150x150px, they've now been resized and lost there transparency, other than that it has worked, but what piece of code handles the avatar width?

I think transparency has been lost due to the image being resized.

Edit: I've found the resize code, I've changed this.

[Cableguy69]

It's ok I've worked it out.

Installed

I replaced this

/*Custom Postbit Background - Avatar Border*/
.postbitlegacy .userinfo2 .postuseravatar img, .eventbit userinfo .eventuseravatar img {
background: #ffffff;
border: 1px dotted #d8d8d8;
padding: 3px;
max-width: 80px;
max-height: 80px;
}


With

/*Custom Postbit Background - Avatar Border*/
.postbitlegacy .userinfo2 .postuseravatar img, .eventbit userinfo .eventuseravatar img {
background: #ffffff00;
border: 0px solid #ffffff00;
padding: 3px;
max-width: auto;
max-height: auto;
}

[Cableguy69]

Is it possible to put a background into more than 1 usergroup?

So I could have a different background for Mods and Vip's.

[I.am]

It is possible to reduce the message area?

[Fastbird]

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.

[Dr.osamA]

not work with 4 Gold

plzz updaet it

thanx
________
SHEMALE FETISH (http://www.++++tube.com/categories/961/fetish/videos/1)

[Draygonia]

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!

[Merjawy]

Very nice and useful indeed...

Thanks. tagged

[Cableguy69]

not work with 4 Gold

plzz updaet it

thanx

Working for me.

http://www.hostmypics.org/pictures/d7774b5e87d93e2eb4d64cb3c7acb502.png

[Bouncer222]

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.

[Skyrider]

I think there's something wrong...

Your modification says to find the following:

.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;
}

How ever, I found this:
.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;
}

As you can see, the original is much longer so I think the installation instructions has to be adjusted.

[Fastbird]

I haven't updated this to the newest VB release. This was written on beta 4, so the instructions are only for beta 4.

[Dr.osamA]

Waiting
________
XXX FREE STREAMING (http://www.++++tube.com/)

[Fastbird]

Updated for 4.0.1

[TimberFloorAu]

Still have this tagged Fastbird, get it going for 4.0.2 please :up:

[TimberFloorAu]

Ignore me I am a knob, will install :up:

Add:

Where does it pull the image from? Looking over code changes, I cant see where the image is extracted from. Is it profile pic?

[Fastbird]

Ignore me I am a knob, will install :up:

Add:

Where does it pull the image from? Looking over code changes, I cant see where the image is extracted from. Is it profile pic?

If you want an image, you need to supply one and place it in the CSS. It's commented out. Check the first section of code to add/replace for it.

[TimberFloorAu]

If you want an image, you need to supply one and place it in the CSS. It's commented out. Check the first section of code to add/replace for it.

Yeah got that but tried everything and to no avail. Great hack, but couldnt get it working for us.

Thanks anyhoo :)

your code:
background: #xxxxxx /*url(url to image here) no-repeat*/;


our code change:

background: #ff9900 images/bg.jpg no-repeat;


Didnt produce anything.
Even tried absolute URL

[Fastbird]

Yeah got that but tried everything and to no avail. Great hack, but couldnt get it working for us.

Thanks anyhoo :)

your code:
background: #xxxxxx /*url(url to image here) no-repeat*/;


our code change:

background: #ff9900 images/bg.jpg no-repeat;


Didnt produce anything.
Even tried absolute URL

That's because you removed too much of the code from the CSS. You need to use this line:

background: #ff9900 url(images/bg.jpg) no-repeat;

[Bouncer222]

I see on your site you used different images for different usergroups, how do I do the same??

[Fastbird]

One usergroup is like this:

<vb:if condition="is_member_of($post, #)"><dl class="userinfo_extra2">
<vb:else />
<dl class="userinfo_extra">
</vb:if>

Two usergroups is like this:
<vb:if condition="is_member_of($post, #)"><dl class="userinfo_extra2">
<vb:else />
<vb:if condition="is_member_of($post, #)"><dl class="userinfo_extra3">
<vb:else />
<dl class="userinfo_extra">
</vb:if>
</vb:if>

You keep adding the statement over and over and then add a vb:if at the end for each additional phrase you add. Then, you must duplicate the css each time for each usergroup. So, in the example for installation, I use userinfo2 for the duplicate css codes. Each additional usergroup will have an incremental increase, so the css for the 2nd usergroup would be userinfo3, the 3rd user group would use userinfo4, and so on. Just keep duplicating each of the steps above for each usergroup.

[Bouncer222]

It's not possible to make it simpler? Because duplicating css I think shouldnt be necessary if you can somehow do that.

[Fastbird]

It's not possible to make it simpler? Because duplicating css I think shouldnt be necessary if you can somehow do that.

If there's a simpler way, I don't know it. The way I explained it is known to work, so if there is a better way, then by all means go for it. I just don't know what that way is, sorry :(

[patrick91]

Thnx i will install this soon! but how do you get your postbit look like that???

[DeadRabbit]

can i add two or more usergroup ids?

[DeadRabbit]

One usergroup is like this:

<vb:if condition="is_member_of($post, #)"><dl class="userinfo_extra2">
<vb:else />
<dl class="userinfo_extra">
</vb:if>

Two usergroups is like this:
<vb:if condition="is_member_of($post, #)"><dl class="userinfo_extra2">
<vb:else />
<vb:if condition="is_member_of($post, #)"><dl class="userinfo_extra3">
<vb:else />
<dl class="userinfo_extra">
</vb:if>
</vb:if>

You keep adding the statement over and over and then add a vb:if at the end for each additional phrase you add. Then, you must duplicate the css each time for each usergroup. So, in the example for installation, I use userinfo2 for the duplicate css codes. Each additional usergroup will have an incremental increase, so the css for the 2nd usergroup would be userinfo3, the 3rd user group would use userinfo4, and so on. Just keep duplicating each of the steps above for each usergroup.

thanks, i havent read this one. lol :D

[merk_aus]

Is it possible to have this linked to custom user fields instead of usergroups?

eg: I want people to select their favorite sporting team and have a background of that sporting team display.

[midnz]

It's not possible to make it simpler? Because duplicating css I think shouldnt be necessary if you can somehow do that.

If there's a simpler way, I don't know it. The way I explained it is known to work, so if there is a better way, then by all means go for it. I just don't know what that way is, sorry :(

There is an easier way using vB 4.0.5 for adding a single image to the postbit background. I don't know if it works on postbit_legacy because I haven't tried it. I'm wanting different backgrounds per usergroup which I'm struggling to achieve despite the instructions posted on this thread :confused:

http://img340.imageshack.us/img340/9725/postbitbackground.jpg

[midnz]

Uninstalled until clearer instructions are provided for separate bg postbit images for multiple usergroups or my knowledge increases to where my forum isn't being screwed up with each attempt.
Moving on....

[Bouncer222]

is this still working for 4.0.7??

[zonaenlinea]

for 4.0.7

[Prohibit]

for 4.0.7

???????????????

:confused:

[Prohibit]

Well, the background is working.

But it has thrown my post bit kind of out of whack.


Okay, got it going. Thank you for the mod! :)

[murekhalir]

sweeet gotta try this now.

[Kyojii]

the .css added messes with the center postbit addon and doesn't seem to work. Any ideas?

I added this, but it still doesn't center my Administrator title. The join date or posts.

.postbitlegacy .userinfo2 .postuseravatar, .eventbit .userinfo2 .eventuseravatar {
float:none !important;
text-align:center !important;

}
.postbitlegacy .userinfo2 .username_container, .postbit_reputation, .postbitlegacy .userinfo2 .rank, .postbitlegacy .userinfo2 .usertitle {
text-align:center !important;
}

[Fastbird]

the .css added messes with the center postbit addon and doesn't seem to work. Any ideas?

I added this, but it still doesn't center my Administrator title. The join date or posts.

.postbitlegacy .userinfo2 .postuseravatar, .eventbit .userinfo2 .eventuseravatar {
float:none !important;
text-align:center !important;

}
.postbitlegacy .userinfo2 .username_container, .postbit_reputation, .postbitlegacy .userinfo2 .rank, .postbitlegacy .userinfo2 .usertitle {
text-align:center !important;
}


I actually updated this to 4.1 a few weeks ago for our forum. I will update this hack over the weekend for you guys.

If you want to center your username and title, you need to do that in the actual postbit_legacy template.

[smirkley]

This is a nice add-on,...

It would absalutely ROCK if it could be enhanced by having a edit feature for each persons usercp so they could select their own background color/image independantly. With usergroup permission settings of course.

[Fastbird]

This is a nice add-on,...

It would absalutely ROCK if it could be enhanced by having a edit feature for each persons usercp so they could select their own background color/image independantly. With usergroup permission settings of course.

That would be quite the undertaking, but yeah would be very cool.

[Mobo]

I'm trying to automate the selection of the background images based on two profile fields the users selects. I was able to do this in the 3.8 version with this code:

<if condition="$post[field#] == 'Option'">
<elseif condition="$post[field#] == 'Option'">
<td class="postbitbg7" width="175" style="border: $stylevar[cellspacing]px solid $stylevar [tborder_bgcolor]; border-top: 0px; border-bottom: 0px id="td_post_$post[postid]">
<else />


Changing the red # to the field number you want to use as well as the red Option, which is the text for that field.

I would like to be able to do this same thing on vB4 now. However, the vastly increased amount of code has put this beyond me. I would not need the size/border coding as above, I've got it working and looking good with the current code (based on usergroups, not fields like I would like)

Can anyone help with this?

Thanks in advance,

Keith

[Alien123]

I actually updated this to 4.1 a few weeks ago for our forum. I will update this hack over the weekend for you guys.

If you want to center your username and title, you need to do that in the actual postbit_legacy template.

it says adding child to non-existent node! im on vb 4.1.2

[discodoran]

my image just cuts out when it reaches the end of the users info so straight after POSTS the image stops and does not use up all of the postbit legacy

im on vbulletin 4.1.3 could someone please help me with the problem cheers

I can provide pictures if needed

[discodoran]

sorry guys here is an image of mine and im stuck where the red box is thats where it cuts off i would like the colour to go all the way to the bottom of the postbit

please help any help is much appreciated thanks in advance

[TheTrust]

Thank you ... can you update it for 4.1.3

[discodoran]

yer please update for 4.1.3
Thank you

[Fastbird]

I looked through, there is really nothing to edit guys. I just updated my forum and did not have to update anything to this mod to get it functioning.

What issues are you having?

[Chase]

Thnx i will install this soon! but how do you get your postbit look like that???

I would really like to know how you did this as well. Can you share? :D

[ranafarooq]

can i have its more snaps please as when i click at demo link the msg comes that admin has banned your ip although I had never visited that forum its strange

[lavagod]

Is there anyone willing to help me do this on my site?? I would to have some one who has done this and it has worked on VB 4.1

[discodoran]

I looked through, there is really nothing to edit guys. I just updated my forum and did not have to update anything to this mod to get it functioning.

What issues are you having?


please check out my post I really dont know what the problem is cheers mate
https://vborg.vbsupport.ru/showpost.php?p=2186505&postcount=48

[River J]

Doesn't work on vB4.1.5

[WDS]

for this to work with Horizontal profile that I modify?
I have the Version 4.1.5

[PBRiot]

This looks really cool, but I was wondering if it was possible to get it as an installable mod and not a hard coded mod?

[WDS]

Hello, I wonder how I can put back the Horizontal postbit
http://www.webpagescreenshot.info/i/84970-19201264631pm.png

[d19rnyxx]

Brilliant mod but can't get it to work because of the custom theme.

[HHelp1]

Brilliant mod but can't get it to work because of the custom theme.

yES and i think it no longer work for 4.1.8 or greater

[RobbieZ]

yES and i think it no longer work for 4.1.8 or greater

Still working on 4.1.11 !

[HHelp1]

Only for default ? Or any style ?

[wishtheend]

Installed fine, but does anyone know if the userinfo2 can be extended so it runs the length of the actual post? Mine also cuts off after the user info, but I'd like it to run the length of the post as indicated by this arrow

Example Pic (http://img26.imageshack.us/img26/4152/userinfo2.jpg)

[Nocturnal222]

thanks working at vb4 latest version:)

[Pure Dope]

this is wonderful! but 2 many template mods.

[Pure Dope]

if you can get the template mods down to 0 and make the background for the entire post for the usergroup, that would be awesome!

[Subieforums]

This mod looks pretty badarse...

Is there a certain size the background images have to be for this? Just asking before I start adding this code, as I want to make custom graphics for each of the usergroups. Thanks!

[Luis]

One usergroup is like this:

<vb:if condition="is_member_of($post, #)"><dl class="userinfo_extra2">
<vb:else />
<dl class="userinfo_extra">
</vb:if>

Two usergroups is like this:
<vb:if condition="is_member_of($post, #)"><dl class="userinfo_extra2">
<vb:else />
<vb:if condition="is_member_of($post, #)"><dl class="userinfo_extra3">
<vb:else />
<dl class="userinfo_extra">
</vb:if>
</vb:if>

You keep adding the statement over and over and then add a vb:if at the end for each additional phrase you add. Then, you must duplicate the css each time for each usergroup. So, in the example for installation, I use userinfo2 for the duplicate css codes. Each additional usergroup will have an incremental increase, so the css for the 2nd usergroup would be userinfo3, the 3rd user group would use userinfo4, and so on. Just keep duplicating each of the steps above for each usergroup.

done xD!

[FTG LIQUID CL]

Does not seem to work with 4.1.12

[Bluefin221]

Would love to be able to do something like this on the postbit with badges or something.

[neya]

Tagged for later installation, thanks a bunch. :)

[GameOverViper]

Would be awesome if I knew how to get this to work with 4.2.0. I've got some idea's for a forum of mine that this would work great for. I have attempted to get working, but all it did was remove the box keeping the info organized and pushed it up to the username.

I used the image on the OP's site to test it and it doesn't even show up.

[SnaKe |WiH|]

I like the hanging banners on your demo link! Is that something different than this template mod?

[GameOverViper]

I like the hanging banners on your demo link! Is that something different than this template mod?

The hanging banners are the backgounds that this mod is suppose to do, but it doesn't work on 4.2.0.

[Spangle]

The hanging banners are the backgounds that this mod is suppose to do, but it doesn't work on 4.2.0.

I don't think it is, I think it's a way of putting a background image in the post bit, if was the hanging banners ( which I like) I think it would be called "Hanging Banners MOD"