BuddyDev

Search

Change background color of members loop label

  • Participant
    Level: Enlightened
    Posts: 44
    Alex on September 6, 2024 at 11:11 am #53121

    I would like to change the background color at the top label at the members loop regarding the active filter. Which means background red on active members and blue on newest members and so on.
    How to achieve that? There’s no class where I can asign that so I probably need some php to do that.

    https://postimg.cc/zbbyJnBc

  • Keymaster
    Level: Yogi
    (BuddyDev Team)
    Posts: 3115
    Ravi on September 6, 2024 at 2:27 pm #53122

    Hello Alex,

    Thank you for posting here. Please share the website url I will share the CSS rule to override it.

    Regards
    Ravi

  • Participant
    Level: Enlightened
    Posts: 44
    Alex on September 8, 2024 at 5:44 pm #53127

    Hello Ravi,
    thanks for your answer. Unfortunately I cant provide you with these credentials because the site is not public yet and protected.

    The tag where I want to change the background color has no different id’s or classes for active, random or newest member seach. So I wonder how you want to assign different colors just using CSS?

    SourceCode:
    <li id=”members-all” class=”selected” data-bp-scope=”all” data-bp-object=”members”>
    Active Members <span class=”count”>4</span>

    I can use li a { background-color: blue; } but again, then ALL labels are in blue.

    Regards

  • Keymaster
    Level: Yogi
    (BuddyDev Team)
    Posts: 3115
    Ravi on September 9, 2024 at 3:10 pm #53128

    Hello Alex,

    Thank you for the acknowledgement. Please give it a try with the following CSS rule and let me know

    
.buddypress-wrap .bp-navs ul.members-nav li.selected a {
    background: #d5d5d5;
}

    You can place this code active theme css file or from Customizer setting > “Additional CSS” if your theme support it.

    Regards
    Ravi

  • Participant
    Level: Enlightened
    Posts: 44
    Alex on September 9, 2024 at 5:46 pm #53132

    Thanks again for your answer.

    You solution changes the background color of the selected filter. I don’t see any advantage in just adding css and overwrite the grey with a prefered color.

    In my case I wanted the grey label green when active filter ist selected, red when newest member and blue when random. But as I worried this is not possible adding code to the members loop directly to id the label.

    To do this is probably to much effort, isn’t it?

  • Keymaster
    Level: Yogi
    (BuddyDev Team)
    Posts: 3115
    Ravi on September 10, 2024 at 9:03 am #53134

    Hello Alex,

    Thank you for the acknowledgement. The BuddyPress plugin do not add any specific class as per selected filter to the element. That’s why it is difficult to implement i.e. to add a background-color based on filter selected. The plugin do not provide any direct way to implement this.

    Regards
    Ravi

You must be logged in to reply to this topic.

This topic is: not resolved