بسم الله الرحمن الرحيم
السلام عليكم ورحمة الله وبركاته

أهلا بكم إخوانى فى تراديدنت العزيز
...
اليوم سأقوم بتوضيح فكرة عمل لوحة تحكم موقع مشابهة للوحة تحكم نسخة المنتديات الاشهر vBulletin
**
والتى تعتمد بدورها على فكرة الـ frames
**
نقطتين يجب أن تعرفها قبل الخوض فى صلب الموضوع:


  • هذا الموضوع بعيد تماما عن برمجة لوحة التحكم .. وانما هو فقط شرح لكيفية عمل مثل هذه اللوحة.
  • الشرح الذى سأقوم به قد تم شرحه من ذى قبل لكن كانت للوحة تحكم كاملة .. لكن هنا مجرد توضيح لفكرة عملها فقط .

خطوات الشرح:


  • صور توضيحية للنتيجة النهائية.
  • شرح تقسيم الصفحة عن طريق الـ .frames
  • اضافة لمسة جمالية للقوائم الجانبية عن طريق كود Jquery بسيط .
  • بعض النقاط التوضيحية الأخرى.

نبدأ باسم الله


صورة توضيحية للنتيجة النهائية:
نقره لتكبير أو تصغير الصورة ونقرتين لعرض الصورة في صفحة مستقلة بحجمها الطبيعي


شرح تقسيم الصفحة عن طريق الـ .frames

بفرض أن صفحة لوحة التحكم الرئيسية عندنا لها الاسم admin.php

تقوم الفكرة على تقسيم صفحة admin.php الى ثلاث أقسام
كل قسم منهم سيكون صفحة أخرى يتم تضمينها فى frame منفصل
الصورة التالية توضح ما أقصده
نقره لتكبير أو تصغير الصورة ونقرتين لعرض الصورة في صفحة مستقلة بحجمها الطبيعينقره لتكبير أو تصغير الصورة ونقرتين لعرض الصورة في صفحة مستقلة بحجمها الطبيعي
أتمنى أن يكون الامر أصبح واضحا الان

ولتنفيذ ذلك الشكل سنقوم باضافة الكود التالى بين وسمى الهيد فى صفحة admin.php هكذا



<head>
<
frameset cols="*,250" FRAMEBORDER='0' FRAMESPACING='4'>
<
FRAMESET rows="40,*" FRAMEBORDER='0' FRAMESPACING='0'>
<
frame name="top" scrolling="NO" src="header.php" NORESIZE>
<
frame name="left" scrolling="auto" src="main.php" NORESIZE>
</
frameset>
<
frame name="right" scrolling="auto" src="menu.php" NORESIZE>
</
frameset><noframes></noframes>
</
head>

توضيح بسيط للكود
السطر الاول : يقوم بتقسيم كامل الصفحة رأسيا الى جزئين الجزء الايمن 250 بكسل والجزء الثانى هو بقية الصفحة
السطر الثانى : يقوم بتقسيم الجزؤ الرأسى الايسر أفقيا الى قسمين أيضا القسم الاعلى 40بكسل والجزء الاسفل هو باقى الصفحة.

بعد ذلك نقوم بتعيين الصفحات التى أنشأناها سابقا كلا فى مكانها كالتالى


  • صفحة header.php فى الجزء العلوى
  • صفحة menu.php فى الجزء الايمن
  • صفحة main.php فى الجزء الايسر



الان الشكل العام لصفحة لوحة التحكم أصبح جاهزا للتعامل معه

اضافة لمسة جمالية للقوائم الجانبية عن طريق كود Jquery بسيط .
رغم أنها ليست من صلب موضوعنا لكن فضلت أن أقولها لأنها تضيف لمسة جمالية للوحة التحكم

سأشرح باعتبار أنك فى menu.php
تقوم بعمل قوائمك بالكود التالى
كود PHP:
     
                            
<div class="phead">التحكم بالقوائم الجانبية</div>
    <
div class="pbody">
             <
ul>
            <
li><a href="">اضافة قائمة جديدة</a></li>
            <
li><a href="">تعديل القوائم</a></li>
            <
li><a href="">اضافة عناصر للقائمة</a></li>
            </
ul>
        </
div


شرح التأثير
عند الضغط على رأس القائمة تقوم باخفاء محتواها وعند الضغط مرة أخرى تقوم باظهار المحتوى بتأثير جميل

الان لدينا الكلاس الذى استخدمه لعنوان القائمة هو phead
فقط هذا كل ما أريده الان ^^

تابع الكود التالى
كود PHP:
                            <script type="text/javascript">

  [
IMG]http://cdn5.tribalfusion.com/media/37536.gif[/IMG]    
$('.phead').next().hide();
$(
'.phead:first').next().show();
$(
'.phead').click(
    function(){
    $(
this).next().animate({'height':'toggle'}, 'slow' 'swing');    
    }
);
</script> 
لكن سامحونى لن أشرح هذا الكود الان .. ربما فى درس منفصل ^^
طبعا يجب أن تضم مكتبة الجافا فى الهيد باضافة التالى


كود PHP:
                       <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4/jquery.min.js"></script> 

بعض النقاط التوضيحية الأخرى:

النقطة الاولى

والاهم هى كيفية وضع رابط فى صفحة menu.php وعند الضغط عليها تظهر فى صفحة main.php
الأمر بمنتهى السهولة
لنرجع مرة أخرى الى كود الـ frame


كود PHP:
                       <frame name="left" scrolling="auto" src="main.php"  NORESIZE
ستلاحظ خاصية name = left
وهذا ما يهمنا لاحظ كيف سأقوم بعملها

افتح الان ملف menu.php

اكتب فيه الامر التالى


كود PHP:
                       <a target="left" href="">اضافة خبر جديد</a
هل لاحظت هذا؟


كود PHP:
                       target="left" 


اذاً فهمت ما المطلوب ^_*

النقطة الثانية

وهى مهمة أيضاً

انه فى حالة استخدام الـ frames فى لوحة التحكم وجب عليك تضمين ملف الكونفيج لكل ملفات الادمن ولا يقتصر على صفحة الاندكس كما هو موجود فى بعض الطرق الاخرى.

وأخيراً أرجو أن أكون قد وفقت فى الشرح
والسلام عليكم