رفتن به صفحه قبل و بعد با کمک آژاکس ساده

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

خب برای شروع ابتدا کد زیر را در فایل header.php خود و یا هدر سایت خود قرار دهید :

<script type="text/javascript" charset="utf-8" src="<?php bloginfo(url); ?>/wp-includes/js/jquery/jquery.js"></script>
	<script type="text/javascript" charset="utf-8">
		jQuery(document).ready(function(){

			jQuery('#postPagination a').live('click', function(e){
				e.preventDefault();
				var link = jQuery(this).attr('href');
				jQuery('#content').fadeOut(500).load(link + ' #contentInner', function(){ jQuery('#content').fadeIn(500); });

			});

		});
	</script>

خب برای مرحله بعد به سراغ فایل index.php و یا هرفایلی که میخواهید آژاکس به کار برده شود بروید , سپس کد زیر را قبل از شروع حلقه پست قرار دهید .
یعنی مثلا کد زیر را بیابید :

<?php if (have_posts()) : while (have_posts()) : the_post(); ?>

و کد زیر را قبل از کد بالا قرار دهید :

<div id='content'>
    <div id='contentInner'>

خب آخر حلقه را هم بیابید و کد های بالا را ببندید :
برای مثال کد زیر را بیابید :

<?php endif; ?>

و بعد از آن کد زیر را قرار دهید :

</div>
</div>

خب حالا کافیست کد زیر را در هر جاکه میخواهید صفحات قبلی / بعدی نمایش داده شود قرار دهید (درون حلقه پست باشد )

<div id='postPagination'>
	<?php posts_nav_link('  ', ('&laquo; صفحه بعدی'), ('صفحه قبلی &raquo;')); ?>
</div>

تموم شد. اگر توضیحاتم خوب نبود میتوانید نمونه قالب استفاده شده را از اینجا دانلود کنید (زبان انگلیسی میباشد)

  خطای رایج وردپرس http و 5 روش برای حل آن
آیا این مقاله برای شما مفید بود؟
تقریبا
خیر

دیدگاهتان را بنویسید

ارسال دیدگاه به معنی این است که شما ابتدا قوانین ارسال دیدگاه را مطالعه کرده‌اید و با آن موافق هستید.

دیدگاه‌های این نوشته جدید ترین ها شاخص

  1. سلام داداش
    بنده اینو اکی کردم کار هم میکرد اما مشکل داشت !
    وقتی صفحه بعد میرم صفحه قبلی سر جاشه و بالای سایت زیر هدر مطال صفحه دوم فراخوانی میشه !!!!!!
    اما کاملا آجاکس 😀
    حالا شما میدونید چرا صفحه قبل میمونه سر جاش ؟

  2. سلام . با استفاده از این روش شما دیگه برای مطالب بعد صفحه رفرش نمیشه ؟ من دنبال کدی هستم که بدون نیاز به رفرش صفحه مطالب رو بیاره . با تشکر از سایت خوبتون

  3. آقای حاجی محمدی لطفا آموزش استایل بندی کامنت مثل سایت خودتون رو هم بذارین . مثل شما که نظر میدین سبز میشه
    سلام

  4. سلام
    منم دقیقا سوال آقای محمد رضا رو دارم : “در انتهای هر صفحه بنویسه ۱٫۲٫۳٫۴…. صفحه بعد و صفحه قبل ”
    میشه بیشتر توضیح بدید؟!

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

  6. سلام علی جان
    بنده از این کد استفاده کردم همه چی هم جواب میده و هیچ مشکلی با مسئله ایجکس نیست
    فقط یه مشکل اساسی دارم
    با کلیک رو صفحه قبلی همون مطالب صفحه اول نشون داده میشه
    تا قبل این هم گزینه نوشته های قدیمی تر و نوشته های جدیدتر برام نمیومد!!!
    حالا باید چیکار کنم؟
    مشکل از کجاست؟

  7. salam besyar mamnon vali javab nadad