لایک مطالب و دیدگاه وردپرس بدون افزونه به شکل ایجکس Ajax Like post

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

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

همینطور که میدانید با اندکی جستجو در اینترنت به کدها و روش های گوناگونی برای ساخت سیستم لایک وردپرس بدون افزونه میرسید، ما در این مطلب از توابعی که به صورت رایگان و متن باز توسط آقای جان مسترسون (Jon Masterson) در سایت گیت هاب (github) به آدرس WordPress-Post-Like-System منتشر شده استفاده میکنیم.

نقاط قوت سیستم لایک مطالب و دیدگاه وردپرس بدون افزونه

برخی از ویژگی های سیستم لایک نوشته و نظرات آقای جان مسترسون عبارتند از:

  1. لایک و دیسلایک پست و نظرات وردپرس به شکل آژاکس (ایجکس Ajax)
  2. استفاده از آیکون های svg، فونت ایکون و یا تصویر در پروژه
  3. فراخوانی دکمه های لایک در نوشته و نظرات وردپرس توسط تابع
  4. امکان استفاده در حلقه وردپرس یا کوئری های wordpress
  5. قابلیت تعیین آیکون متفاوت برای نوشته های لایک شده
  6. امکان پسندیدن یا حذف لایک مطالب و دیدگاه ها توسط کاربر
  7. قابلیت نمایش تعداد لایک در پروفایل کاربران
  8. امکان ساخت کوئری برای نمایش نوشته یا دیدگاه های دارای بیشترین لایک
  9. قابلیت نمایش لایک بر حسب کیلو (مثلا 1k)
  10. و …

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

برای شروع کار ابتدا فایل های افزونه را از سرور گیت هاب و یا از لینک wordpress post and comment like دانلود میکنیم. پس از استخراج فایل از حالت فشرده، فایل پی اچ پی post-like.php را در کنار سایر فایلهای قالب وردپرس مان کپی میکنیم. سپس قطعه کد زیر را در فایل فانکشن پوسته که با نام functions.php شناخته میشود قرار میدهیم تا توابع افزونه لایک را فراخوانی کنیم.

include_once('post-like.php');

در پوشه js فایلی با نام simple-likes-public.js وجود دارد که برای ایجاد قابلیت ایجکس مورد استفاده قرار میگیرد.
این فایل جی کوئری را نیز به پوشه js قالب منتقل میکنیم. (اگر پوسته وردپرس تان پوشه js ندارد آنرا بسازید و فایل simple-likes-public.js را درون آن کپی کنید)

در پوشه css فایلی با نام simple-likes-public.css وجود دارد که باید کدهای استایل موجود در آنرا کپی کرده و در استایل پوسته که با نام style.css شناخته میشود قرار دهید. تقریبا کار فراخوانی و شناساندن توابع سیستم لایک مطالب و دیدگاه وردپرس بدون افزونه تمام شده و اکنون میتوانید با استفاده از توابع زیر در حلقه و کوئری وردپرس بخش لایک مطالب را نمایش دهید.

تابع لایک مطالب
<?php echo get_simple_likes_button(get_the_ID()); ?>
تابع لایک دیدگاه ها
<?php echo get_simple_likes_button(get_comment_ID(),1); ?>

تغییر آیکون پسندیدن و نپسندیدن سیستم لایک وردپرس

تغییر آیکون لایک مطالب و دیدگاه وردپرس بدون افزونه

برای تغییر آیکون های لایک و دیسلایک فایل post-like.php را در ویرایشگر php اجرا کنید سپس به عبارت get_liked_icon و get_unliked_icon را جستجو کنید، اکنون میتوانید با تغییر ایکون svg پیشفرض (خط 305 و 315) به فونت آیکون دلخواه یا ایکون تصویری، شخصی سازی های لازم را انجام دهید.

کوئری نمایش مطالب دارای بیشترین لایک

برای نمایش مطالبی که بیشترین لایک را دریافت کرده اند، از کوئری زیر استفاده کنید.

<?php $sticky = get_option('sticky_posts');
$arms = array(
'post_type' => 'post','post__not_in' => $sticky,
'post_status' => 'publish',
'meta_key'  => '_post_like_count','orderby' => 'meta_value_num',
'order' => 'DESC','posts_per_page' => 10);
$the_query = new WP_Query($arms);
if ($the_query->have_posts()) : while ($the_query->have_posts()) : $the_query->the_post(); ?>
<li><a target="_blank" href="<?php the_permalink(); ?>"><?php the_title(); ?></a></li>
<?php endwhile; wp_reset_postdata(); else : ?>
<li><?php _e( 'متاسفم مطلبی برای نمایش وجود ندارد' ); ?></li>
<?php endif; ?>

در کد بالا تعداد 10 عنوان به همراه لینک مطلب نمایش داده میشود برای تغییر تعداد مطالب قابل نمایش مقدار متغییر posts_per_page را تغییر دهید.

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

مطالب مفید مرتبط:

4.5/5 - (31 امتیاز)
بازدیدکنندگانی که این مطلب را مطالعه کرده اند، از مطالب زیر نیز استقبال کرده اند
دیدگاهی بنویسید
13

  1. ممدم
    22 آبان 1402 ساعت 22:55

    باورم نشد این کد کار کرد .
    واقعا ممنون ازتون .

  2. ali
    11 مرداد 1398 ساعت 10:11

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

    • رضا کیانوش
      11 مرداد 1398 ساعت 17:31

      سلام وقت بخیر، باید از طریق ویرایش قالب وردپرس تون در داخل حلقه وردپرس قرار بگیره.

  3. سعید
    7 مرداد 1398 ساعت 10:45

    اقا رضا عالی بود. سپاس از شما.

    بنده الان پست شمارو لایک کردم بعد از ۲ ثانیه لایک ثبت شد. اما در سایت خودم زمانی ک کلیم میکنم ۵ یا ۶ ثانیه طول میکشه تا لایک ثبت بشه.
    این اختلال زمان به چه چیزی مربوط میشه؟؟؟

    • رضا کیانوش
      7 مرداد 1398 ساعت 13:21

      سلام وقت بخیر، بستگی به کیفیت هاست از نظر سرعت سرور و پایگاده داده داره چون باید مقدار در زمینه دلخواه ذخیره بشه.

  4. مهدی
    13 اردیبهشت 1398 ساعت 15:22

    سلام . برای نمایش تعداد لایک ها در بخش دسته بندی های مطلب گفتید از همون کد مربوط به ایجاد لایک استفاده کنیم . خود مشکل اینجاست که اگر اون کد رو قرار بدهید کاربر در همون دسته بندی میتونه مطلب رو لایک کنه ، که اینطور درست نیست . مثلا الان برای سایت شما در بخش دسته بندی ها فقط تعداد لایک ها رونمایش میده و وقتی وارد مطلب میشه میتونه مطلب رو لایک کنه . این تکه کد به چه صورت هست ؟

    • رضا کیانوش
      13 اردیبهشت 1398 ساعت 17:54

      سلام وقت بخیر، با استفاده از دستور echo در php زمینه دلخواه _post_like_count رو چاپ کنید. این زمینه تعداد لایکها رو ذخیره میکنه. موفق باشید

  5. حمید
    9 اسفند 1397 ساعت 21:57

    سلام
    ممنون بابت آموزش خوبتون
    تمام موارد رو انجام دادم ، حالا برای نمایش تعداد لایک های هر نوشته در قسمت دسته بندی از چه کدی باید استفاده کنیم

    • رضا کیانوش
      10 اسفند 1397 ساعت 07:46

      سلام وقت بخیر، برای نمایش تعداد لایک هر مطلب از تابعی که برای لایک کرن نوشته ها هست میتونید استفاده کنید. موفق باشید

  6. شاهو
    29 شهریور 1397 ساعت 12:57

    سلام خسته نباشید، حلقه نمایش مطالبی که بیشترین لایک رو دارند به چه صورت هست؟

    • رضا کیانوش
      29 شهریور 1397 ساعت 18:57

      سلام وقت بخیر، مطلب بروز و کوئری نمایش مطالب دارای بیشترین لایک اضافه شد. موفق باشید

  7. صادق علیخانی
    3 شهریور 1396 ساعت 03:19

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

    • رضا کیانوش
      4 شهریور 1396 ساعت 07:02

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