alishademan

نمایش پست جدید به صورت زنده بدون ریفرش کردن

13 پست در این موضوع قرار دارد

سلام به دوستان عزیر ببخشید اگر عنوان رو درست انتخاب نکردم سوالی داشتم

سایتی دارم و میخوام وقتی پست جدیدی رو منتشر کردم در سایت اگر کاربری حظور داشت بدون ریفرش کردن سایت مطلب جدید براش نمایش داده بشه  ...

جستجو کردم اما به نتیجه ای نرسیدم

ممنون از راهنماییتون

ویرایش شده در توسط alishademan
0

به اشتراک گذاری این پست


لینک به پست
در 1 دقیقه قبل، alishademan گفته است :

سلام به دوستان عزیر ببخشید اگر عنوان رو درست انتخاب نکردم سوالی داشتم

سایتی دارم و میخوام وقتی پست جدیدی رو منتشر کردم در سایت اگر کاربری حظور داشت بدون ریفرش کردن سایت مطلب جدید براش نمایش داده بشه ...

ممنون از راهنماییتون

سلام

افزونه هایی برای این کار طراحی شده !

بهش میگن آزاکس

اینها رو امتحان کنید:
WP Live Stream
Live Blogging
Live Writer Stealth

ولی متاسفانه آپدیت هاش قدیمی هستن!

1

به اشتراک گذاری این پست


لینک به پست

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

ویرایش شده در توسط alishademan
0

به اشتراک گذاری این پست


لینک به پست
در 13 دقیقه قبل، alishademan گفته است :

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

اگر به برنامه نویسی با آژاکس آشنایی داشته باشید میتونید این مورد رو طراحی کنید ولی متاسفانه بیشتر از این نمیدونم!

1

به اشتراک گذاری این پست


لینک به پست
در 3 دقیقه قبل، محمد پارسا گفته است :

اگر به برنامه نویسی با آژاکس آشنایی داشته باشید میتونید این مورد رو طراحی کنید ولی متاسفانه بیشتر از این نمیدونم!

ممنون ، منتظر پاسخگویی بچه ها میمونم ...

0

به اشتراک گذاری این پست


لینک به پست
در 3 ساعت قبل، alishademan گفته است :

ممنون ، منتظر پاسخگویی بچه ها میمونم ...

سلام

والا چیزی که میخواید مورد ساده ای نیست باید خودتونم اطلاعاتی درباره PHP و JavaScript داشته باشید.

1

به اشتراک گذاری این پست


لینک به پست

برای نمایش تعداد پست ها چی ؟

اگر در همین روند انشار پست جدید در سایت کاربری حظور داشت و چند پست جدید اضافه شد فقط تعدادشون رو به صورت زنده اعلام کنه چی ؟

0

به اشتراک گذاری این پست


لینک به پست
در 1 ساعت قبل، alishademan گفته است :

برای نمایش تعداد پست ها چی ؟

اگر در همین روند انشار پست جدید در سایت کاربری حظور داشت و چند پست جدید اضافه شد فقط تعدادشون رو به صورت زنده اعلام کنه چی ؟

خوب من کد تعداد پست های جدید رو براتون آماده کردم.

ابتدا باید یک پاسخ دهنده درخواست های AJAX در وردپرس ایجاد کنید. برای این منظور کد زیر رو در فایل functions.php قالبتون زیر

<?php

قرار میدید.

function timetostr($timestamp, $ago = false) {
	$now = new DateTime();
	$then = new DateTime(date('c', $timestamp));
	$diff = $now->diff($then);
	if($ago === false)
		return $diff->format('%h hours %i minutes %s seconds');
	else
		return $diff->format('%h hours %i minutes %s seconds ago');
}

add_action( 'wp_ajax_new_post', 'new_post' );
add_action( 'wp_ajax_nopriv_new_post', 'new_post' );
function new_post() {

	if($_SERVER['REQUEST_METHOD'] === "POST") {

		$after = $_REQUEST['after'];
		
		if($after) {
			
			$args = array(
				'nopaging' => 1,
				'fields' => 'ids',
				'date_query' => array(
					array(
						'after' => timetostr($after, true),
					),
				),
			);
			
			$query = new WP_Query($args);
			
			$post_ids = $query->posts;
			
			if($post_ids !== array())
				wp_send_json(['error' => false, 'count' => count($post_ids), 'time' => strtotime(get_lastpostdate())]);
			else
				wp_send_json(['error' => true]);
			
		} else {
			wp_send_json(['error' => true]);
		}
	} else {
		wp_send_json(['error' => true]);
	}

}

سپس برای بحث ارسال درخواست AJAX از jQuery استفاده کردم که کدش اینه:

jQuery(function() {
  setInterval(function() {
    	newPost();
  }, 5000);
});

function newPost() {
    jQuery.ajax({
        type: 'POST',
        url: 'http://domain.com/wp-admin/admin-ajax.php',
        data: {
            'action': 'new_post',
            'after': jQuery("#snackbar").attr("data-after");
        },
        dataType: 'json',
        success: function(result) {
            if(result.error === false) {
				jQuery("#snackbar").attr("data-after", result.time);
				jQuery("#snackbar").html(result.count + " پست جدید اضافه شد");
				snackBar();
            }
        }
    });
}

function snackBar() {
	var x = document.getElementById("snackbar");
	x.className = "show";
	setTimeout(function(){ x.className = x.className.replace("show", ""); }, 3000);
}

که شما در کد بالا جای domain.com آدرس سایت خودتون رو میذارید.

یه سری کد CSS داریم برای استایل اون SnackBar ای که تعداد پست رو نمایش میده که باید توی یکی از فایل های CSS قالبتون مثل style.css بذارید.

/* The snackbar - position it at the bottom and in the middle of the screen */
#snackbar {
    visibility: hidden; /* Hidden by default. Visible on click */
    min-width: 250px; /* Set a default minimum width */
    margin-left: -125px; /* Divide value of min-width by 2 */
    background-color: #333; /* Black background color */
    color: #fff; /* White text color */
    text-align: center; /* Centered text */
    border-radius: 2px; /* Rounded borders */
    padding: 16px; /* Padding */
    position: fixed; /* Sit on top of the screen */
    z-index: 1; /* Add a z-index if needed */
    left: 50%; /* Center the snackbar */
    bottom: 30px; /* 30px from the bottom */
}

/* Show the snackbar when clicking on a button (class added with JavaScript) */
#snackbar.show {
    visibility: visible; /* Show the snackbar */

/* Add animation: Take 0.5 seconds to fade in and out the snackbar. 
However, delay the fade out process for 2.5 seconds */
    -webkit-animation: fadein 0.5s, fadeout 0.5s 2.5s;
    animation: fadein 0.5s, fadeout 0.5s 2.5s;
}

/* Animations to fade the snackbar in and out */
@-webkit-keyframes fadein {
    from {bottom: 0; opacity: 0;} 
    to {bottom: 30px; opacity: 1;}
}

@keyframes fadein {
    from {bottom: 0; opacity: 0;}
    to {bottom: 30px; opacity: 1;}
}

@-webkit-keyframes fadeout {
    from {bottom: 30px; opacity: 1;} 
    to {bottom: 0; opacity: 0;}
}

@keyframes fadeout {
    from {bottom: 30px; opacity: 1;}
    to {bottom: 0; opacity: 0;}
}

و در نهایت یه کد HTML و PHP کوچیک هم داریم که اینو توی فایل footer.php قالب قبل از

</body>

میذارید.

<div id="snackbar" data-after="<?php echo strtotime(get_lastpostdate()); ?>"></div>

خوب دیگه تموم شد.

یه نکته ای هم که هست هر 5 ثانیه چک میکنه پست جدید درج شده یا نه.

 

موفق باشید

ویرایش شده در توسط mehran-b
1

به اشتراک گذاری این پست


لینک به پست
در 11 ساعت قبل، mehran-b گفته است :

خوب من کد تعداد پست های جدید رو براتون آماده کردم.

ابتدا باید یک پاسخ دهنده درخواست های AJAX در وردپرس ایجاد کنید. برای این منظور کد زیر رو در فایل functions.php قالبتون زیر


<?php

قرار میدید.


function timetostr($timestamp, $ago = false) {
	$now = new DateTime();
	$then = new DateTime(date('c', $timestamp));
	$diff = $now->diff($then);
	if($ago === false)
		return $diff->format('%h hours %i minutes %s seconds');
	else
		return $diff->format('%h hours %i minutes %s seconds ago');
}

add_action( 'wp_ajax_new_post', 'new_post' );
add_action( 'wp_ajax_nopriv_new_post', 'new_post' );
function new_post() {

	if($_SERVER['REQUEST_METHOD'] === "POST") {

		$after = $_REQUEST['after'];
		
		if($after) {
			
			$args = array(
				'nopaging' => 1,
				'fields' => 'ids',
				'date_query' => array(
					array(
						'after' => timetostr($after, true),
					),
				),
			);
			
			$query = new WP_Query($args);
			
			$post_ids = $query->posts;
			
			if($post_ids !== array())
				wp_send_json(['error' => false, 'count' => count($post_ids), 'time' => strtotime(get_lastpostdate())]);
			else
				wp_send_json(['error' => true]);
			
		} else {
			wp_send_json(['error' => true]);
		}
	} else {
		wp_send_json(['error' => true]);
	}

}

سپس برای بحث ارسال درخواست AJAX از jQuery استفاده کردم که کدش اینه:


jQuery(function() {
  setInterval(function() {
    	newPost();
  }, 5000);
});

function newPost() {
    jQuery.ajax({
        type: 'POST',
        url: 'http://domain.com/wp-admin/admin-ajax.php',
        data: {
            'action': 'new_post',
            'after': jQuery("#snackbar").attr("data-after");
        },
        dataType: 'json',
        success: function(result) {
            if(result.error === false) {
				jQuery("#snackbar").attr("data-after", result.time);
				jQuery("#snackbar").html(result.count + " پست جدید اضافه شد");
				snackBar();
            }
        }
    });
}

function snackBar() {
	var x = document.getElementById("snackbar");
	x.className = "show";
	setTimeout(function(){ x.className = x.className.replace("show", ""); }, 3000);
}

که شما در کد بالا جای domain.com آدرس سایت خودتون رو میذارید.

یه سری کد CSS داریم برای استایل اون SnackBar ای که تعداد پست رو نمایش میده که باید توی یکی از فایل های CSS قالبتون مثل style.css بذارید.


/* The snackbar - position it at the bottom and in the middle of the screen */
#snackbar {
    visibility: hidden; /* Hidden by default. Visible on click */
    min-width: 250px; /* Set a default minimum width */
    margin-left: -125px; /* Divide value of min-width by 2 */
    background-color: #333; /* Black background color */
    color: #fff; /* White text color */
    text-align: center; /* Centered text */
    border-radius: 2px; /* Rounded borders */
    padding: 16px; /* Padding */
    position: fixed; /* Sit on top of the screen */
    z-index: 1; /* Add a z-index if needed */
    left: 50%; /* Center the snackbar */
    bottom: 30px; /* 30px from the bottom */
}

/* Show the snackbar when clicking on a button (class added with JavaScript) */
#snackbar.show {
    visibility: visible; /* Show the snackbar */

/* Add animation: Take 0.5 seconds to fade in and out the snackbar. 
However, delay the fade out process for 2.5 seconds */
    -webkit-animation: fadein 0.5s, fadeout 0.5s 2.5s;
    animation: fadein 0.5s, fadeout 0.5s 2.5s;
}

/* Animations to fade the snackbar in and out */
@-webkit-keyframes fadein {
    from {bottom: 0; opacity: 0;} 
    to {bottom: 30px; opacity: 1;}
}

@keyframes fadein {
    from {bottom: 0; opacity: 0;}
    to {bottom: 30px; opacity: 1;}
}

@-webkit-keyframes fadeout {
    from {bottom: 30px; opacity: 1;} 
    to {bottom: 0; opacity: 0;}
}

@keyframes fadeout {
    from {bottom: 30px; opacity: 1;}
    to {bottom: 0; opacity: 0;}
}

و در نهایت یه کد HTML و PHP کوچیک هم داریم که اینو توی فایل footer.php قالب قبل از


</body>

میذارید.


<div id="snackbar" data-after="<?php echo strtotime(get_lastpostdate()); ?>"></div>

خوب دیگه تموم شد.

یه نکته ای هم که هست هر 5 ثانیه چک میکنه پست جدید درج شده یا نه.

 

موفق باشید

سلام

چون دیدم حجم کدها زیاده و امکان داره گیج بشید میتونید به جای کارهایی که در تاپیک بالایی گفتم پلاگینش رو که امروز آماده کردم نصب کنید.

new-post-ajax-notification.zip

 

پ.ن1: پلاگین هر 20 ثانیه چک میکنه پست جدید موجود هست یا خیر.

پ.ن2: پلاگین بسیار سبک است و هیچ فشاری به سرور نمیاره.

ویرایش شده در توسط mehran-b
1

به اشتراک گذاری این پست


لینک به پست

مرسی عالی بود

0

به اشتراک گذاری این پست


لینک به پست
در 21 ساعت قبل، alishademan گفته است :

سلام به دوستان عزیر ببخشید اگر عنوان رو درست انتخاب نکردم سوالی داشتم

سایتی دارم و میخوام وقتی پست جدیدی رو منتشر کردم در سایت اگر کاربری حظور داشت بدون ریفرش کردن سایت مطلب جدید براش نمایش داده بشه  ...

جستجو کردم اما به نتیجه ای نرسیدم

ممنون از راهنماییتون

برای مورد بالا چی کار میشه کرد ؟؟؟

0

به اشتراک گذاری این پست


لینک به پست
در 5 ساعت قبل، alishademan گفته است :

برای مورد بالا چی کار میشه کرد ؟؟؟

برای این مورد اگر پلاگین میخواید باید مختص قالب شما نوشته بشه.

0

به اشتراک گذاری این پست


لینک به پست
در 2 ساعت قبل، mehran-b گفته است :

برای این مورد اگر پلاگین میخواید باید مختص قالب شما نوشته بشه.

اگر بخوام از چه طریق باید اقدام کنم 

0

به اشتراک گذاری این پست


لینک به پست

برای ارسال نظر یک حساب کاربری ایجاد کنید یا وارد حساب خود شوید

برای اینکه بتوانید نظر ارسال کنید نیاز دارید که کاربر سایت شوید

ایجاد یک حساب کاربری

برای حساب کاربری جدید در انجمن ما ثبت نام کنید. عضویت خیلی ساده است !


ثبت نام یک حساب کاربری جدید

ورود به حساب کاربری

دارای حساب کاربری هستید؟ از اینجا وارد شوید


ورود به حساب کاربری