Anybody who know how to do this? Help is highly appreciated.
hi @fumow,
here is a way to color any group activity on the site activity.
Group A is red, Group B is green.
The function use the group ID and add a class to the existing. You can modify it in your child theme style.css file
Function can be installed in functions.php or bp-custom.php
function fumow_li_class_group_id( $class = '' ) {
global $activities_template;
// the group id in case of an activity in group component is the field item_id
if ( buddypress()->groups->id == $activities_template->activity->component ) {
$class .= ' rj-' . $activities_template->activity->item_id;
}
return $class;
}
add_filter( 'bp_get_activity_css_class', 'fumow_li_class_group_id', 10, 1 );
You have to create a css class for each group. The example use group ID 13 and 9
li.groups.activity-item.rj-13 {
background-color: #FFD5F4;
}
li.groups.activity-item.rj-9 {
background-color: #be4;
}
References:
Activity Loop
bp-activity-templatetags.php
May this help !
Hi @danbp,
Thank you so much. It’s working perfectly!
I would like to have those changes only in the main activity stream.
Is there a way to disable the class in the activity stream of groups?
Or would you recommend to use #activity-stream in the css?
Thanks a lot,
Johannes
You cannot use css to allow colors on swa activities and not on groups activities, as both use the same activity ID.
If you use the function, you can use bp_is_group() to add a conditionnal to the return. Like this
if ( !bp_is_group()) {
return $class;
}
The ! means if not a group activity page do nothing, else (swa activity in your case), return.
Why remove the class, not a lot of point really to have it on one screen and not another.
The approach you should take is using descendent selectors to target your rulesets specifically. We have in the past gone through the bp body classes with a fairly fine tooth comb to ensure that no screens lack some form of unique class, so in CSS you will always have some class token that clearly identifies the screen you’re on.
The main activity stream is a directory, as is Members each has a further class, ‘activity’ & ‘members’, respectively.
You might therefore describe a targeted ruleset for main activity stream as:
.directory.activity li.groups.activity-item.rj-9 {}
<i>be careful in over weighting rulesets, concatenating three selectors on the li element is likely not necessary, always start as light as possible with just the new group id, adding in the others if it proves a case that your properties are getting overwritten by ones more specific.</i>
Likewise if you wanted to actually target groups activity or user account screens you will find classes for those as well; groups: ‘single-item’, ‘group-home’; User accounts: ‘bp-user’, ‘activity’, ‘my-activity’
Keep an eye on the body element class attr to see what appears from screen to screen.
I appreciate your help, thanks to both of you.
I will use the version @hnla suggested. It seems better to keep the classes and just add some css specific for the main activity stream.
Thank you!
That’s your choice 😉 No worry, you’re welcome !
