Skip to:

change CSS according hashtags in activity content

  • aomao


    Hi All,
    need your help.
    I want to change CSS style of activity content, according hashtags in content

    e.g. “#red I am watching TV” will show with red background
    “#blue I am watching TV” will show with blue background

    As far as I know Buddypress has its own filter function apply_filters
    and variable $activities_template

    But I couldn’t figure out how to use them

Viewing 5 replies - 1 through 5 (of 5 total)

  • Boone Gorges


    Cool idea. This can be done using the bp_get_activity_css_class filter hook. For instance,
    function boone_add_activity_class( $class ) {
    global $activities_template;

    if ( strpos( $activities_template->activity->content, ‘#red’ ) !== false )
    $class .= ‘ red’;

    return $class;
    add_filter( ‘bp_get_activity_css_class’, ‘boone_add_activity_class’ );`

    If you add that to your bp-custom.php, it will add the ‘red’ css class to every activity item whose content contains the #red hashtag. You can add more hashtags as needed according to the same pattern.

    Then just define your CSS rules, eg
    `ul.activity-list .red { background: #f00 }`



    Oh, thanks for reply
    I will try your hint



    I need your help again.
    For my design I needed to use div instead of list(ul) for displaying activities.
    instead of this
    ` ul.activity-list .red { background: #f00 }`
    I have
    ` div.activity-list .red { background: #f00 } `

    But filter not working now. I couldn’t fix it by myself

    Boone Gorges


    It’s hard for me to guess without seeing the markup. Keep in mind that the css that you’ve posted is looking for a *child* of div.activity-list with the class name “red”. Make sure that the activity item markup still has its CSS class rendered by the following code (in entry.php of your child theme):
    or else the filter won’t do anything.

    As an aside, I’m not sure what you can do with divs that you can’t do with ul/lis. With a software like BP, in my view it’s better to make changes with CSS if possible, so that your child theme doesn’t override too much of the default theme (thereby making upgrades easier for you).



    Thank you very much

    I checked my code again and found that I accidentally deleted
    this one `class=””`
    while changing from ul -> div
    now its working fine

Viewing 5 replies - 1 through 5 (of 5 total)
  • The topic ‘change CSS according hashtags in activity content’ is closed to new replies.
Skip to toolbar