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

 

عرض حقول الإعدادات في صفحة خيارات القالب

لعمل ذلك سنقوم بالتعديل على دالة  build_options_page التي أنشاناها سابقا حيث سنضبف لها الدوال المسئولة من عرض اقسام وحقول الإعدادات، وهذه هي الدالة في صورتها الجديدة

لاحظ أن التعديل الوحيد الذي تم على الدالة هو بإضافة السطرين 9 و 10 واللذين يحتويان على الدوال التالية:
settings_fields: وهي دالة مسئولة عن إخراج ما يعرف بnonce وهي مخرجات متعلقة بالتشفير والامان وهي خارج موضوعنا لكن فقط عليك معرفة انه يتم مناداة هذه الدالة داخل النموذج داخل وسم form وتمرر لها اسم الحيارات وفي حالتنا هذه هي theme_options
do_settings_sections: وكما يظهر من إسمها هي دالة تقوم بإخراج كل الأقسام المتعلقة بصفحة إعدادات معينة (وبالتالي الحقول التابعة لكل قسم) ومررنا لها إسم صفحة الإعدادات وهي theme_options.

بعد عمل هذه التعديلات على الدالة  build_options_page   ينبغي ان تظهر صفحة خيارات القالب لديك كما موضح في الصورة التالية

لوحة تحكم قالب الووردبريس
وبهذه الطريقة نكون قد أكملنا إنشاء لوحة تحكمنا الصغيرة بنجاح :).

 

إنشاء لوحة تحكم قالب ووردبريس بإستخدام Framework

أظن أن إنشاء لوحة تحكم لقالب ووردبريس سهل نسبيا حيث انك تحتاج فقط الى معرفة بعض الدوال الأساسية التي يوفرها الووردبريس وعموما ما يعرف ب Setting API لكن قد يصبح الأمر مملا خصوصا ان كنت تريد إنشاء لوحة تحكم كبيرة تحتوي على مجموعة كبيرة من الحقول وقد يكون بعض تلك الحقول معقدا ناهيك عن الجهد الذي تحتاج لبذله للتأكد من الأمان والتحقق Security and Validation لذلك في مثل هذه الحالات يلجا كثير جدا من مطوري الووردبريس لإستخدام Framework جاهزة تمكنك من إنشاء لوحة تحكم شاملة ومعقدة في فترة قد لا تتجاوز ساعات فقط !
وتعتبر طريقة إستخدام Framework لإنشاء لوحة تحكم للقالب طريقة عملية وسهلة جدا لعدة أسباب خصوصا مع توفر مجموعة كبيرة من الFramework المجانية مفتوحة المصدر والتي يتم تطويرها ودعمها من قبل مجتمع ووردبريس.
لهذه الأسباب سنقوم لاحقا إنشاء الله بشرح إحدى الFramework المشهورة وكيفية إستخدامها لإنشاء لوحة تحكم للقالب، واليك مجموعة من الFramework المشهورة والتي سنختار إحداها بعد إستشارة المتابعين للموقع لنقوم بشرحها.
1- Option Tree
إطار عمل مفتوح المصدر لإنشاء خيارات القالب ويدعم مجموعة كبيرة جدا من الحقول كما يمكن إستخدامه لإنشاء حقول مخصصة Custom Meta Box للمقالات، والمشروع مدعوم جزئيا من موقع القوالب الشهير ثيم فورست Themeforest

2- Vafpress Framework

أيضا مفتوح المصدر ويوفر مجموعة كبيرة من الحقول المتقدمة كما يوفر إمكانية كبيرة للتحكم في التفاعل ما بين الحقول وكذلك إنشاء حقول مخصصة للمقالات، وانا من أشد المعجبين به حتى انني اعتبره في بعض الاحيان الاول بدون منافس.
3- Redux Framework

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

 

مراجعة لما سبق:
الى هنا نصل الى نهاية هذه السلسلة المبسطة لإنشاء لوحة تحكم لقالب ووردبريس، حيث حاولنا فقط تمليكك المفاهيم الأساسية وشرح لبعض الدوال التي قد تحتاجها وتركنا الباقي لإبداعك في التطبيق.
لكن ما زال لدينا درس عن إنشاء لوحة تحكم للقالب من خلال إستخدام أحدى الFrameworks المذكورة أعلاه لذا لا تنسى ان تساعدنا في إختيار الإطار الذي سنقوم بشرحه من خلال تصويتك في التعليقات.
ولا تنسى أيضا مشاركة المقال مع الأصدقاء المهتمين بووردبريس :)

 

النشرة البريدية

ندعوك للإنضمام إلى 227 مشترك في قائمتنا البريدية

This Post Has 14 Comments

  1. شكرا جزيلا اخي دروس فريدة من نوعها في الويب العربي اتمنى ان تستمر في مثل هذه الدروس وانتظر دروس الفريم ورك بما تراه انت مناسبا

    1. شكرا اخي مهند على مرورك وتشجيعك، وابشر ان شاء الله بإستمرار الدروس.

  2. بسم الله ماشاء الله موضوع رائع وشرح جميل وارى انه الموقع العربى الاول الذى يضع هذ النوع من الشروحات …

    ويفضل ان تختار المنصة المناسبة والاسهل والاشمل :)

    جزاك الله كل خيراً ……

    1. وحزاك اخي محمد
      شكرا على مرورك وتشجيعك :)
      إن شاء الله قريبا سنضع شرح لإحدى المنصات

  3. متى سيتم بدأ وضع الدروس ؟؟؟؟؟؟

    1. مرحبا اخي محمد
      تم نشر الدرس الجديد، لا تنسى ان تعطينا رايك وملاحظاتك فيه
      وأعتذر عن التأخر في الرد

  4. تم متابعة الشرح ومشكور كثير على الخدمة لكن
    لم انجح واعتقد اني لم افهم جيدا لكني
    هذا كود النهائي

    خيارات القالب
    تستطيع تغيير خيارات القالب بما يتناسب معك

    <input name="Submit" type="submit" class="button-primary" value="” />

    <?php
    }
    add_action('admin_init', 'register_and_build_fields');
    function register_and_build_fields() {
    register_setting('theme_options', 'theme_options', 'validate_setting');
    }
    function validate_setting($plugin_options) {
    return $plugin_options;
    }
    $options = get_option('theme_options');echo $options['value'];
    add_settings_field( $id, $title, $callback, $page, $section, $args );
    add_action('admin_init', 'register_and_build_fields');
    function register_and_build_fields() {
    register_setting('plugin_options', 'plugin_options', 'validate_setting');
    add_settings_section('main_section', 'الإعدادات الرئيسية', 'section_cb', 'theme_options');
    add_settings_field('banner_heading', 'الإعلان', 'banner_heading_setting', 'theme_options', 'main_section'); // Banner Heading
    add_settings_field('logo', 'الشعار', 'logo_setting', 'theme_options', 'main_section'); // LOGO
    }
    // Banner Heading Callback function
    function banner_heading_setting() {
    $options = get_option('theme_options');
    echo "”;
    }
    function logo_setting() {
    echo ”;
    }
    function build_options_page() {
    ?>

    خيارات القالب
    تستطيع تغيير خيارات القالب بما يتناسب معك

    <input name="Submit" type="submit" class="button-primary" value="” />

    <?php
    }

    1. السلام عليكم
      تابعت موضوعك في منتدى عرب ووردبريس واظن انك قد تمكنت من حل المشكلة،
      وعلى كل ربما يفيدك الإطلاع على الدرس الجديد
      http://wparaby.com/options-framework

  5. مشكور كثير لكن قبل ابتدي بالدرس القادم
    انا وصلت لنتيجه جيده لكن هناك خطأ
    في نهاية العمل لا يتم حفظ الاعدادات التي يدخلها المستخدم مثل ادخال عنوان نصي ورفع شعار
    بمعنى لمى ارفع صورة شعار هل بالأصل لا يرفعها وعند اعادة التحميل للخيارات اجدها فارغها واعيد ادخال المعلومات مع الصوره ثم اضغط حفظ ويرجع من جديد غير محفوظ
    ====
    <?php
    add_action('admin_menu', 'create_sattam_options_page');
    function create_sattam_options_page() {
    add_theme_page('الخيار الثاني', 'الخيار الأول', 'manage_options', 'sa_options_page', 'ba_options_page');
    }
    add_action('admin_init', 'register_and_ba_fields');
    function register_and_ba_fields() {
    register_setting('ba_group', 'ba_options', 'ba_setting');
    add_settings_section('ba_section', 'الإعدادات الرئيسية', 'ba_cb', 'sa_options_page');
    add_settings_field('banner_heading', 'الإعلان', 'banner_heading_setting', 'sa_options_page', 'ba_section'); // Banner Heading
    add_settings_field('logo', 'الشعار', 'logo_setting', 'sa_options_page', 'ba_section'); // LOGO
    }
    // Banner Heading Callback function
    function banner_heading_setting() {
    $options = get_option('ba_options');
    echo "”;
    }
    function logo_setting() {
    echo ”;
    }
    function ba_options_page() {
    ?>

    خيارات القالب
    تستطيع تغيير خيارات القالب بما يتناسب معك

    <input name="Submit" type="submit" class="button-primary" value="” />

    ===
    راجع اكوادي هل هناك خطأ في الربط ام ما ينقصني حتى تكتمل لوحة التحكم الخاصة

    شاكر لك

  6. طب المشكل مع استعمال Framework هو كثير
    * انت راح تستعمل 1 ميقا من ال Framework لكن راح تستعمل فقط جزء منها لان هته ال Frameworks مبرمجة للتلائم مع اكبر عدد ممكن من الحالات
    * لو غيرت الستايل في ال Framework و حدث هناك تحديث لهذا الاخير راح يجب عليك تعيد الستايل مو ؟
    * تغيير ال Framework او اضافة شيئ عليه امر صعب حيث لازم تفهم طريقة برمجته الاول
    انا استعمل Framework خاص بي قمت بتطويره لاستعمله في مشاريعي و اظن هيك احسن و ادعو كل شخص الي ان يقوم ببرمجة Framework خاص به يخصر وقت في الاول لكن بعد ذلك يربح وقت كبير و تكون عملية التحديث سهلة

    1. شكرا على الموضوع الاول ^^

      1. عفوا،، شكرا على تشجيعك وتسعدني متابعتك

    2. أتفق معك في بعض ما ذكرته
      الframework مناسب إذا ما كنت تبحث عن السرعة وتريد إستخدام بعض الحقول المتقدمة،، ويمكنك الإستغناء عن تحديثاته بدمجه مع القالب الخاص بك،،
      كذلك يوجد حل أخر وهو إستخدام بعض الكلاسات أو الframework الموجهة للمطورين مثل هذا الكلاس https://github.com/tareq1988/wordpress-settings-api-class
      أو كما تفعل أنت يمكنك تطوير framework خاص بك.
      شكرا على افادتك

  7. اشكرك على هذه المعلومات الرائعه

اترك رد

إغلاق القائمة