شرح كيفية عمل تعدد الصفحات لاى نتائج بأشكال متعددة

[تحسين] ماذا يعنى هذا؟

عندما يكون لديك كمية كبيرة من العناصر (مثال: نتائج البحث او اخر الاخبار), يمكنك عرضها فى مجموعات تفصل بين كل مجموعة واخرى بصفحة يوجد بها عدد معين من النتائج

مثال حى (قائمة اسماء عربية - نظهر اسمين فقط فى كل صفحة )

تحميل الملفات المفتوحة المصدر

انظر فى قسم الملفات بأسفل الصفحة ستجد نسخة عربية من الكود تحت اسم arabic_vesion

[تحسين] جهة السيرفر

لكى تظهر النتائج معتمدا على رقم الصفحة يجب عليك استخدام نظام start و limit الموجود فى الماى سكل. لذلك يجب عليك حساب نقطة البداية معتمدا على رقم الصفحة وعدد النتائج فى كل صفحة

$page = (int) (!isset($_GET["page"]) ? 1 : $_GET["page"]);
$limit = 2;
$startpoint = ($page * $limit) - $limit;

الان سوف نظهر نتيجتين فقط فى كل صفحة $limit = 2;

عرض النتائج

استخدم هذا الاستعلام كمثال لعرض النتائج:

"SELECT * FROM `records` LIMIT {$startpoint}, {$limit}"

ولكن حتى الان لا يوجد تعدد صفحات! اذن انظر لهذا

تعدد الصفحات

يمكنك الحصول على هذه الدالة من function.php

echo pagination(`records`,$limit,$page);

التفاصيل

pagination($query, $per_page = 10,$page = 1, $url = '?')

المتغير	الوصف
query	الاستعلام الذى نحسب على اساسه عدد الصفحات ( وهو عبارة عن الاستعلام العادى بداية من اسم الجدول ونهاية بنهاية شروط الاختيار ) مثال `records` where `active` = 1
per_page	عدد النتائج التى تريد اظهارها فى كل صفحة
page	رقم الصفحة الحالية ( استخدم $_GET["page"] للحصول عليه من الرابط كمثال )
url	مسار الموقع منتهيا بمتغير ورقم الصفحة مثال: فى حالة استخدام $url = '?' عند الضغط على صفحة رقم واحد ستتحول الى ?page=1, فى حالة $url = '/news/world/' عند الضغط على صفحة رقم واحد ستتحول الى /news/world/page=1

[تحسين] الاشكال والالوان

لجعل تعدد الصفحات ذو شكل جيد عليك استخدام ملفين استيل احدهما يضع الاساسيات والابعاد والثانى يضع الالوان والمؤثرات البصرية

1- الاستيل الاساسى - pagination.css

<link href="css/pagination.css" rel="stylesheet" type="text/css" />

2- ملف التلوين - B_red.css كمثال (توجد بعض امثلة التلوين بالاسفل يمكنك الاختيار)

<link href="css/B_red.css" rel="stylesheet" type="text/css" />

الاستيل أ

اصفراحمر
اخضر

الاستيل ب

احمر
اسود
ازرق

الاستيل ج

اصفر
احمر
اخضر

هل لديك سؤال او مشكلة؟

فى حالة وجود اى سؤال او مشكلة لا تتردد فى طلب المساعدة وامنحنا هذه الفرصة لكى نجيب على اى عدد من الاسئلة او المشاكل او الاستفسارات وفى اقل وقت ممكن فقط عليك استخدام قسم مشاكل وحلول البرمجة

ملفات الدرس: