Skip to:
Content
Pages
Categories
Search
Top
Bottom

Change Colors on Buddypress Notifications !


  • antoinegdln4
    Participant

    @antoinegdln4

    8 years, 1 month ago

    Hi Everyone !
    One year ago, i try to put the notifications of the Buddypress bar into my header.
    And, thanks to the members of this forum, it works succesfully.
    I have now a new item on my menu, and it’s a count of the notifications.

    But i want to see immediatly when there is a new notification !
    I would like to change the color of the notification bubble only when there is a new (ou more) notification !
    Can you help me ? :/

    There is my actual php code, on the bp-custom.php 

    function my_nav_menu_notif_counter($menu) {      
        if (!is_user_logged_in())
                return $menu;
        else
                $notif = '<li ><a class="ab-item" href="' . bp_core_get_user_domain(bp_loggedin_user_id() ) . 'notifications/">'. __('').'<span id="ab-pending-notifications" class="pending-count alert">'. __(''). bp_notifications_get_unread_notification_count( bp_loggedin_user_id() ) .'</span> </a></li>';
                $menu = $menu . $notif;
                return $menu;
}
add_filter( 'wp_nav_menu_items', 'my_nav_menu_notif_counter' );
add_filter( 'show_admin_bar', '__return_false' );

    Sorry if my english is bad, i’m french
    I have bad knowledges in Php, but i can try to understand the code

    WP 4.4.5
    BP 2.6.2

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

  • antoinegdln4
    Participant

    @antoinegdln4

    8 years, 1 month ago

    My question is “How can i include this code 

    $notifications = bp_core_get_notifications_for_user( bp_loggedin_user_id(), ‘object’ );
$count = !empty( $notifications ) ? count( $notifications ) : 0;
$alert_class = (int) $count > 0 ? ‘pending-count alert’ : ‘count no-alert’;
$menu_title = ‘‘ . $count . ‘‘;

    (who can get the class [and color] i want) to my previous code…. ”
    Thanks !


    sension
    Participant

    @sension

    8 years ago

    That method also adds notifications in all the menus in the site. Anyone knows how to show only in certain menu?


    antoinegdln4
    Participant

    @antoinegdln4

    8 years ago

    I only know the method to put the notifications in the main menu… :/
    By the way, this topic is solved, i got the answer on overflostacks…


    Florian Bansac
    Participant

    @floarchi

    7 years, 9 months ago

    If there are still people looking for help, I have been trying different things today to:
    -add the notifications counter in menu
    -style differently if 0 notifications or 1+
    -target only the main

    It works for me, maybe you can check from here:

    // filter to target only main menu
add_filter('wp_nav_menu_items','my_nav_menu_notif_counter', 10, 2);

function my_nav_menu_notif_counter($menu, $args) {

$url = bp_core_get_user_domain(bp_loggedin_user_id()) .'notifications/';

// counter to target unread notifications = 0 or 1+
$bpnotifcount = bp_notifications_get_unread_notification_count( bp_loggedin_user_id() );

       // condition: user must be loggedin
       if (!is_user_logged_in())
                return $menu;
       else

                // condition: only main nav
		if( $args->theme_location == 'primary' ) {

                        // condition: 0 unread notifications
			if($bpnotifcount == 0) { 
                	$notif = '<li><a href=" ' .$url. ' ">Notifications <span class="notifmenucount">'. bp_notifications_get_unread_notification_count( bp_loggedin_user_id() ) .'</span></a></li>';
			} else {
               		$notif = '<li><a href=" ' .$url. ' ">Notifications <span class="notifmenucount countnot0">'. bp_notifications_get_unread_notification_count( bp_loggedin_user_id() ) .'</span></a></li>';
			}

        		$menu = $menu . $notif;
        		return $menu;
		}

        	else
			return $menu;

}

    And CSS

    /*Notifications counter in menu*/
.notifmenucount {
border-radius: 25%;
border: 1px solid #ccc;
color: #888;
display: inline;
margin-left: 1px;
padding: 2px 6px;
text-align: center;
vertical-align: center;
font-size: small;
}
.countnot0 {
color: #ffff00;
background: #ff0000;
border: 1px solid transparent;
}

    😉

Viewing 4 replies - 1 through 4 (of 4 total)
  • You must be logged in to reply to this topic.

Topic Info

Topic Tags

Skip to toolbar