vb.org Archive

vb.org Archive (https://vborg.vbsupport.ru/index.php)
-   vBulletin 4.x Template Modifications (https://vborg.vbsupport.ru/forumdisplay.php?f=246)
-   -   Show Thread Enhancements - Postbit Legacy - Usergroup Backgrounds vb4 (https://vborg.vbsupport.ru/showthread.php?t=229487)

Fastbird 12-03-2009 10:00 PM

Postbit Legacy - Usergroup Backgrounds vb4
 
1 Attachment(s)
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;
}

ADD UNDER:
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;
}

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

ADD UNDER:
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}};
}

FIND:
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;
}

ADD UNDER:
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;
}

FIND:
Code:

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

ADD UNDER:
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;
}

FIND:
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;
}

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

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:
Code:

<div class="userinfo">
REPLACE:
Code:

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

FIND:
Code:

<dl class="userinfo_extra">
REPLACE:
Code:

<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 12-04-2009 01:50 PM

thanks man

abouahmed 12-04-2009 03:04 PM

nice mod

Fastbird 12-04-2009 05:10 PM

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

gedr80 12-04-2009 08:03 PM

Thank you very much

Dr.osamA 12-05-2009 09:42 PM

thnxxxx

installed
________
Extreme Vaporizer Q

Cableguy69 12-21-2009 12:33 PM

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 12-21-2009 12:46 PM

It's ok I've worked it out.

Installed

I replaced this

Code:

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

Code:

/*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 12-22-2009 09:18 AM

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 12-22-2009 10:13 AM

It is possible to reduce the message area?


All times are GMT. The time now is 08:30 AM.

Powered by vBulletin® Version 3.8.12 by vBS
Copyright ©2000 - 2025, vBulletin Solutions Inc.

X vBulletin 3.8.12 by vBS Debug Information
  • Page Generation 0.03044 seconds
  • Memory Usage 1,758KB
  • Queries Executed 10 (?)
More Information
Template Usage:
  • (1)ad_footer_end
  • (1)ad_footer_start
  • (1)ad_header_end
  • (1)ad_header_logo
  • (1)ad_navbar_below
  • (16)bbcode_code_printable
  • (1)footer
  • (1)gobutton
  • (1)header
  • (1)headinclude
  • (6)option
  • (1)pagenav
  • (1)pagenav_curpage
  • (2)pagenav_pagelink
  • (1)post_thanks_navbar_search
  • (1)printthread
  • (10)printthreadbit
  • (1)spacer_close
  • (1)spacer_open 

Phrase Groups Available:
  • global
  • postbit
  • showthread
Included Files:
  • ./printthread.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/class_bbcode_alt.php
  • ./includes/class_bbcode.php
  • ./includes/functions_bigthree.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
  • printthread_start
  • pagenav_page
  • pagenav_complete
  • bbcode_fetch_tags
  • bbcode_create
  • bbcode_parse_start
  • bbcode_parse_complete_precache
  • bbcode_parse_complete
  • printthread_post
  • printthread_complete