Skip to:
Content
Pages
Categories
Search
Top
Bottom

change CSS according hashtags in activity content

  • Avatar of Aomao
    aomao
    Participant

    @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)
  • Avatar of Boone Gorges
    Boone Gorges
    Keymaster

    @boonebgorges

    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 }`

    Avatar of Aomao
    aomao
    Participant

    @aomao

    Oh, thanks for reply
    I will try your hint

    Avatar of Aomao
    aomao
    Participant

    @aomao

    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

    Avatar of Boone Gorges
    Boone Gorges
    Keymaster

    @boonebgorges

    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):
    `class=””`
    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).

    Avatar of Aomao
    aomao
    Participant

    @aomao

    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)

You must be logged in to reply to this topic.