نظام تقييم المقالات بالنجوم

مقال حصري رقم 9 — نظام تقييم النجوم لووردبريس

مقال حصري رقم 9 — نظام تقييم النجوم لكل مقال في ووردبريس

في هذا المقال، سنتعلم كيفية إنشاء **نظام تقييم النجوم** لكل مقال، يسمح للزوار بتقييم المقالات مباشرة وعرض المتوسط بشكل جذاب.

الكود الكامل للإضافة

<?php
/*
Plugin Name: Post Star Rating
Description: نظام تقييم النجوم لكل مقال في ووردبريس.
Version: 1.0
Author: موقعك الحصري
*/

if(!defined('ABSPATH')) exit;

// حفظ تقييم الزائر عبر AJAX
add_action('wp_ajax_pstar_rate', 'pstar_rate_callback');
add_action('wp_ajax_nopriv_pstar_rate', 'pstar_rate_callback');

function pstar_rate_callback() {
    $post_id = intval($_POST['post_id']);
    $rating = intval($_POST['rating']);
    if($post_id && $rating >=1 && $rating <=5){
        $ratings = get_post_meta($post_id, '_pstar_ratings', true);
        if(!$ratings) $ratings = [];
        $ratings[] = $rating;
        update_post_meta($post_id, '_pstar_ratings', $ratings);
        $avg = round(array_sum($ratings)/count($ratings),1);
        echo $avg;
    }
    wp_die();
}

// عرض النجوم في المقال
function pstar_display_stars($content){
    if(is_single()){
        global $post;
        $ratings = get_post_meta($post->ID, '_pstar_ratings', true);
        $avg = 0;
        if($ratings && count($ratings)){
            $avg = round(array_sum($ratings)/count($ratings),1);
        }
        $content .= '<div class="pstar-container" data-post="'.esc_attr($post->ID).'">';

        for($i=1;$i<=5;$i++){
            $class = ($i <= round($avg)) ? 'star selected' : 'star';
            $content .= '<span class="'.esc_attr($class).'" data-star="'.$i.'">★</span>';
        }
        $content .= '<span class="pstar-avg"> متوسط: '.esc_html($avg).'</span>';
        $content .= '</div>';
    }
    return $content;
}
add_filter('the_content', 'pstar_display_stars');

// جافاسكريبت للتفاعل مع النجوم
add_action('wp_footer', function(){
    if(is_single()){
        ?>
        
        

شرح الكود

  • يزود كل مقال بلوحة تقييم 5 نجوم يمكن للزائر النقر على أي نجمة.
  • يتم حفظ التقييمات في post meta باسم _pstar_ratings.
  • يحسب متوسط التقييم ويعرضه أسفل النجوم.
  • تفاعلي باستخدام AJAX بدون إعادة تحميل الصفحة.

تخصيص العرض

  • يمكنك تغيير حجم النجوم أو لونها عبر CSS.
  • يمكنك تعديل النص متوسط أو إضافة أيقونات إضافية.
  • يمكن دمج النظام مع الإحصائيات لتحديد المقالات الأعلى تقييمًا.

الخلاصة

بهذا الكود لديك نظام تقييم نجوم **حصري لووردبريس** يسمح للزوار بالتفاعل مع المقالات، ويعرض المتوسط بشكل مباشر. إضافة رائعة لزيادة التفاعل وتحفيز الزوار على التقييم.

اترك تعليقاً

لن يتم نشر عنوان بريدك الإلكتروني. الحقول الإلزامية مشار إليها بـ *

Scroll to Top