وب کافه

امروز میخوام آموزشی قرار بدهم که خودم خیلی بهش نیاز داشتم و آن هم ایجکس کردن آگاه سازی ها بود  به این صورت که در بادی پرس وقتی کاربری به کاربر دیگه پیام میفرسته و یا درخواست دوستی میکنه حتما باید سایت دوباره بارگزاری بشود تا شمارنده آگاه سازی یا همون اعلانات یک شماره اضافه کند.

برای اینکار ابتدا ما نیاز داریم که بخشی از سایت که شماره انداز آگاهسازی ها است خودکار ری لود بشود که  با استفاده از کد جاوا اسکریپت این کار را انجام میدهیم

$(document).ready(function() {

  setInterval("repeatMe()", 5000); 
});

function repeatMe(){
    $.ajax({
    url:ajaxurl,
	type: "POST",
    dataType: "json",
	data: { action: "live_notifications_counter" },
	success: function(html){
                 $(".not").html(html);				   
				 $(".not").fadeIn("slow");
		          
    	}
  });

}

خب ما با این کد جاوا دستور میدهیم که هر 5 ثانیه function repeatMe لود شود و اگر در آن شماره تغییر کرده بود آن را در class  not نمایش دهد بنابراین در هر بار لود شدن  function live_notifications_counter  چک می شود که ما نیاز داریم این کد را در function.php  پوسته سایت جای دهیم.

function live_notifications_counter() {
       $notifications = bp_core_get_notifications_for_user( bp_loggedin_user_id() );
       if(! empty($notifications)){
       $count= bp_notifications_get_unread_notification_count(bp_loggedin_user_id() ) ;
       } 
       echo $count;
       if( defined( 'DOING_AJAX' ) && DOING_AJAX ) {
       die();
       }
}
add_action( 'wp_ajax_live_notifications_counter', 'live_notifications_counter' );
add_action( 'wp_ajax_nopriv_live_notifications_counter', 'live_notifications_counter' );

خب حالا باید کلاس not  را در هر کجای قالب که نیاز داریم جا گذاری کنیم و به آن استایل دهیم

به این صورت

<div class="not"> </div>

و استایل ان نیز به این صورت است که شما میتوانید تغییر دهید

.not{
	background: none repeat scroll 0% 0% rgb(224, 36, 36);
    padding: 1px 3px;
    color: rgb(255, 255, 255);
    border-radius: 3px 3px 3px 3px;

}

حالا اگر شماره انداز آگاه سازی بروز شود بعد از 5 ثانیه شماره آن تغییر خواهد کرد