XF 1.5 How to change the background color of every post from a certain usergroup?

clove28

Active member
Hi there!

I would like to ask how to highlight or put a background color on every post of certain usergroup? I want to highlight the posts of the VIP usergroup in my forum. How can I do this in Extra CSS? I hope someone could help me with this. Thanks!
 
Put the following in your extra.css:
Code:
.staff .messageContent {
    background-color: @primaryLighterStill;
}
You obviously can change the "background-color:", and the user group it affects (.staff).

To learn more, please go to this page.
 
Put the following in your extra.css:
Code:
.staff .messageContent {
    background-color: @primaryLighterStill;
}
You obviously can change the "background-color:", and the user group it affects (.staff).

To learn more, please go to this page.

I have read the instruction. But I think it is only applicable for the basic groups. How about the newly created group like premium members? How can I add that class?
 
I have read the instruction. But I think it is only applicable for the basic groups. How about the newly created group like premium members? How can I add that class?
I believe you could do:
Code:
.vip .messageContent {
    background-color: @primaryLighterStill;
}

Or maybe you could try it in the custom user styling properties when managing the usergroup?
 
I couldn't understand much from the conditionals.. hehe! Could you help me through adding a class Steve? :)
Sure

In the template 'message' find near the top:
Code:
<li id="{$messageId}" class="message

Directly after (with a space before and after) add:
Rich (BB code):
{xen:if {xen:helper ismemberof, $message, 5}, 'testClass'}

That line should look like this (assuming the template is default here):
Code:
<li id="{$messageId}" class="message {xen:if {xen:helper ismemberof, $message, 5}, 'testClass'} {xen:if $message.isDeleted, 'deleted'} {xen:if '{$message.is_staff}', 'staff'} {xen:if $message.isIgnored, ignored}" data-author="{$message.username}">


Change the red bits to what you need. You can add more groups for that class by separating the group numbers by a comma (5, 6, 7, 8).

Then in EXTRA.css you can target those messages with the "testClass" by doing:
Code:
.testClass
{
        background: red;
}

Depending on your style it may look a bit bad or weird so you may need extra styling.
 
Steve, is it possible to use your method on something like the message user info in posts,threads.


basically having a circular colour around the avatars of the user groups?
 

Attachments

  • wp_ss_20160622_0001.webp
    wp_ss_20160622_0001.webp
    69.1 KB · Views: 30
Top Bottom