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

[clove28]

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!

 

[countryside]

Put the following in your extra.css:

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

 

[clove28]

Put the following in your extra.css:

.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?

 

[countryside]

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:

.vip .messageContent {
    background-color: @primaryLighterStill;
}

Or maybe you could try it in the custom user styling properties when managing the usergroup?

 

[Steve F]

You need to use a conditional to add a new class to the message element for styling purposes. I can't help much at the moment because I'm on my iPad but this resource should help get you going.

https://xenforo.com/community/resources/conditional-statements.1604/

 

[clove28]

You need to use a conditional to add a new class to the message element for styling purposes. I can't help much at the moment because I'm on my iPad but this resource should help get you going.

https://xenforo.com/community/resources/conditional-statements.1604/

I couldn't understand much from the conditionals.. hehe! Could you help me through adding a class Steve?

 

[Steve F]

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:

<li id="{$messageId}" class="message

Directly after (with a space before and after) add:

{xen:if {xen:helper ismemberof, $message, 5}, 'testClass'}

That line should look like this (assuming the template is default here):

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

.testClass
{
        background: red;
}

Depending on your style it may look a bit bad or weird so you may need extra styling.

 

[Brad P]

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?

 

[Steve F]

Yes, you would need to add it in the message_user_info template inside avatarHolder element. Also would need to switch $message with $user.

 

[Brad P]

Something i am doing is wrong


Then i added this in extra css
.adminClass
{
background: red;
}