MyBB Community Forums

Full Version: Color All Post Backgrounds of a Usergroup
You're currently viewing a stripped down version of our content. View the full version with proper formatting.
Pages: 1 2 3 4
Yes you can add it just like you would the background but with color, after following the tutorial of course.

Example using the code of the first post:

.post6 { color: #FDB5FF; }
Mmm I can seam to get this to work Huh

does this look right

<div class="post classic post{$usergroup['gid']} {$unapproved_shade}" style="{$post_visibility}" id="post_{$post['pid']}">
It may be another style overwriting it due to the order. Try moving your .post styles to the bottom of your stylesheet.
(2016-04-26, 05:12 PM)JordanMussi Wrote: [ -> ]It may be another style overwriting it due to the order. Try moving your .post styles to the bottom of your stylesheet.

hmm where can I find .post styles ?

oh I am using the Duende V2 Theme
Can someone make this into a plugin
Does this not work for 1.8.8? I've looked at 3 different themes and they all are missing <td blablabla> they only have <div bla babla>
(2016-11-29, 05:15 PM)Zaqre Wrote: [ -> ]Does this not work for 1.8.8? I've looked at 3 different themes and they all are missing <td blablabla> they only have <div bla babla>


Try this:

Add to your global.css
/** Staff Post Post BG Colors Post **/

.staff_post3 { 
  background: #E6E8FA !important; 
}
.staff_post4 { 
  background: #E6E8FA !important; 
}
.staff_post6 { 
  background: #E6E8FA !important; 
}

/** Staff Post BG Colors Head and Foot **/

.staff_post_bg3 { 
  background:  #F9E5F9 !important; 
}
.staff_post_bg4 { 
  background:  #DEEFB7 !important; 
}
.staff_post_bg6 { 
  background-color: #DEEF75 !important; 
}

Replace postbit with:

{$ignore_bit}
<a name="pid{$post['pid']}" id="pid{$post['pid']}"></a>
<div class="post staff_post{$usergroup['gid']} {$unapproved_shade}" style="{$post_visibility}" id="staff_post_{$post['pid']}">
 <div class="post_author staff_post_bg{$usergroup['gid']}">
    {$post['useravatar']}
    <div class="author_information">
            <strong><span class="largetext">{$post['profilelink']}</span></strong> {$post['onlinestatus']}<br />
            <span class="smalltext">
                {$post['usertitle']}<br />
                {$post['userstars']}
                {$post['groupimage']}
            </span>
    </div>
    <div class="author_statistics">
        {$post['user_details']}
    </div>
</div>
<div class="post_content">
    <div class="post_head">
        {$post['posturl']}
        {$post['icon']}
        <span class="post_date">{$post['postdate']} <span class="post_edit" id="edited_by_{$post['pid']}">{$post['editedmsg']}</span></span>
        {$post['subject_extra']}
    </div>
    <div class="post_body scaleimages" id="pid_{$post['pid']}">
        {$post['message']}
    </div>
    {$post['attachments']}
    {$post['signature']}
    <div class="post_meta" id="post_meta_{$post['pid']}">
        {$post['quick_quote']}{$post['iplogged']}
    </div>
</div>
<div class="post_controls staff_post_bg{$usergroup['gid']}">
    <div class="postbit_buttons author_buttons float_left">
        {$post['button_email']}{$post['button_pm']}{$post['button_www']}{$post['button_find']}{$post['button_rep']}
    </div>
    <div class="postbit_buttons post_management_buttons float_right">
        {$post['button_edit']}{$post['button_quickdelete']}{$post['button_quickrestore']}{$post['button_quote']}{$post['button_multiquote']}{$post['button_report']}{$post['button_warn']}{$post['button_purgespammer']}{$post['button_reply_pm']}{$post['button_replyall_pm']}{$post['button_forward_pm']}{$post['button_delete_pm']}
    </div>
</div>
</div>


Replace postbit_classic with:

{$ignore_bit}
<a name="pid{$post['pid']}" id="pid{$post['pid']}"></a>
<div class="post classic  staff_post{$usergroup['gid']} {$unapproved_shade}" style="{$post_visibility}" id="staff_post_{$post['pid']}">
 <div class="post_author scaleimages staff_post_bg{$usergroup['gid']}">
    {$post['useravatar']}
    <div class="author_information">
            <strong><span class="largetext">{$post['profilelink']}</span></strong> {$post['onlinestatus']}<br />
            <span class="smalltext">
                {$post['usertitle']}<br />
                {$post['userstars']}
                {$post['groupimage']}
            </span>
    </div>
    <div class="author_statistics">
        {$post['user_details']}{$post['usercountry']}<br />{$post['usermood']}
    </div>
</div>
<div class="post_content">
    <div class="post_head">
        {$post['posturl']}
        {$post['icon']}
        <span class="post_date">{$post['postdate']} <span class="post_edit" id="edited_by_{$post['pid']}">{$post['editedmsg']}</span></span>
    {$post['subject_extra']}
    </div>
    <div class="post_body post{$usergroup['gid']} scaleimages" id="pid_{$post['pid']}">
        {$post['message']}
    </div>
{$post['simplelikes']}
    {$post['attachments']}
    {$post['signature']}
    <div class="post_meta" id="post_meta_{$post['pid']}">
        
    </div>
</div>
<div class="post_controls staff_post_bg{$usergroup['gid']}">
    <div class="postbit_buttons author_buttons float_left">
            {$post['quick_quote']}
        {$post['quick_quote']}
        {$post['quick_quote']}
    {$post['iplogged']}{$post['button_email']}{$post['button_pm']}{$post['button_www']}{$post['button_find']}{$post['button_rep']}
    </div>
    <div class="postbit_buttons post_management_buttons float_right">
        {$post['button_edit']}{$post['button_quickdelete']}{$post['button_quickrestore']}{$post['button_quote']}{$post['button_multiquote']}{$post['button_report']}{$post['button_warn']}{$post['button_purgespammer']}{$post['button_reply_pm']}{$post['button_replyall_pm']}{$post['button_forward_pm']}{$post['button_delete_pm']}{$post['button_like']}
    </div>
</div>
</div>
* This allows the option to color  2 different colors for 3 sections of the post by user group.


Classic Postbit example:

[Image: 35d6idc.png]


Postbit Example:

[Image: spuidt.jpg]



OR.........

If you want to control all three sections seperately..., we can change it up slightly to do so:

/** Staff Post BG Colors Head and Foot **/

.staff_post_head_bg3 { background:  #F9E5F9 !important; }
.staff_post_head_bg4 { background:  #DEEFB7 !important; }
.staff_post_head_bg6 { background-color: #DEEF75 !important; }

/** Staff Post Post BG Colors Post **/

.staff_post_bg3 { background: #E6E8FA !important; }
.staff_post_bg4 { background: #E6E8FA !important; }
.staff_post_bg6 { background: #E6E8FA !important; }

/** Staff Post BG Colors Head and Foot **/

.staff_post_foot_bg3 { background:  #F9E5F9 !important; }
.staff_post_foot_bg4 { background:  #DEEFB7 !important; }
.staff_post_foot_bg6 { background-color: #DEEF75 !important; }



Replace your postbit with:

{$ignore_bit}
<a name="pid{$post['pid']}" id="pid{$post['pid']}"></a>
<div class="post staff_post_bg{$usergroup['gid']} {$unapproved_shade}" style="{$post_visibility}" id="staff_post_bg{$post['pid']}">
 <div class="post_author staff_post_head_bg{$usergroup['gid']}">
    {$post['useravatar']}
    <div class="author_information">
            <strong><span class="largetext">{$post['profilelink']}</span></strong> {$post['onlinestatus']}<br />
            <span class="smalltext">
                {$post['usertitle']}<br />
                {$post['userstars']}
                {$post['groupimage']}
            </span>
    </div>
    <div class="author_statistics">
        {$post['user_details']}
    </div>
</div>
<div class="post_content">
    <div class="post_head">
        {$post['posturl']}
        {$post['icon']}
        <span class="post_date">{$post['postdate']} <span class="post_edit" id="edited_by_{$post['pid']}">{$post['editedmsg']}</span></span>
        {$post['subject_extra']}
    </div>
    <div class="post_body scaleimages" id="pid_{$post['pid']}">
        {$post['message']}
    </div>
    {$post['attachments']}
    {$post['signature']}
    <div class="post_meta" id="post_meta_{$post['pid']}">
        {$post['quick_quote']}{$post['iplogged']}
    </div>
</div>
<div class="post_controls staff_post_foot_bg{$usergroup['gid']}">
    <div class="postbit_buttons author_buttons float_left">
        {$post['button_email']}{$post['button_pm']}{$post['button_www']}{$post['button_find']}{$post['button_rep']}
    </div>
    <div class="postbit_buttons post_management_buttons float_right">
        {$post['button_edit']}{$post['button_quickdelete']}{$post['button_quickrestore']}{$post['button_quote']}{$post['button_multiquote']}{$post['button_report']}{$post['button_warn']}{$post['button_purgespammer']}{$post['button_reply_pm']}{$post['button_replyall_pm']}{$post['button_forward_pm']}{$post['button_delete_pm']}
    </div>
</div>
</div>

replace your postbit_classic with:

{$ignore_bit}
<a name="pid{$post['pid']}" id="pid{$post['pid']}"></a>
<div class="post classic  staff_post_bg{$usergroup['gid']} {$unapproved_shade}" style="{$post_visibility}" id="staff_post_bg{$post['pid']}">
 <div class="post_author scaleimages staff_post_head_bg{$usergroup['gid']}">
    {$post['useravatar']}
    <div class="author_information">
            <strong><span class="largetext">{$post['profilelink']}</span></strong> {$post['onlinestatus']}<br />
            <span class="smalltext">
                {$post['usertitle']}<br />
                {$post['userstars']}
                {$post['groupimage']}
            </span>
    </div>
    <div class="author_statistics">
        {$post['user_details']}{$post['usercountry']}<br />{$post['usermood']}
    </div>
</div>
<div class="post_content">
    <div class="post_head">
        {$post['posturl']}
        {$post['icon']}
        <span class="post_date">{$post['postdate']} <span class="post_edit" id="edited_by_{$post['pid']}">{$post['editedmsg']}</span></span>
    {$post['subject_extra']}
    </div>
    <div class="post_body post{$usergroup['gid']} scaleimages" id="pid_{$post['pid']}">
        {$post['message']}
    </div>
{$post['simplelikes']}
    {$post['attachments']}
    {$post['signature']}
    <div class="post_meta" id="post_meta_{$post['pid']}">
        
    </div>
</div>
<div class="post_controls staff_post_foot_bg{$usergroup['gid']}">
    <div class="postbit_buttons author_buttons float_left">
            {$post['quick_quote']}
        {$post['quick_quote']}
        {$post['quick_quote']}
    {$post['iplogged']}{$post['button_email']}{$post['button_pm']}{$post['button_www']}{$post['button_find']}{$post['button_rep']}
    </div>
    <div class="postbit_buttons post_management_buttons float_right">
        {$post['button_edit']}{$post['button_quickdelete']}{$post['button_quickrestore']}{$post['button_quote']}{$post['button_multiquote']}{$post['button_report']}{$post['button_warn']}{$post['button_purgespammer']}{$post['button_reply_pm']}{$post['button_replyall_pm']}{$post['button_forward_pm']}{$post['button_delete_pm']}{$post['button_like']}
    </div>
</div>
</div>
* This allows the option to color 3 different colors for 3 sections of the post by user group.
Hi vintagedaddyo. The codes you have given works perfect. But I got a little question. Is there a specified code for .post_body? I want to costumize the .post_body for only staff. I'll add;

background: black;
opacity: 0.8;
border-radius: 15px;

and I want these to be applied only for admins, in .post_body. Thank you!
(2017-02-21, 10:07 PM)timelord Wrote: [ -> ]Hi vintagedaddyo. The codes you have given works perfect. But I got a little question. Is there a specified code for .post_body? I want to costumize the .post_body for only staff. I'll add;

background: black;
opacity: 0.8;
border-radius: 15px;

and  I want these to be applied only for admins, in .post_body. Thank you!

@timelord
Sorry for the delay in response but I have been away from computers and MyBb for some time.
Do you mean post_body or rather post_content? Either way the css styling could be continued further to suit your likings by following the same type of edits provided previously. You would simply need to expand upon the existing css styling and also further edit the desired areas via posbit and posbit_classic.

* For folks that want something similar to the effect of the working examples I provided previously but would prefer a plugin you could try this: https://community.mybb.com/thread-148832...pid1298691
Is it possible to add an image-with-transparent-background like Logo with 50% opacity. to make it more cooler like garena forum.
Pages: 1 2 3 4