البحث في الموقع
المحتوى عن 'تطوير ووردبريس للمبتدئين'.
تم العثور على 5 نتائج
-
إذا كنت مهتمًا في تطوير ووردبريس فمن المؤكد أنك قمت بمحاولة تعديل قوالب ووردبريس سواء من خيارات القالب أو قمت بعمل قالب ابن من أجل تعديلات أكثر. تبعًا لتعريف موقع ووردبريس للقالب: مجموعة من الملفات التي تعمل معًا من أجل تشكيل واجهة للمستخدم. في هذا الدرس سوف نتعلم تطوير قوالب ووردبريس، سنبدأ مع الملفات الأساسية التي تشكل قالب ووردبريس وسوف نتقدم لنتعلم عن الحلقات وملفات ووردبريس الافتراضية، لتتمكن من عرض منشوراتك أو صفحات موقعك. بنهاية هذا الدرس سوف تكون قادرًا على بناء قالب ووردبريس الخاص بك. البداية إذا كنت جاهزًا و تملك نسخة ووردبريس تم تنصيبها على خادم محلي على حاسبك الشخصي، لنبدأ و نتعرف أين مكان القوالب في ووردبريس، توجد قوالب ووردبريس عادة في المسار wp-content/themes إذا ذهبت إلى هذا المسار داخل نسخة ووردبريس المثبتة على حاسبك فستجد عدة قوالب افتراضية من ووردبريس. لنقم بإنشاء قالب ووردبريس جديد. هناك بضع خطوات سهلة للقيام بذلك: أنشئ مجلد جديد في المجلد themes وأعطِه اسمًا مميزًا يشبه التالي my-awesome-theme. والآن في هذا المجلد قم بإنشاء ملفين باسم style.css و index.php الآن قم بفتح ملف style.css وانسخ التالي إليه: /* Theme Name: My Awesome Theme Theme URI: https://myawesometheme.awesome Author: Daniel Pataki Author URI: https://danielpataki.com Description: The theme for my awesome site Version: 1.0 License: GNU General Public License v2 or later License URI: http://www.gnu.org/licenses/gpl-2.0.html Text Domain: my-awesome-theme This theme, like WordPress, is licensed under the GPL. Use it to make something cool, have fun, and share what you've learned with others. */ هذه التفاصيل ستظهر بشكل أوتوماتيكي في قسم تفاصيل القالب في شاشة Appearance->Themes في لوحة تحكم ووردبريس. إذا قمت بزيارة قسم Appearance->Themes سوف ترى قالبك بين القوالب المعروضة وأيضًا يمكنك تفعيله. لكن هذا القالب لا يملك أي تعليمات برمجية لذلك سترى شاشة بيضاء عند تفعيله وسنضيف التعليمات البرمجية قريبًا. كيف تعمل ملفات قوالب ووردبريس تعمل قوالب ووردبريس باستخدام صفحات ووردبريس الافتراضية. لأنها بذلك تقلل عدد الملفات التي نحتاجها لكل موقع مقارنة مع html التي تتطلب بناء صفحة مكررة كثيرة. لكن منذ ظهور php ومعالجتها للملفات على الخادم(server) يمكننا أن نوفر مساحة كبيرة في الملفات فمن الممكن أن يكون ملف واحد مسؤول عن عرض المقال المنشور أو عرض الصفحة ويمكن ل php أن تعرف ماذا نريد وبناء على ذلك تستبدل المعلومات في هذا الملف. ها هو مثال لنرى كيف يعمل ذلك: <!DOCTYPE html> <html> <head> <title>A single post template</title> </head> <body> <div id="site-header"> <h1>Welcome to my site</h1> <nav> <ul> <li><a href=''>Home</a></li> <li><a href=''>About</a></li> <li><a href=''>Contact</a></li> </ul> </nav> </div> <div id="article"> <h2 class="article-title"><?php the_title() ?></h2> <div class="article-content"><?php the_content() ?></div> <div class="article-meta">Published on <?php the_time( "Y-m-d" ) ?> by <?php the_author() ?></div> </div> <div id="site-footer"> <nav> <ul> <li><a href=''>Home</a></li> <li><a href=''>About</a></li> <li><a href=''>Contact</a></li> </ul> </nav> <div id="copyright">© Daniel Pataki</div> </div> </body> </html> لاحظ أنك لا ترى محتوى ثابت مكتوب في هذه الملف، بدلًا من أن ترى عنوان المقال سترى دالة ()the_title و هي مسؤولة عن إخراج نص العنوان. هذه الدالة تحدد أي مقال تم طلبه حاليًا من خلال رابط الصفحة وتجلب المعلومات المناسبة من قاعدة البيانات لعرضها. وبذلك قمنا بعمل ملف لأي مقال في الموقع، وتأخذ ووردبريس هذه المرحلة إلى مستوى آخر وتقوم بفصل رأس وتذييل الموقع ووضعها في ملفات منفصلة واستدعائها عندما نريدها وليست نسخ رأس وتذييل الموقع كل مرة نحتاجهم فيها: <?php get_header() ?> <div id="article"> <h2 class="article-title"><?php the_title() ?></h2> <div class="article-content"><?php the_content() ?></div> <div class="article-meta">Published on <?php the_time( "Y-m-d" ) ?> by <?php the_author() ?></div> </div> <?php get_sidebar() ?> <?php get_footer() ?> كيف تعمل قوالب ووردبريس سوف نستعمل مجموعة من ملفات قالب ووردبريس في قالبنا الذي نقوم بصنعه، ما نحتاج لمعرفته هو أسماء الملفات التي تلزمنا لعمل الصفحات الأساسية للموقع وأسماء هذه الملفات محددة في وردبريس من التسلسل الهرمي لملفات قوالب ووردبريس. لنلقي نظرة على أنواع الصفحات التي نحتاجها: الصفحات الأرشيفية مثل (التصنيفات، الوسوم، أرشيفات الوسوم، الناشرين في الموقع) الصفحات الواحدة (المقال الواحد، الصفحة الواحدة، نوع المقال) الصفحة الرئيسية وصفحة كل المقالات صفحة الخطأ صفحة نتائج البحث تسمى هرمية لأن ووردبريس تبحث عن مجموعة من الملفات وتعرض الذي له هرمية أعلى. لنأخذ مثلًا صفحة المؤلف أولاً ووردبريس تبحث عن صفحة باسم هذه المؤلف إذا وجدتها سوف تقوم باستخدامها، لكن إن لم تجدها سوف تقوم بالبحث عن ملف برقم المستخدم وإذا لم تجدها ستتابع البحث عن ملف باسم author.php وإن لم تجده ايضًا ستبحث عن achive.php وإذا فشلت كل المحاولات السابقة سوف تعرض سوف تستخدم ملف index.php والذي هو حتمًا موجود لأنه مطلوب لإنشاء القالب. لاحظ أن ووردبريس تبدأ مع الملفات الخاصة ثم تقوم بالتعميم. وهذا أفضل لأنه يمكنك إنشاء ملف واحد من أجل أن يقوم باستخدامه لعرض المستخدم وهو author.php ولكن ربما تريد عمل ملف خاص لأحد المستخدمين وبذلك يمكنك استخدام اسم المستخدم مثال author-danielpataki.php. لنقم ببناء قالب عند بناء قالب جديد، فمن الأفضل بناء الأساسيات التي سأحتاجها في كل الصفحات. مثل أقسام رأس الموقع(header) وتذييل الموقع(footer). يجب أن يكون ما زال لديك ملفي index.php و style.css اللذان قمنا بإنشائهما، لذا لتبدأ. بناء الأساسيات عادة أقوم بعمل صورة للقالب كي يتم عرضه في لوحة تحكم ووردبريس في تفاصيل القالب. هذ ليس مطلوبًا بشدة عند بناء قالب لكنه يعطيني انطلاقة جيدة وإلهام لما سيكون عليه القالب إذا كان لديك صورة للتصميم فمن الأفضل أن تضعها، أو يمكنك الاستعانة بموقع Unsplash. عندما تحصل على صورة تعجبك، قم بقصها لتصبح بعرض 880px وبطول 660px، قم بتسميتها screenshot.png وضعها في مجلد القالب إذا أردت صورة بسرعة فيمكنك الاستعانة بهذه الصورة التي قم بعملها وتنزيلها من هنا. الخطوة القادمة هي كتابة تعليمات html الأساسية التي ستظهر في كل الصفحات مثل عنصر . لنبدأ بإنشاء ملف header.php داخل هذا الملف سنقوم بلصق تعليمات html كالتالي: <!DOCTYPE html> <html <?php language_attributes(); ?> class="no-js"> <head> <meta charset="<?php bloginfo( 'charset' ); ?>"> <meta name="viewport" content="width=device-width, initial-scale=1"> <link rel="profile" href="http://gmpg.org/xfn/11"> <?php wp_head(); ?> </head> <body <?php body_class(); ?>> الآن سنقوم بإنشاء ملف footer.php الذي سيحتوي وسوم الإغلاق للوسوم المفتوحة في ملف header.php : <?php wp_footer() ?> </body> </html> يجب أن أشير إلى دالتين هامتين و هما ()wp_head و ()wp_footer . عندما تقوم بإنشاء أي قالب يجب وضع ()wp_head مباشرة قبل إغلاق وسم <head> و دالة ()wp_footer مباشرة قبل إغلاق وسم <body> لأن هذا يساعد ووردبريس و الإضافات التي تنصبها على موقعك بوضع روابط ملفاتهم الخاصة هنا. الآن لنعد إلى ملف index.php إذا قمت بزيارة موقعك فستجد صفحة فارغة. هذا لأن ملف index.php فارغ ولم تقم باستعمال ملفات header.php و footer.php بعد. قم بإضافة التعليمات التالية إلى ملف index.php: <?php get_header() ?> My Awesome Theme <?php get_footer() ?> إذا زرت الصفحة مجددًا فيجب أن ترى عبارة "My Awesome Theme" وإذا اطلعت على الشيفرة المصدرية للصفحة فستجد الكثير من الأشياء هناك وليس عليك القلق بشأنها في الوقت الحالي. والآن من المؤكد بأنك ترغب بإضافة تنسيقات بما أن ملف style.css لا يتم استدعائه بشكل تلقائي، وربما تفكر بإضافة ملف style.css كما كنت تفعل عندما تصميم مواقع html ولكن في ورردبريس لا يجب عليك فعل ذلك أبدًا دع هذا الأمر لووردبريس. أنشئ ملف functions.php وأضف التعليمات التالية: <?php add_action( 'wp_enqueue_scripts', 'mat_assets' ); function mat_assets() { wp_enqueue_style( 'my-awesome-theme', get_stylesheet_uri() ); } التعليمات في ملف functions.php تخبر ووردبريس عن ملفات css الخاصة بك و بعدها تقوم ووردبريس باستدعاء ملفات في مكان وضعك لدالة ()wp_head و هذه هي وظيفة دالة ()wp_head أن تستدعي ملفاتك و بعض ملفات ووردبريس في رأس الموقع. الآن يمكنك تجربة وضع بعض التعليمات في ملف style.css ورؤية النتيجة مثل: body {background:red} قبل المتابعة لنضف بعض التعليمات البسيطة إلى ملفاتنا لتصبح أفضل وأجمل: في ملف header.php: <!DOCTYPE html> <html <?php language_attributes(); ?> class="no-js"> <head> <meta charset="<?php bloginfo( 'charset' ); ?>"> <meta name="viewport" content="width=device-width, initial-scale=1"> <link rel="profile" href="http://gmpg.org/xfn/11"> <?php wp_head(); ?> </head> <body <?php body_class(); ?>> <div id="site-header"> <h1><?php bloginfo('title') ?></h1> </div> <div id='site-content'> في ملف footer.php: </div> <!-- site content --> <div id='site-footer'> <p>© My Awesome Theme</p> </div> <?php wp_footer() ?> </body> </html> في ملف style.css: /* Theme Name: My Awesome Theme Theme URI: https://myawesometheme.awesome Author: Daniel Pataki Author URI: https://danielpataki.com Description: The theme for my awesome site Version: 1.0 License: GNU General Public License v2 or later License URI: http://www.gnu.org/licenses/gpl-2.0.html Text Domain: my-awesome-theme This theme, like WordPress, is licensed under the GPL. Use it to make something cool, have fun, and share what you've learned with others. */ html { height: 100%; background:#444; font-family: "Helvetica Neue", Arial, sans-serif; line-height: 1.5em; } #site-header { text-align: center; } #site-header h1 { font-size:32px; color: #ffffff; font-weight: 300; letter-spacing: 1px; } #site-content { max-width:625px; background: #fff; margin: 0 auto; padding: 22px; border-radius:5px; } #site-footer { color: #fff; text-align:center; font-size:12px; text-transform: uppercase; } الآن كل صفحة ستقوم بزيارتها في موقع ستبدو نفسها لأننا فقط نملك index.php والذي سترجع إليه ووردبريس عند عدم وجود أي صفحات. فهم حلقة ووردبريس الحلقة هي أساس عمل كل الصفحات في ووردبريس. لأن الحلقة تحوي المعلومات التي ستعرض على الصفحة. ووردبريس تعرف ماذا يجب أن تحتوي كل صفحة، وتعرف هذه من روابط الصفحات مثلًا صفحة المقال الواحد يجب أن تحتوي مقال واحد وصفحتك الرئيسية يجب أن تحتوي أحدث 10 مقالات وهذا كله تعرفه ووردبريس. هذه المعلومات يتم جلبها من قاعدة البيانات بشكل أوتوماتيكي وكل ما عليك القيام به هو تفعيل الحلقة من أجل عرض البيانات من الأفضل شرح هذا بمثال أضف هذه التعليمات إلى ملف index.php: <?php if( have_posts() ) : ?> <?php while( have_posts() ) : the_post() ?> <h2><a href='<?php the_permalink() ?>'><?php the_title() ?></a></h2> <div class="content"> <?php the_content() ?> </div> <?php endwhile ?> <?php else : ?> <p>Oh No, there are no posts!</p> <?php endif ?> عندما تنسخ هذه التعليمات وتزور صفحتك الرئيسية ستكتشف قوة ووردبريس وسحر قوالبها، سوف ترى قائمة مقالاتك التي قمت بإضافتها في لوحة تحكم ووردبريس. إذا قمت بالضغط على عنوان المقال سوف تذهب إلى صفحة تعرض لك هذا المقال بالرغم من أنك لم تقم بعمل صفحة للمقال الواحد. لنحلل التعليمات البرمجية ونرى كيف تعمل. كل هذا يبدأ مع عبارة if التي تتحقق من قيمة دالة have_posts(). هذه الدالة ستعيد قيمة true إذا كان هناك مقالات وقيمة false إذا لم يكن هناك مقالات لعرضها. كما ترى من عبارة else إذا لم يكن هناك مقالات فإننا نعرض رسالة للمستخدم بأنه ليس هناك مقالات. إذا كان هناك مقالات فإننا ننشئ حلقة while والتي لن تتوقف عن تنفيذ التعليمات التي بداخلها ما دامت دالة ()have_posts ترجع قيمة true. الدالة الأولى التي نستخدمها هي دالة ()the_post والتي تقوم بإعداد بعض البيانات لنا وتكمل الحلقة بعد ذلك، إذا كنا قد وصلنا للمقال الأخير هذا يعني أن دالة have_posts() ستعيد لنا false في المرة القادمة وبذلك تتوقف الحلقة و يتم تنفيذ التعليمات البرمجية التالية إذا كان هناك تعليمات باقية. عند عرض المقال، قمت بإضافة العنوان والمحتوى الكامل للمقال. لقد قمت باستخدام دالة ()the_permalink للحصول على رابط المقال، دالة ()the_title لعرض العنوان ودالة ()the_content لعرض محتوى المقال كاملًا. هذه الدوال تستخدم داخل حلقات ووردبريس وسوف تحدد المقال المطلوب كما هو متوقع. هكذا يبدو موقعي الآن: من الآن وصاعدًا عرض المقال بطرق مختلفة هي مسألة معرفة الدوال التي تستخدمها ووردبريس وإضافة بعض تعليمات CSS لجعل قالبك رائع، إليك بعض الدوال المفيدة التي تساعدك في عرض التصنيفات، الوسوم، تاريخ المقالات وأكثر من ذلك. القوالب وعبارة if ماذا تفعل إذا أردت عرض مقتطف من المقالات في الصفحة الرئيسية وكامل المقال في حال عرض المقال الواحد؟ في هذه الحالة لديك خيارين استخدام الدوال الشرطية التي توفرها ووردبريس أو عمل ملف قالب جديد. الدوال الشرطية التي توفرها ووردبريس تستخدم للتحقق من أشياء عديدة، على سبيل المثال إذا أردت معرفة إذا كنت تعرض مقال واحد أو عدة مقالات، إليك اللائحة الكاملة لهذه الدوال على موقع ووردبريس بمساعدة دالة ()is_singular يمكننا فعل التالي: <?php get_header() ?> <?php if( have_posts() ) : ?> <?php while( have_posts() ) : the_post() ?> <h2><a href='<?php the_permalink() ?>'><?php the_title() ?></a></h2> <div class="content"> <?php if( is_singular() ) : ?> <?php the_content() ?> <?php else : ?> <?php the_excerpt() ?> <?php endif ?> </div> <?php endwhile ?> <?php else : ?> <p>Oh No, there are no posts!</p> <?php endif ?> <?php get_footer() ?> الحل الآخر هو استخدام ملفين منفصلين index.php لعرض مقتطفات من المقالات وملف single.php لعرض المقال كاملًا. من المؤكد أنك تسأل أي طريقة هي الأفضل؟ ليس هناك إجابة واضحة لهذا السؤال لأنه يعتمد بالدرجة الأولى على ما تريد إنجازه. في الواقع، عرض جميع المقالات وعرض المقالة الواحدة مختلف بما يكفي لعمل ملفين منفصلين، ولكن هناك بعض القوالب التي تطبق الطريقتين. وبعض القوالب تذهب أبعد من ذلك وتقوم بإنشاء ملف خاص بالحلقة فقط. لأن هذا سيجعل التعليمات نفسها تستخدم من قبل جميع الصفحات بدلًا من نسخ الحلقة في كل مكان نريد تواجد الحلقة فيه. لنلقي نظرة على ملف index.php المعدل: <?php get_header() ?> <?php if( have_posts() ) { while( have_posts() ) { the_post(); get_template_part( 'template-parts/content', '' ); } } else { get_template_part( 'template-parts/content', 'none' ); } ?> <?php get_footer() ?> قمت بوضع كل محتوى المقال في ملف مختلف. دالة ()get_template_part تجلب المحتوى من ملف وتجمع الوسيط الثاني مع الأول بإضافة “-” للمسار. في حالة الاستدعاء الثاني داخل عبارة else الدالة ستحاول استدعاء ملف template-parts/content-none.php، في الاستدعاء الأول لهذه الدالة تركت الوسيط الثاني فارغًا وهذا سيستدعي template-parts/content.php. في ملف single.php، سأضيف نفس التعليمات ولكن سأضيف كلمة single للوسيط الثاني من دالة ()get_template_part . أخيرًا لنقم بعمل مجلد template-parts وبداخله 3 ملفات: content.php و content-single.php وcontent.php وأقوم بنسخ تعليمات الحلقة المناسبة لكل ملف على سبيل المثال ملف content.php سيبدو كالتالي: <h2><a href='<?php the_permalink() ?>'><?php the_title() ?></a></h2> <div class="content"> <?php the_excerpt() ?> </div> غطينا في هذا الدرس ما يكفي لعمل قالب بسيط، وهذا سيمكّنك من عرض مقالاتك بالطريقة التي تعجبك بتنسيقاتك الخاصة. ترجمة -وبتصرّف- للمقال WordPress Development for Beginners: Building Themes لصاحبه Daniel Pataki -
هل أنت مهتّمٌ بإنشاء إضافة ووردبريس خاصّة بك من الصّفر؟ إن لم تكُن قد قمت ببرمجة إضافة خاصّة بك من قبل فقد يبدو لك ذلك كالتوغل في عالم مجهولٍ، خاصّة إن لم تكُن تثق بمهاراتك في لغة PHP. التحدّي الذي ستواجهه سيكون معرفتك من أينَ ستبدأ، بالإضافة إلى قدرتك على تقبّل إمكانيّة ارتكابك لعدّة أخطاءٍ طيلة مسار التعلّم. الإضافات تسمح لك بإضافة جميع أنواع الوظائف الممكنة للووردبريس، انطلاقًا من إضافة استمارة تواصلٍ بسيطةٍ إلى صفحة ما لتعزيز حماية موقعك وُصولًا إلى إضافة قدرات تجارةٍ إلكترونية. تقريبًا يوجد إضافة لأيِّ شيءٍ يخطُر على بالك، إن لم يكن كذلك فيمكنك دائمًا إنشاء واحدة وفق تصوّراتك وحاجاتك. في هذا الدّرس ستتعلّمٌ طريقة برمجة إضافتك الخاصّة لكي تتمكّنً من تعديل وظائف: موقعك الووردبريس أو الإضافات الأخرى أو حتّى القوالب إن أردت. المعلِّقات، الأفعال و المرشِّحات (Hooks, Actions, Filtres ) قبل البدء بإنشاء إضافة خاصّة، فلنبدأ أوّلًا بإلقاء نظرةٍ مفصّلةٍ على المعلِّقات "hooks"، الأفعال "actions" والمرشِّحات "filtres". إنّها تلك العناصر التي يترّكز عليها نظام الإضافة بالكامل والتّي ستُساعدك بشكلٍ كبيرٍ لفهم ما يحدث خلف الستار حول طريقة عمل الووردبريس. لنلقِ نظرة على هذا المثال. ماذا لو أردتَ إنشاء إضافةٍ تقوم بإضافة شفرة تتبُّع تحليليّةٍ لموقعك؟ في العادة هذا النوع من البرمجيّات يتمُّ إضافته في نهاية صفحة الموقع مباشرة فوق وسمِ الإغلاق. هذه الشفرة يجب أن تبقى في ذلك المكان حتّى وإن تمّ تغيير القالب ويجب أن تعمل على أيّ موقع ووردبريس، إذًا كيف ستجعل هذه الشفرة تعمل دائمًا إن لم تكن لديك أية سلطة تحكّم مباشر على القوالب؟ تذكّر أنّه في درس تطوير ووردبريس للمبتدئين: برمجة القوالب قمت بذكر دوال ()wp_head و ()wp_footer و الطريقة التي يجب عليك إضافتها بها في قالبك. مثالنا هذا يبيّن بالتحديد لماذا يجب أن توضع هذه الدّوال بالطريقة المحدّدة سلفًا. دالّة ()wp_footer يمكنها أن تقوم بتشغيل دوالٍّ أخرى محدّدة بواسطة الإضافات. إليك مثال كود يمكنك أن تستمتع بالتجريب عليه: <?php function my_tracking_code() { echo 'Paste tracking code from Google Analytics here'; } add_action( 'wp_footer', 'my_tracking_code' ); لنقم الآن بتفكيك الكود قطعةً قطعة. أوّلًا لقد قمت بكتابة دالّة تقوم بطبع شفرة التتبّع. هذه الدالّة غيرُ مستخدمة في أيّ مكان، هي فقط موجودة بإضافتي. بعد ذلك استخدمت دالّة ()add_action لإخبار الووردبريس متى يجب تشغيل الدالّة. متى ما وجد ووردبريس بدالّة ()wp_header فإنّه سيجد كلّ الدّوال المعلّقة بها بواسطة ()add_action . عندئذٍ سيقوم الووردبريس بتشغيل هذه الدّوال واحدة بواحدة وصولًا إلى دالّتنا التي تقوم بطبع شفرة التتبّع كنتيجة. هذا هو أساس المعلِّقات "hooks" ولكنّنا سنخوض فيها بشكلٍ أعمق لاحقًا خلال هذا الدَّرس لكي تتعلّم عنهم أكثر وتكون قادرًا على استغلال قدراتهم بشكل أفضل. قبل الانتقال إلى شيء آخر أريد ان ألفت انتباهك الى شيء مهم، دالة ()wp_footer الموجودة في تذييل القالب ليست معلِّقا "hook" بل هي في الحقيقة مجرّد دالّة تحتوي على معلِّق في مكان ما بداخلها. للنداء على معلِّق "hook" نستخدم (’do_action(’wp_footer، لكنّ هذا لم يكن مهمًّا في المثال الأوّل. على كلٍّ ستفهم أكثر عن هذا قريبًا! المصطلحات الآن وبعد أن أخذت لمحةً عمَّا سنتحدث عنه، دعني أشرح لك بطريقةٍ مرتّبةٍ المصطلحات التي ستلتقي بها طيلة هذا الدّرس. المعلِّقات "hooks" هي جزء من API إضافات الووردبريس. الأفعال والمرشِّحات "Actions and Filtres" عبارة عن نوع مختلف من المعلِّقات. الأفعال "actions" تسمح لك بإضافة وظائف، أنت في الأساس ستقوم بتحديد دالّة تشتغل في كلّ مرّة يقوم ووردبريس بمعالجة المعلِّق "hook" . المرشِّح "filter" يعمل بشكل مماثل و لكنّه عوض أن يضيف دوالًّا جديدة يقوم بتعديل الدوّال الموجودة مسبقًا بالووردبريس. مثلًا ووردبريس يحتوي على معلِّق يحدّد طول المقتطف إلى 55 كلمةٍ، يمكنك تعديل ذلك باستخدام المرشِّح لجعل عدد كلمات المقتطف أيَّ رقم ترغب به. كلًّ شيءٍ عن الأفعال: الآن وبعد أن صِرنا نعرف القواعد، فلنلقِ نظرةً مفصّلةً على دالّة ()add_action لفهمها بشكلٍ أفضل. هذه الدّالة تأخذ أربعة معاملات هم: اسم المعلِّق. اسم الدالّة التي نريد إضافتها للمعلِّق. الأولويّة. المعاملات المقبولة. لقد سبق وأن ألقينا نظرةً على أوَّل مُعاملين اللّذان هما في الحقيقة المُعاملان الوحيدان الاجباريّان بحيث يقومان بتحديد الدّالة المراد إضافتها والمكان المراد تشغيلها به. المُعامل الثالث يقوم بتحديد ترتيب الدوّال التي يتمّ تشغيلها. فائدة هذا المُعامل تظهر عندما تريد إضافة عدّة دوالٍّ إلى نفس المعلِّق. يمكنك مثلًا إضافة عدَّة شفرات تتبُّعٍ لموقعك وباستخدام مُعامل الأولوية يمكنك التحكُّم بأيّ دالّةٍ سيتمُّ تشغيلها أوّلًا. المُعامل الرّابع يخبر الووردبريس عدَد المعاملات التي تقبلها الدالّة المراد تعليقها. يجب عليك إلقاء نظرة في دليل الووردبريس لِمعرفة إن كان يتوّجب عليك وضع قيمة هنا لأنّ لكلِّ معلِّقِ خصائصه. بعض الدّوال قد تأخذ أكثر من معاملٍ، في هذه الحالة سيكون عليك أنّ تحدّد ذلك هنا. ألقِ نظرةً على المثال أدناه لكي تعرف لِما سيتوجّب عليك استخدام هذه الطريقة عند إنشاء معلِّقاتك الخاصّة لاحقًا. مثال عن فعل ووردبريس لا يوفّر الأفعال للقوالب فقط ولكن أيضًا لواجهة المدير إضافةً إلى أفعال خاصّة بالمستخدمين. معلِّق publish_post يتم تشغيله في كلِّ مرّةٍ يتم نشر مقال ما ليسمح لك بالقيام بشيءٍ ما في تلك المرحلة. الحاجة للمُعاملات تصبحُ ظاهرةً هنا. إذا قمتُ بإضافة دالّةٍ لهذا المعلِّق فكيف لي أن أعرف أيَّ مقالٍ تمَّ نشرهُ وماذا كانت تفاصيلهُ؟ عند قراءة دليل استخدام المعلِّقات يُمكنك أن ترى أنَّ الدالّة تحتوي على معاملين: مُعامِل معرِّف المقال ومُعامِل بيانات المقال. مثلًا لِنقم بإرسال بريدٍ إلكترونيٍّ لكاتب المقال عندما يُنشر مقاله: <?php function our_author_notification( $id, $post ) { $author = $post->post_author; $name = get_the_author_meta( 'display_name', $author ); $email = get_the_author_meta( 'user_email', $author ); $link = get_permalink( $id ); $message = 'Hello ' . $name . ", \n\n" . "Your artcile <a href='" . $link . "'>" . $post->post_title . "</a> has been published."; wp_mail( $email, 'One of your posts has been published', $message ); } add_action( 'publish_post', 'our_author_notification', 10, 2 ); كلًّ شيءٍ عن المرشِّحات: كما سبق وأن ذكرته سابقًا، المرشِّحات تعمل بشكلٍ مماثلٍ للأفعال ولكنّها تقوم بتعديل البيانات لذا ستجد نفسك تقوم بإرجاع نتائج داخل دوالّك المعلّقة. لإضافة مرشِّح نستخدم الدالّةَ ()add_filter التي ستستخدم نفس معاملات الدالّة ()add_action. مثال عن مرشِّح: أحسن مثالٍ للبدء به سيكون تعديل كلمة “قراءة المزيد” الموجودة بِنهاية المقتطف، في الوضع الافتراضي ستجدها بهذا الشَّكل "[…]". لتعديلها يمكنك القيام بشيء مثل هذا: <?php function our_excerpt_more( $more ) { return '... هناك المزيد'; } add_filter( 'excerpt_more', 'our_excerpt_more' ); لاحظ أنّني لم أحدّد مُعامل الأولويّة ولا مُعامل عدد المُعاملات المقبولة. هذا سيجعل الأولويّة 10 وعددُ المُعاملات المقبولة 1. هنا أنا لا أستخدم المعامل المُمرَّر في الدالة more$ إطلاقًا، أنا فقط أقوم بإرجاع نص خطّيٍ. يمكنك استخدام نفس الطريقة لتضمين إعلانٍ قبل الفقرة الأولى من مقالك. انظر الى المثال التالي: function in_content_ad( $content ) { $ad = '<div class="in-content-ad"><img src="https://placeholdit.imgix.net/~text?txtsize=33&txt=Advertisement&w=250&h=250"></div>'; return $ad . $content; } add_filter( 'the_content', 'in_content_ad' ); مع قليل من الـ CSS لتعويم الإعلان نحو اليمين، يُمكنك الحصول على صندوقِ إعلاناتٍ قياسيٍّ داخل محتوى مقالك خلال ثوانٍ معدودة. تعريف المعلِّقات: معرفة كيفيّة تعريف المعلِّقات إضافة إلى معرفةِ الطريقة التي تُنشِئ بها معلِّقاتك الخاصّة سيكون له أثرٌ كبير على فهمك لنظام ووردبريس. فلنفترض أنَّك تريد إنشاء إضافة متجر إلكتروني وأنّك ستقوم بإضافة وظائف لقائمة المنتجات، يمكنك القيام بشيءٍ مشابه لهذا: <?php $products = get_products( 10 ); show_products(); هنا أنت قمت بكتابةِ برمجيّتك بطريقة "إجباريّة" لكي تقوم بعرض فقط 10 منتجات. ولكن ماذا لو حاول شخص ما صنع إضافة لعملك وأراد أن يُظهر فقط ثلاثة منتجات؟ لو أنّك كتبك برمجيّتك بذكاء فإنّك ستسمح للأخرين بتعديلها. دعنا نستخدم معلّقًا للسماح للمطوّرين باستخدام عملنا وتطويره: <?php $product_count = apply_filters( 'product_count', 10 ); $products = get_products( $product_count ); show_products(); باستخدام دالّة ()apply_filters نحن نقوم بإخبار ووردبريس أنّ عندنا معلِّقًا اسمه product_count و أنّنا نريد أن نشغّل جميع الدّوال المربوطة به. في أيّة إضافة أخرى، يمكن للمطوّر أن يغيّر قيمة عدد المنتجات الظاهرة إلى ثلاثةٍ مثلًا باستخدام الطريقة التالية: <?php add_filter( 'product_count', 'carousel_product_count' ); function carousel_product_count( $count ) { return 3; } سنتابع في الدرس القادم أساسيات إنشاء الإضافة وكيفية إضافة خصائص القالب للإضافات… ترجمة -وبتصرّف- للمقال WordPress Development for Beginners: Building Plugins لصاحبه Daniel Pataki -
إذا أردت أن تصبح مطوّر ووردبريس فهذا يتطلب أيضًا تعلم لغة البرمجة الشهيرة PHP، والتي بنيت من خلالها منصة ووردبريس. طورت بشكل أساسي في عام 1994، PHP لغة برمجة قوية ومفتوحة المصدر لإنشاء مواقع ويب ديناميكية وتفاعلية. سوف تتعلم القواعد الأساسية للغة PHP وكيفية كتابتها، وكيفية عملها، والاطلاع على بعض الأمثلة. ما هي PHP؟ PHP هي لغة برمجة نصية من طرف الخادم (server). لفهم ما يعني هذا، لنقارنها مع Html. عندما تزور صفحة Html بسيطة، يقوم متصفحك بإرسال طلب للخادم الذي يحتوي هذه الصفحة التي تحاول الوصول إليها. الخادم يكتشف أي ملف تريد الوصول إليه ويقوم بإرساله لك. متصفحك يترجم شيفرة Html المرسلة ويعرضها لك. بالمقارنة، عندما تزور صفحة PHP هناك خطوة إضافية متصفحك يقوم بإرسال طلب والخادم يجد الملف الذي تريده. قبل إرساله لمتصفحك، الخادم يعالج الملف، منتجًا مخرجات Html نهائية (Html output) ثم يقوم بإرسال هذه المخرجات لمتصفحك الذي يقوم بعرضها كالمعتاد. لهذا السبب عندما تنظر إلى الشيفرة المصدرية لأي موقع لا ترى أبدًا أي شيفرات PHP، فقط Html، حتى لو كان الموقع مكتوبًا بلغة PHP. إذا لماذا يحتاج الخادم إلى عملية المعالجة؟ ما المغزى من ذلك؟ لأنه يمكننا من عمل مواقع ديناميكية وكتابة شيفرات بفعالية كبيرة. لنستعرض مثالين بسيطين. في Html كل شيء ثابت (static). يمكنك إنشاء صفحة تعرض كلمة “Good morning” أو “Good evening” لكنك لا تستطيع إظهار واحدة وإخفاء الأخرى اعتمادًا على التوقيت الحقيقي لليوم. في PHP تستطيع عمل ذلك لأن الخادم يمكنه معالجة التعليمات البرمجية آخذًا التوقيت الحقيقي لليوم بعين الاعتبار. والمنطق لهذا المثال يكون كالتالي: if it is before 10am { <h1>Good Morning</h1> } if it is after 6pm { <h1>Good Evening</h1> } otherwise { <h1>Good Day</h1> } طبعًا هذه ليست التعليمات البرمجية الحقيقية، لكنها تتبع منطق PHP. الخادم سيحدد أي حالة هي الحالة المحققة للشرط وسيعرض واحدة فقط من العناوين. مثال آخر هو موقع تويتر أو أي موقع آخر الذي يقدم المحتوى المكتوب من قبل المستخدمين. إذا كان تويتر يستخدم Html فقط، أحد ما يجب عليه أن يقوم بوضع تغريدتك في ملف Html في كل مرة تقوم بتغريدة جديدة وهذا طبعًا ليس استغلالاً جيدًا للوقت. يوجد حوالي 1 مليار حساب على موقع تويتر لذلك الشركة ستحتاج إلى 1 مليار ملف Html، ملف لكل مستخدم. مع PHP، مشكلة إعادة توليد ما ينشره المستخدم يمكن أن يحل بعدة ملفات. سنعود إلى هذا المثال لاحقًا في هذه المقالة. البداية قبل أن نبدأ، أود التنبيه على أنه في المراحل الأولى من تعلم PHP ربما لن تكون على قادرًا على إنشاء موقع ويب. هذه ردة فعل طبيعية وهذا أيضًا ما شعرت به عند بداية تعلم PHP. الخطوات الأولى تجريدية قليلاً، لكن في نهاية هذا المقال سترى النور. من أجل اختبار وممارسة ما سوف تتعلم في هذه المقالة، سوف تحتاج إلى خادم أباتشي (Apache server). يمكن أن يكون هذا موقع اختبار عبر الإنترنت ولكن يمكن أيضًا أن يكون خادم محلي. أوصي بإنشاء خادم محلي (local server). وإليك كيفية القيام بذلك: أولاً، عليك تحميل وتثبيت Virtualbox وVagrant. إنشاء مسار في أي مكان على كمبيوترك لتخزين ملفات المشروع. لدي مجلد “websites” في مسار المستخدم الخاص بي، قمت بإنشاء مسار “PHPtutorial”. وسوف أشير إلى هذا باسم “مجلد المشروع الرئيسي” طوال بقية هذا المقال. بمجرد إنشاء المسار، افتح terminal على linux أو osx، أو cmd على windows، وانتقل إلى المجلد. إذا قمت بإنشاء بنية المجلد نفسه كما لدي، على linux أو osx يمكنك كتابة cd ~/websites/PHPtutorial على windows cd %HOMEPATH%/websites/PHPtutorial عندما تكون في المسار الصحيح، ألصق الأمر التالي: curl -L -o 'install.sh' http://bit.ly/1hBfq57 && curl -L -o 'Vagrantfile' http://bit.ly/1mE3Qt9 && vagrant up وبمجرد تنفيذ الأمر، سوف تكون قادرًا على الوصول إلى الموقع الخاص بك على http://192.168.33.21. إذا قمت بإعادة تشغيل جهاز الكمبيوتر الخاص بك، سوف تحتاج أيضًا إلى إعادة تشغيل الخادم الخاص بك، والتي يمكنك القيام به عن طريق الانتقال إلى مجلد المشروع الرئيسي في سطر الأوامر وكتابة vagrant up. ملف المشروع الرئيسي هو الآن المجلد الجذر الخاص بك. قم بإنشاء ملف index.html هناك مع أي محتوى، وينبغي أن يتم عرضه بشكل صحيح عند زيارة موقع الويب الخاص بك على http://192.168.33.21. الخطوات الأولى في البداية، لنلقِ نظرة على الوسوم(tags)، المتغيرات(variables)، القيم (values)، والإظهار (echoing). أنشئ ملف اسمه index.php في ملف المشروع الرئيسي واكتب”Hello HTML” بداخله. للتأكد بأنه يعمل قم بزيارة http://192.168.33.21، ويجب رؤية النص الذي قمت بكتابته على شاشة المتصفح. قاعدة مهمة جدًا وهي أن ما يكتب داخل وسوم php يعتبر شيفرة PHP، وأي شيء آخر يعتبر Html. لذلك ظهر نص Hello HTML. وسوم php تبدأ ب<?php وتنتهي ب ?>. أي شيء بين هذين الوسمين يعتبر PHP. Hello HTML <?PHP echo "Hello PHP"; ?> التعليمات البرمجية السابقة أظهرت كيف يتم استخدام وسوم php وكيفية إظهار القيم على الشاشة. عندما تُظهر قيمة أنت تخبر PHP لعرض هذه القيمة على الشاشة. نتيجة تنفيذ التعليمات البرمجية السابقة سيكون ” Hello Html Hello PHP” . الجزء الأول يعتبر Html لأنه لم يكن داخل وسوم PHP بينما الجزء الثاني قد تم إظهاره بواسطة شيفرة PHP. لاحظ أنه يجب إحاطة النص بإشاراتي اقتباس. المتغيرات(variables) تسمح لك بتخزين القيم بدون عرضها. المتغيرات يتم استخدامها بكثرة لتخزين العديد من الأشياء. لنلقي نظرة على مثال بسيط: <?PHP $name = "Daniel"; echo $name; ?> في التعليمات البرمجية السابقة قمت بتخزين قيمة “Daniel” في متغير يدعى name$. بدلاً من إظهار “Daniel” بشكل مباشر، الآن أنا أظهر قيمة name$ مهما كانت. من الوهلة الأولى تبدو لك كزيادة في التعليمات البرمجية بدون فائدة لكن إذا كنا نستعمل هذا المتغير في أكثر من مكان يمكننا تغيير كل شيء بتغيير قيمة هذا المتغير في مكان واحد، بدلاً من تغيير تلك القيم في كل مكان وُضِعت فيه. لاحظ أن الفصل بين أسطر الشيفرات يكون بوضع فاصلة منقوطة (;). إذا أنتجت شيفرتك خطأ فهناك احتمال أنك نسيت وضع فاصلة منقوطة في مكان ما، خطأ شائع ومحبط لكثير من المبرمجين في كل مكان. القيم(values) يمكن أن تكون عدة أنواع. لحد الآن تعرفنا على واحد من هذه الآنواع وهو النوع النصي. النص هو سلسلة من المحارف ويجب إحاطته بإشارتيَ اقتباس (“). نوع آخر وهو النوع الرقمي. الرقم هو أي عدد كامل ولا يجب وضعه ضمن اشارتي اقتباس وإلا سيعتبر نصًا. واحدة من أهم أنواع القيم المصفوفات(array). المصفوفات تخزن عدة قيم، والتي من الممكن أن تكون قيمًا من أنواع مختلفة. <?PHP $name = 'Daniel'; $age = 30; $interests = array( 'guitar', 'singing', 'squash', 'running', 'board games' ); ?> كما ترى يمكن تعريف المصفوفة على الشكل التالي (array(value1 , value2 , value3. يجب كتابة القيم دائمًا في المصفوفة كما تكتب خارج المصفوفة. النص يجب أن يكون محاطًا بإشارتيَ اقتباس (“)، الرقم غير محاط بشيء وهكذا. مثال بسيط إذا بماذا يمكن استخدام ما تعلمناه للآن، ما تعلمناه للآن لا يمكنه إنشاء موقع بعد ولكن حتمًا نحتاج لمثال عملي الآن. لنلقِ نظرة على شيفرة لتطبيق توقعات الطقس: <?PHP $unit = "C"; $temp = 29; if( $unit == 'F' ) { $temp = $temp * 9 / 5 + 32; } $forecast = "The weather today will be great, a Sunny " . $temp . $unit; echo $forecast; ?> هناك بعض الأشياء الجديدة في هذه التعليمات البرمجية، لكن أعتقد أن المثال يشرح نفسه بوضوح. لنراجعه سطرًا بسطر. في البداية، نقوم بإنشاء متغيرين: أول متغير عبارة عن نص يحمل القيمة “C” للمئوية، والمتغير التالي هو عدد صحيح، 29، والذي يهدف إلى تخزين درجة الحرارة الفعلية. الأهداف هنا بسيطة: عرض النص الذي يخبرنا درجة الحرارة الحالية باستخدام القيمة من متغير درجة الحرارة لدينا في وحدة قياس حسب الاختيار، مئوية أو فهرنهايت. السطر التالي هو عبارة if، التي يتم تنفيذ ما بداخلها فقط إذا كانت القيمة داخل الأقواس صحيحة. الشرط هو: $unit == 'F' الذي يترجم منطقيًا كالتالي: إذا كانت قيمة واحدة القياس هي F و هي ليست كذلك و بالتالي سيتم تخطي كتلة هذا الشرط و ما بداخله بدون تنفيذ. في السطر الأخير متغير forecast$ الذي يحوي عبارة “The weather today will be great, a Sunny “ . اعتمادًا على قيمة متغيري unit$ و temp$ ستكون النهاية مختلفة، النقاط بين النصوص والمتغيرات تجمع المتغيرات مع النصوص أو تدمجها. لذا ببساطة سيتم استبدال قيمة temp$ بـ 29 و unit$ بـ C والمخرجات النهائية ستكون: The weather today will be great, a Sunny 29C الآن، ماذا يحدث إذا غيرنا قيمة unit$ إلى F، في البداية سوف يتم تنفيذ التعليمات البرمجية داخل if لأن شرطها تحقق وأصبحت صحيحة، وهذا يعني أن كل شيء بين الأقواس المجعدة سيتم تنفيذه أيضًا. في المثال، اسندت قيمة جديدة لمتغير temp$. أخذت القيمة الأصلية، وتم ضربها في 9، وتقسيمها من على 5 وإضافة 32 وهذه هي المعادلة لتحويل مئوية إلى فهرنهايت. يجب أن تكون القيمة الجديدة لـ temp$ هي 84.2، والقيمة الجديدة unit$ هي F الآن سيتم استبدال المتغيرات بقيمها في الجملة النهائية فتصبح: The weather today will be great, a Sunny 84.2F هذا المثال لا يزال غير مجدٍ بعض الشيء بالنسبة لنا، لكنه يبدأ في إظهار قوة PHP. لاحظ كيف وصلنا إلى الناتج النهائي عن طريق استبدال المتغيرات ببساطة مع القيم. فهو يساعد على الوصول إلى عقلية “replacing placeholder” لأنه هو أساسًا ما تدور حوله لغة PHP. في مثال حقيقي، سنقوم باستخدام القيم الجوية الحالية وبدلًا من كتابة جملة The weather today will be great, a Sunny سوف نستخدم الظروف الفعلية. وقد نرغب أيضًا في التنبؤ غدًا أو في اليوم التالي، مما سيؤدي إلى استبدال “today” بنص آخر. وبالإضافة إلى ذلك، من الواضح أن درجة الحرارة الحالية من الصعب أن تكون مكتوبة يدويًا في الشيفرة البرمجية، فإنه سيكون من الضروري أن يتم استرجاعها من مكان ما. على الرغم من أن هذا يضيف بضع طبقات من التعقيد، لكن المبدأ سيكون نفسه وهو أن نجلب البيانات من مكان ما ونضعها في مخرجاتنا. عبارة if والحلقات الشرطية loops لقد رأينا بالفعل عبارة if في مثال حقيقي. تقوم عبارة if بالتأكد من الشرط داخل الاقواس. إذا كانت النتيجة صحيحة تتم معالجة التعليمات البرمجية داخل الأقواس المجعدة وإلا فأنه لن يتم تنفيذ التعليمات. عبارة if أيضًا ذات صلة مع else if و else. عبارة else if تكتب دائمًا بعد عبارة if. إذا كانت عبارة if غير محققة سيتم التأكد تاليًا إذا كانت عبارة else if محققة، و يمكن أن يكون لدينا عدد غير محدد من عبارات else if بناءً على نفس المنطق. و أخيرًا لدينا عبارة else التي سيتم تنفيذها عندما تكون جميع الشروط التي تسبقها غير محققة، و ليس من الضروري أن يسبق عبارة else عبارة else if يمكنك فقط استعمال عبارة if و else مع بعضهما. لنلقِ نظرة على الأمثلة التالية للتوضيح: // Simple if Statement if( $speed > 50 ) { echo "You are over the speed limit"; } // If and else statement if( $age < 21 ) { echo "You may not buy alcohol"; } else { echo "You may buy alcohol"; } // If, else if and else statement if( $speed < 25 ) { echo "You are too slow"; } elseif( $speed > 120 ) { echo "You are too fast"; } else { echo "Your speed is just right!"; } شيء آخر هنا علينا أن نلاحظه وهو الأسطر التي تبدأ مع مائلة مزدوجة “//”. المائلة المزدوجة تسمح لك بإضافة تعليق سطر واحد في أي مكان في التعليمات البرمجية. يمكنك إضافة تعليقات متعددة الاسطر من خلال البدء مع / * writing whatever you’d like and ending it with * /. الحلقات (loops) تأتي بالعديد من الأشكال والأحجام، أربعة على وجه الدقة. تسمح لك الحلقات بتشغيل نفس التعليمات البرمجية عدة مرات بناءً على استمرار الشرط الذي بدأت به الحلقة. قد تكره الحلقات الآن، لكنها سوف تصبح أقرب حلفائك عندما تصبح أكثر احترافية في كتابة التعليمات البرمجية. لنبدأ مع حلقة foreach. حلقة foreach تمر من كل عناصر المصفوفة وتنفذ تعليمات برمجية معينة. فيما يلي مثال سريع يظهر قائمة Html: <?PHP $names = array( "Daniel Pataki", "Raelene Morey", "James Farmer" ); echo "<ul>"; foreach( $names as $name ) { echo "<li>" . $name . "</li>"; } echo "</ul>"; ?> المفتاح هنا هو فهم العبارة داخل الأقواس، وهي $names as $name، الجزء الأول هو اسم المصفوفة التي ترغب في المرور من خلالها. والثاني هو اسم المتغير الذي يمكن الرجوع إليه من أجل الحصول على قيمة عنصر في هذه المصفوفة الذي تمر عليه حاليًا من خلال الحلقة ولك الحرية في تسمية هذا المتغير أي أنه ليس من الضروري أن تسميه name$ هنا بل يمكن تسميته أي اسم تريده. في مثالنا، سيتم تنفيذ الحلقة ثلاث مرات. عندما تمر الحلقة بالمصفوفة للمرة الأولى ستكون قيمة المتغير name$ هي “Daniel Pataki”، وفي المرة الثانية ستكون “Raelene Morey,” وفي المرة الثالثة ستكون “James Farmer.” يعرض المثال التالي تفاصيل في قائمة، من مصفوفة مترابطة: <?PHP $details = array( "name" => "Daniel Pataki", "Age" => "30", "Twitter" => "http://twitter.com/danielpataki" ); echo "<ul>"; foreach( $details as $label => $value ) { echo "<li><strong>" . $label . "</strong>: " . $value . "</li>"; } echo "</ul>"; ?> الأقواس تحتوي الآن على ثلاثة متغيرات: $details as $label => $value ، ستمر الحلقة الآن من المصفوفة details$. عند كل مرور للحلقة على المصفوفة سيتم مناداة المفتاح label$ والقيمة المرتبطة بهذا المفتاح value$ ، عند المرور الثاني ستكون قيمة label$ هي Age و قيمة value$ هي 30 و ستكون نتيجة تنفيذ التعلمية هي: • Name: Daniel Pataki • Age: 30 • Twitter: http://twitter.com/danielpataki كيف تعمل قوائم مقالات ووردبريس: لنلقِ نظرة الآن على مثال أكثر ارتباطًا بووردبريس: كيف تعمل قوائم مقالات ووردبريس. لا تحاكي التعليمات البرمجية أدناه ووردبريس بالضبط، ولكن جوهر العملية موجود. تخيل أن المنشورات أو المقالات جزء من مصفوفة ارتباطية كبيرة. التعليمات البرمجية الخاصة بصفحتك الرئيسية ببساطة تمر على المصفوفة وتضع البيانات المناسبة في المكان المناسب في بعض وسوم Html: $posts = array( 0 => array( "post_title" => "My First Post", "post_excerpt" => "This is a short snippet of text from the first post", "post_date" => "2015 December 1", "post_author" => "Daniel Pataki" ), 1 => array( "post_title" => "Second Post", "post_excerpt" => "Short exceprt for post number 2", "post_date" => "2015 December 4", "post_author" => "Raelene Morey" ) ); foreach( $posts as $post ) { echo "<div class='post'>"; echo "<h1>" . $post['post_title'] . "</h1>"; echo "<p>" . $post['post_excerpt'] . "</p>"; echo "<div class='post-meta'>Published on " . $post['post_date'] . " by " . $post['post_author'] . "</div>"; echo "</div>"; } الدوال (Functions) بطريقة ما، الدوال تخدم نفس الغرض كما المتغيرات - وسيلة لاستبدال التعليمات البرمجية. يمكن أن تأخذ الدوال كتلة من التعليمات البرمجية وتخزّنها لوقت لاحق وتستخدمها عدة مرات. دعونا ننظر إلى مثال بسيط جدًا باستخدام حلقة المقالات بالمثال السابق. حيث أنه من المحتمل أن يتم استخدام الجزء الذي نظهر فيه عناصر المنشورات في عدة صفحات من موقع الويب - كالصفحة الرئيسية، وصفحات الأرشيف، وصفحات المؤلفين، وما إلى ذلك. سنستخدم نفس التعليمات البرمجية مرارًا وتكرارًا. هذا هو بالضبط الوقت الذي نحتاج فيه إلى الدوال. <?PHP function display_post( $postdata ) { echo "<div class='post'>"; echo "<h1>" . $postdata['post_title'] . "</h1>"; echo "<p>" . $postdata['post_excerpt'] . "</p>"; echo "<div class='post-meta'>Published on " . $postdata['post_date'] . " by " . $postdata['post_author'] . "</div>"; echo "</div>"; } $posts = array( 0 => array( "post_title" => "My First Post", "post_excerpt" => "This is a short snippet of text from the first post", "post_date" => "2015 December 1", "post_author" => "Daniel Pataki" ), 1 => array( "post_title" => "Second Post", "post_excerpt" => "Short exceprt for post number 2", "post_date" => "2015 December 4", "post_author" => "Raelene Morey" ) ); foreach( $posts as $post ) { display_post( $post ); } التعليمة البرمجية أعلاه ليست أقصر، ولكن في أي وقت نريد عرض منشورات في المستقبل يمكننا فقط أن نكتب display_post( $post ); مما يجعلها أكثر كفاءة في المستقبل. كيف يعمل كل هذا؟ دعونا نفهم ذلك من خلال النظر إلى الدالة في الجزء العلوي من التعليمات البرمجية. قمت بتسمية هذه الدالة بـ display_post(); و في القوسين نلاحظ أن هذه الدالة تتوقع وسيط واحد. و نحن نعلم أن هذا الوسيط يجب أن يحتوي معلومات المنشور لذا سيكون هذا الوسيط عبارة عن مصفوفة مترابطة تحتوي معلومات منشور واحد أسميته postdata$. ضمن الأقواس المجعدة ندرج كل التعليمات البرمجية التي نريد تنفيذها عند استدعاء الدالة. هذه هي نفس التعليمات البرمجية التي كانت لدينا من قبل، أنا فقط بحاجة إلى إعادة تسمية كافة المتغيرات إلى postdata$، اسم الوسيط الذي تتوقعه الدالة، والتي يمكننا استخدامها في أي مكان داخل الدالة. في الجزء السفلي من التعليمة البرمجية، يمكنك أن ترى أن عرض المقال الآن أصبح أكثر تنظيمًا للتعليمات البرمجية، لقد استخدمنا للتو display_post($post). أنا متأكد أنك تشعر ببعض الضياع الآن حول التسمية، لماذا استخدمنا post$ في مكان و postdata$ في مكان آخر؟ لنراجع التعليمات البرمجية يتم تشغيل الدوال فقط عندما يتم استدعاؤها، لذا أكثر ما يهمنا في تعليماتنا البرمجية هو مصفوفة $posts، بعد ذلك نقوم بإنشاء الحلقة، كما فعلنا سابقًا. بداخل الحلقة المتغير الذي يحوي بيانات المقال الواحد post$، لحد الآن لم يتغير شيء من مثال الدالة. الآن، بدلًا من وجود كتلة من التعليمات البرمجية هناك نحن ببساطة سنقوم بإسناد هذه التعليمات البرمجية لدالة. نستدعي دالة ()display_post، نعلم أننا نحتاج لتمرير بيانات لهذه الدالة و هذه البيانات هي بيانات مقال واحد. أي متغير يحوي هذه البيانات الآن؟ المتغير post$ ، هذا يأتي من تعريف الحلقة. بعد ذلك، انتقل للأعلى إلى الدالة. سيتم الآن تنفيذها. في هذه الدالة تم تسمية الوسيط postdata$ هذا يعني ببساطة أنه ضمن هذه الدالة سيتم الإشارة إلى البيانات التي يتم تمريرها إلى هذه الدالة كوسيط بـ.postdata$ إنشاء مقتطفات يمكن أن تحتوي الدوال على وسائط متعددة وقيم افتراضية لهذه الوسائط. دعونا ننشئ دالة يمكن أن تحول أي نص إلى مقتطف عن طريق قطعه إلى قطع نصية. نريد دالة لتكون مرنة قدر الإمكان، وقادرة على السيطرة على طول المقتطف، وإلحاق السلسلة إلى النهاية. سنجعل الوسيط الأول النص الذي نريد تقصيره، الوسيط الثاني سيكون لتحديد مقدار المحارف التي نريد اقتطاعها، والثالث النص المُلحق. دعونا نبدأ بإعطاء الدالة إطار للعمل ضمنه: function make_excerpt( $text, $length = 200, $append = '...' ) { } لاحظ أنني أعطيت قيمًا افتراضية لهذه الوسائط. هذا يعني أنه يمكنك استدعاء الدالة دون تمرير الوسيطين الثاني والثالث. إذا قمت بذلك سوف تفترض الدالة أنك تريد إنشاء مقتطف طويل من 200 حرف وإلحاق ثلاث نقاط بعد ذلك. دعونا نكتب محتوى هذه الدالة: function get_excerpt( $text, $length = 200, $append = '...' ) { if( strlen( $text ) < $length ) { return $text; } else { $excerpt = substr( $text, 0, $length ); $excerpt .= $append; return $excerpt; } } لقد أضفت الكثير من الأشياء الجديدة في هذه الدالة، لذلك دعونا نشرح كل إضافة جديدة بالتفصيل. يبدأ كل هذا بعبارة if، الذي تتحقق مما إذا كان النص المعطى أطول من طول معين. وذلك باستخدام دالة مبنية مسبقًا في لغة PHP تدعى ()substr. تأخذ هذه الدالة سلسلة حرفية كوسيط وتعيد طولها. إذا كان طول text$ أقل من length$ يتم إرجاع النص ببساطة - سنتحدث عما يعني الإرجاع خلال لحظات. وإلا، فإننا ننشئ مقتطفًا باستخدام الدالة ()substr. هذه الدالة تقطع سلسلة حرفية وتتطلب ثلاثة وسائط: النص الذي سنقتطع منه، ومن أين تبدأ بالاقتطاع، وطول النص الذي نرد اقتطاعه. نريد أن نبدأ من بداية النص وقطع أحرف length$، وهذا هو السبب لإضافتي رقم 0 كي يقتطع من بداية السلسلة الحرفية. وأخيرًا، نضيف النص الملحق إلى النهاية. لقد استخدمت .= للقيام بذلك. هذه هي نفس كتابة $excerpt = $excerpt. $append في السطر الأخير، قمت بإعادة متغير excerpt$. ما هو الإرجاع؟ حتى الآن كنا في معظم الأحيان نظهر المخرجات، ولكن في كثير من الحالات نحن لا نريد عرض نتيجة حساباتنا. الدالة ()strlen هي مثال جيد على ذلك. أنت لا تريد فعلاً عرض طول متغير text$ أنت ترغب فقط في استخدامه في التعليمات البرمجية لتحقيق شيء ما. ()strlenترجع هذه القيمة، مما يسمح لك باستخدامها في مكان آخر. عند إرجاع قيمة باستخدام دالة، يمكنك إما استخدامها مباشرة مثل دالة ()strlen، أو تعيينها لمتغير $short_text = get_excerpt( $content ) يمكنك بعد ذلك إظهار short_text$ في وقت لاحق عند الحاجة. لمزيد من القراءة والدراسة PHP هي الأساس لجميع قوالب و إضافات WordPress لذلك سوف تحتاج إلى الاعتماد بشكل كبير جدًا على هذه اللغة. عند العمل في بيئة ووردبريس، ستستخدم دوال PHP (مثل strlen و substr)، ولكن هناك أيضًا مئات من الدوال التي تم إنشاؤها خصيصًا لووردبريس من قبل فريق التطوير الأساسي لمساعدتك. ستكتشف بعض هذه الوظائف في الدروس القادمة من هذه السلسلة. لقد غطينا الأساسيات التي تحتاج إلى معرفتها للبدء بتطوير ووردبريس، ولكن الحقيقة هي أننا فقط خدشنا السطح! من المهم أن تقرأ وتستكشف كل المواضيع المتعلقة بووردبرس وPHP لمزيد من العمق والممارسة. ترجمة -وبتصرّف- للمقال WordPress Development for Beginners: Learning PHP لصاحبه Daniel Pataki -
بصفة عامّة، الوِدجت والقوائم هما أوّل ما تبدأ به لمّا تبدأ بالعمل على تخصيص موقع ووردبريس. ليس فقط لأنّهما سيُتيحان لك وضع وعرض المحتوى في أيِّ مكان تريده من موقعِك (طبعًا، هذا ينطبق على حالة قابليّة الوِدجت في موقعك) ولكن أيضًا ستكون ميزةً جديرةً بالذِّكر لأيِّ مُستخدمٍ محتملٍ لقالبِك. إضافاتك للقوائم والوِدجت لقالبك ستتطلّب توفّرك على بعضٍ من الخبرة البرمجيّة. في الحقيقة كلّ ما ستحتاجه سيكون معرفة بسيطة بالـ PHP للتطبيق. بمجرّد فهمك لطريقة عمل الأمور سيُمكنك بعدها مباشرة استخدام مهاراتك في لغة الـ CSS لتنسيق القوائم والقوائم الجانبية حسب ما تريده وتراه مناسبًا. هذا رابع مقال من سلسلة تطوير ووردبريس للمبتدئين، لتعليمك أساسيّات ومفاهيم تطوير ووردبريس حتّى تتمكّن من المرور من مستوى مبتدئ إلى مستوى مطوِّر. عند نهايةِ هذه السلسلة، ستكون قادرًا على إنشاء أولى قوالبك وإضافاتك مع وضع المُميِّزات التي ترغب بها فيها. في هذا الدّرس ستتعلّم كيف تُبرمِجُ وتُخصِّصُ قوائمك الجانبيّة (الوِدجت) وقوائِمك. سنخوض أيضًا في برمجة استعلامات خاصة لوظائف أكثر تعقيدًا. العمل مع المناطق المصغّرة: إنّ ما يسميه الناس عادةً قوائم جانبيّة هي في الحقيقة مناطقُ مصغّرة. أحيانًا قد نقوم بعرضها في منطقة القائمة الجانبيّة ولكن هذه الحالة ليست دائمة. يمكن عرضُ الوِدجت في أيِّ مكان ترغب به ضمن موقعك، الأمر عائد إليك بالكامل كمطوِّرٍ للقالب. ربّما قد ترغب في عرض الوِدجت في تذييل القالب (الفوتر)، أو تحت المقال، أو ربّما ترغب بعرضها مخفية خلف قائمة، بالنهاية الأمر عائدٌ إليك. بداية يجب عليك أن تخبر الووردبريس أنّك ترغب بإنشاء منطقة مصغّرة، هذا الأمر يدعى تسجيل قائمة جانبيّة وعند القيام بهذا فإن واجهة المُستخدم ستظهر في صفحة المدير. خلال جزء سابق من هذه السلسلة "تطوير ووردبريس للمبتدئين: بناء القوالب Themes" قمنا بإنشاء ملف functions.php . فلنقم الآن بإنشاء محتوًى للقالب الذي نعمل عليه حاليًّا ولنقم بإضافة عمود ثانٍ للقائمة الجانبيّة. سنقوم أوّلًا بتسجيل قائمتنا الجانبيّة في ملف functions.php كما يلي: <?php add_action( 'widgets_init', 'mat_widget_areas' ); function mat_widget_areas() { register_sidebar( array( 'name' => 'Theme Sidebar', 'id' => 'mat-sidebar', 'description' => 'The main sidebar shown on the right in our awesome theme', 'before_widget' => '<li id="%1$s" class="widget %2$s">', 'after_widget' => '</li>', 'before_title' => '<h3 class="widget-title">', 'after_title' => '</h3>', )); } أهمُّ ما في الأمر الآن هو دالّة ()mat_widget_areas. لقد استخدمنا دالّة ()register_sidebar لإخبار ووردبريس بتفاصيل منطقتنا المصغّرة. إعدادات الاسم والتعريف سيتِمُّ إظهارها في واجهة مُستخدِم المدير، لذا حاول وصفهما جيِّدًا. كلُّ وِدجت سيتِّم تضمينها في الشفرة المُقدّمة ضِمن إعدادات الوِدجت في قبل "before" وبعد "after" . استخدم %1$s كنائِب عن المعرِّف ID و %2$s كنائِب عن أيَّةِ كلاسات تريد استخدامها و سيقوم ووردبريس بتوليدها بطريقةٍ أتوماتيكيَّة. بمجرّدِ حِفظك للبرمجيَّة، ستلاحظ ظهور قسمٍ فرعيٍّ خاص بالوِدجت داخل قائمة المظهر. منطقةُ الوِدجت خاصّتِنا يجب أن تظهر بهذا الشكل جيِّدٌ حتّى الآن. أنت الآن تعرف طريقة إضافة الوِدجت إلى المناطِقِ المصغّرة ولكّنها لن تظهر بعد في أيِّ مكان كوننا لم نقم بعدُ بإضافتها إلى برمجيّة قالبنا. أنشئ ملفُّا سمِّه sidebar.php ثمّ أضِف هذا الكود بداخِلهِ. <div id="site-sidebar">This is my sidebar</div> سيكون علينا تعديل ملفّات header و footer لكي تتوافق مع قائمتنا الجانبيّة. الهيكل الذي نريده سيكون التّالي: <body> <div id="site-header"></div> <div id='site-container'> <div id='site-content'></div> <div id='site-sidebar'></div> </div> </body> لتنفيذ هذا يلزمنا فتح وسم div ذو المعرِّف site-container# في ملف header وغلقِه في ملف footer . سنحتاج أيضًا لتضمين قائمتنا الجانبيّة في footer لأنّه يحتوي على عنصر site-sidebar#. الشكل النهائيّ لملفَّات header و footer سيكون هكذا: Header <!DOCTYPE html> <html <?php language_attributes(); ?> class="no-js"> <head> <meta charset="<?php bloginfo( 'charset' ); ?>"> <meta name="viewport" content="width=device-width, initial-scale=1"> <link rel="profile" href="http://gmpg.org/xfn/11"> <?php wp_head(); ?> </head> <body <?php body_class(); ?>> <div id="site-header"> <h1><?php bloginfo('title') ?></h1> </div> <div id='site-container'> <div id='site-content'> Footer </div> <!-- site content --> <?php get_sidebar(); ?> </div> <!-- site content --> <div id='site-footer'> <p>© My Awesome Theme</p> </div> <?php wp_footer() ?> </body> </html> كما تلاحظ، ملفُّ sidebar.php يمكِن استدعاؤه بواسطة دالّة ()get_sidebar.عند هذه المرحلة، يجب أن ترى هذا النّص "This is my sidebar" تحت محتواك. بعد إضافة قليلٍ من التنسيقات سنتمكَّن من جعل القائمة الجانبيّة بجوار المحتوى. إليك التعديلات والإضافات التي قمت بها في برمجيّة النموذج: عدَّلتُ site-content# لتخفيض max-width إلى 525px وأضفت float :left. أضفتُ site-sidebar# وقمت بإعطائها width :220px و border-radius :22px وجعلت الخلفيّة بيضاء مثل لون المحتوى وقمت أيضا بعمل float :right. أضفتُ site-container# وجعلته بعرض تراكميٍّ لعرضِ المحتوى والقائمة الجانبيّة ثم جعلته في المركز. أضف قاعدة مسح "clear" لإجبار الـ footer على التموضع تحت العناصر المُعوَّمة (العناصر التي تحتوي على float في كلاساتها). <!DOCTYPE html> <html> <head> <title>A single post template</title> </head> <body> <div id="site-header"> <h1>Welcome to my site</h1> <nav> <ul> <li><a href=''>Home</a></li> <li><a href=''>About</a></li> <li><a href=''>Contact</a></li> </ul> </nav> </div> <div id="article"> <h2 class="article-title"><?php the_title() ?></h2> <div class="article-content"><?php the_content() ?></div> <div class="article-meta">Published on <?php the_time( "Y-m-d" ) ?> by <?php the_author() ?></div> </div> <div id="site-footer"> <nav> <ul> <li><a href=''>Home</a></li> <li><a href=''>About</a></li> <li><a href=''>Contact</a></li> </ul> </nav> <div id="copyright">© Daniel Pataki</div> </div> </body> </html> آخر قطعةٍ من الأحجيِّة هي إخبار ووردبريس بعرضِ الوِدجت المعيَّنة لقائمتنا الجانبيّة. هذا الأمر يمكن إتمامه باستخدام دالّة ()dynamic_sidebar ، وإضافة معرِّف قائمتنا الجانبّية كأوَّل معاملٍ. إليك كيف يجب أن يبدو ملف sidebar.php <div id='site-sidebar'> <?php dynamic_sidebar( 'mat-sidebar' ); ?> </div> القالب التجريبيُّ يجب أن يُظهِر الآن محتوًى ووِدجت صغيرة متقاربتين على اليمين سيتمُّ عرض الوِدجت المختارة. قد يبدو المظهر بشعًا بعض الشيء ولكن سنُصلح هذا بقليل من الـ CSS. الوِدجت: ما الذّي تعلّمناه قد يكون الأمر عظيمًا بعض الشيءِ بالنسبة إليك خاصّةً إن كانت هذه أوّل مرّةٍ تنفّذ فيها قائمةً جانبيّةً، لذا دعنا نقمْ بمراجعة ما قمنا به. لإضافة قائمةٍ جانبيّة للووردبريس عليك إتِّباع الخطواتِ التاليّةِ: تسجيل القائمة الجانبيّة باستخدام ()register_sidebar. استخدام ()dynamic_sidebar في sidebar.php لجلب الوِدجت الخاصّة بك. استخدام ()get_sidebar لتضمين القائمة الجانبيّة في المكانِ المخصّصِ لها. استخدام CSS لتنسيق عملك. العمل مع القوائم: القوائم مشابهة في طريقة عملها للمناطق المُصغّرة. أوّلًا سيتوّجب عليك تسجيلها لكي تظهر في لوحة تحكُّم المدير ومِن ثَمَّ إضافتها للقالب باستخدام الدوالِّ. فلنبدأ بتسجيل قائمةٍ جديدةٍ في ملف functions.php <?php register_nav_menus( array( 'header-menu' => 'Our Awesome Header Menu', ) ); هذه الدالّة تسمح لك بإضافة عدّة قوائمٍ عن طريق إضافة عدّة عناصر للمصفوفة. مفتاح المصفوفة يمثّل موقع القائمة في القالب أمّا القيمة فتمثّل اسم القائمة نفسها. بمجرّد قيامك بذلك يمكنك البدء بتجميع قائمةٍ ما. تأكّد من إضافة بعض العناصر لقائمتك ثم ربطها بالقائمة Our Awesome Header Menu كما توضّحه الصورة أسفله: متى ما أردت عرض القائمة استخدم دالّة ()wp_nav_menu. في حالتي سأقوم بإضافة القائمة في ملّف الـ header مباشرة تحت عنصر site-header# هكذا: <div id="header-menu"> <?php wp_nav_menu( array( "theme_location" => 'header-menu' ) ) ?> </div> دالّة ()wp_nav_menu تأخذ مجموعةَ مُعامِلات يمكنك استخدامها للتحكّم بما تريد عرضه. الموقع في القالب هو ما يهمّنا حقًّا، يمكنك إلقاء نظرةٍ في دليل دوالِّ ووردبريس للحصول على شرحٍ معمّقٍ. في الختام، سأقوم بإضافة بعض التنسيقات البسيطة لجعل الأمور تبدو شبه مقبولة. اعذروني على المظهر القبيح هنا و لكن كلُّ هذا يمكنك تحسينه باستخدام مهارات CSS بعناية فائقة ( خذ بعين الاعتبار أنَّ هذا لم يكنْ الهدف الرئيسي لهذا الدرس). #header-menu { text-align:center; } #header-menu ul { padding:0px; } #header-menu li { display:inline-block; padding: 0 8px; } #header-menu a { color: #ccc; text-decoration: none; } #header-menu a:hover { color: #fff; } المزيد من القراءة والتعلّم هناك عدّة مُتطلّبات يجب أن يستجيب لها القالب قبل نفكّر بإضافته إلى مستودع قوالب ووردبريس. كلّ ما قمنا به هنا هو مجرّد مدخلٍ بسيط لعالم تطويرِ القوالب ولابدّ أنّك الآن تمتلك ما يكفي من المعرفة للبدء باختيار الوظائف التي تريد إضافتها لقالبك. أنصحك بتنصيب إضافة Theme Check ، هذه الإضافة ستقوم بتحليل قالبك وتخبرك بما يجب عليك القيام به لتوافق متطّلبات فريق ووردبريس لمراجعة القوالب. هناك بضعة أشياءٍ عليك إضافتها مثل صفحة الخطأ 404، ربمّا صفحة مخصّصة لعرض نتائج البحث، ترقيم الصفحات وعددٍ من الأشياء التي قد يحتاجها موقعك يوميَّا بشكل دائم. مثل صفحة "عن الموقع" وصفحة "تواصل معنا". بمجرّد تحديدك لكلِّ النقاط التي قد يحتاجها موقعك قد ترغب أيضا بإضافة مخصِّصٍ لقالبك حتّى تسمح لأي مستخدم مستقبليٍّ لموقعك بتحديد ألوانِهم وخياراتهم الخاصّة. لقد قمنا بتغطية أساسيات تطوير القوالب ولكن سيبقى لك الكثير لتعلّمِه وما دُمتَ تواصل التدرُّب فستكون بخير فتلك هي الطريقة التِّي تعلّمت بها، خطوةً بخطوة. ترجمة -وبتصرّف- للمقال WordPress Development for Beginners: Widgets and Menus لصاحبه Daniel Pataki -
.png.eaa64bcbd74cecb77376c340e3c6ddc5.png)
تعرّفنا في الدرس السابق على المعلِّقات، الأفعال و المرشِّحات (Hooks, Actions, Filtres ) وسنتعرّف في هذا الدرس على أساسيات إنشاء الإضافة وكيفية إضافة خصائص القالب للإضافات… أساسيّات إنشاء إضافةٍ: الآن وقد صِرنا نعرف كلّ شيءٍ عن المعلِّقات فإن الخطوة التاليّة ستكون معرفة طريقة استخدامها. لنعد خطوة للوراء ولنلق نظرة عامّة على الإضافات. يتم وضع الإضافات في المجلّد الرئيسي للإضافات في موقعك ووردبريس، يوجد هذا الملف عادة في هذا المسار "wp-content/plugins". كمثال لنقم بإنشاء إضافة تقوم بإضافة رابط تغريده تحت مقالاتك. أوّلا، فلننشئ مجلّدًا في مجلّد الإضافات الرئيسي ولنسمّه مثلا "tweet-plugin-tutorial". الآن أنشئ ملفًّا داخل هذا المجلّد وسمّه "tweet-plugin-tutorial.php". الآن قم بفتح الملف وقم بنسخ البرمجيّة التالية بداخله: <?php /** * Plugin Name: Tweet Plugin Tutorial * Plugin URI: http://danielpataki.com * Description: This plugin adds a simple tweet link below posts. * Version: 1.0.0 * Author: Daniel Pataki * Author URI: http://danielpataki.com * License: GPL2 */ هذه المعلومات سيتم عرضها في لوحة تحكّم المدير في قسم الإضافات. بمجرّد حفظك للملف ستلاحظ ظهور إضافةٍ جديدةٍ في قائمة الإضافات، تهانينا! لقد أنشأت أوّل إضافة لك بإتقان ولكن لا تفرح كثيرًا فهذه الإضافة لا تقوم بأيّة وظيفة بعد، ولكن يمكنك تفعيلها الآن وهو ما ندعوك للقيام به. حاليًّا قمنا بـ 90% من العمل. كلُّ ما علينا القيام به الآن هو إيجاد طريقة لإضافة رابط التغريدة أسفل محتوى المقال. ربّما أنت تفكّر بتعديل محتوى المقال عن طريق إضافة نصٍّ إضافي له. هذا يعني أنّك تفكّر في استخدام معلِّق the_content مثلما قمنا بهذا سابقًا: <?php function tweet_link( $content ) { return $content . '<p><a href="https://twitter.com/intent/tweet?url='.get_permalink().'">Tweet about this</a></p>'; } add_action( 'the_content', 'tweet_link' ); هذه البرمجيّة ستقوم بإضافة رابطٍ بعد محتوى مقالِتنا، ما سيتيح لمستخدمينا مشاركة رابط المقال عن طريق تغريده. في الواقع هذا كلّ ما يجب عليك معرفته لإنشاء إضافة ووردبريس. جميع الإضافات هي عبارة عن مزيج من الدّوال والمعلِّقات التي تحدِّد المكان الذي سيتم منه تشغيل هذه الدّوال. لذا من الآن فصاعدًا عليك التركيز على تعلُّم الأنظمة الفرعية مثل Options API, Metadata API وغيرها. إضافة خصائص القالب للإضافات: هناك عدّة طرق لإضافة خصائص لقوالبك. دعنا أولًّا نلقي نظرة على الطريقة القياسية للقيام بهذا الأمر عن طريق دليل ووردبريس. سوف نبدأ بإنشاء صفحة مدير ستحتوي على النموذج التالي: <?php add_action('admin_menu', 'tweetlink_settings_menu'); function tweetlink_settings_menu() { add_menu_page('Tweet Link Settings', 'Tweet Link', 'manage_options', 'tweetlink-settings', 'tweetlink_settings_page', 'dashicons-twitter'); } function tweetlink_settings_page() { echo '<div class="wrap"><h2>Tweet Link Options</h2></div>'; } دالّة ()tweetlink_settings_menu تمّ تعليقها بمعلِّق admin_menu. حسب دليل الووردبريس هذه هي الطريقة الصحيحة التّي يجب استخدامها لإنشاء قائمة مدخلات في لوحة التحكّم. العمل سيتّم عن طريق دالّة ()add_menu_page التي تأخذ مجموعة مُعامِلات صفحة ذات مستوى أعلى. المعاملات التي تأخذها هذه الدّالة هي: عنوان الصّفحة – يستخدم في وسم العنوان عنوان القائمة – يستخدم في كتابة اسم القائمة في الجهة اليسرى/اليمنى من لوحة تحكم المدير. الإمكانيّة – لتحديد أقل مستوى يمكنه مشاهدة القائمة (مثلا القائمة ستكون ظاهرة فقط للمدير والمحرّرين) الاسم اللطيف للقائمة – يستخدم في الرابط المؤدّي لصفحة القائمة. الدّالة - اسم الدّالة التي تقوم بالتحكّم بالمُخرجات. الأيقونة – رابط صورة او نص لأيقونات ووردبريس. الموقع – تموضع العنصر ضمن القائمة. إليك كيف تبدو صفحة الخصائص في لوحة التحكم: قد تبدو لك هذه الصّفحة رائعة ولكن في الحقيقة هي مبالغةٌ كبيرة إنشاء صفحة كاملة من أجل إضافة بسيطة كالتّي نعمل عليها الآن، لذا سيكون من الأفضل وضع هذه الصفحة داخل قائمة الإعدادات الموجودة سلفا بالووردبريس. يمكنك القيام بذلك باستخدام دالّة ()add_options_page. الخطوة التّالية ستكون جعل الووردبريس يعلم حول إعدادات تغريدتنا. هذا الأمر سيتطلب استخدام دالّة ()register_settings داخل دالّة معلّقة إلى ()to admin_init. إليك كيف سيكون شكل البرمجيّة: <?php add_action( 'admin_init', 'tweetlink_settings' ); function tweetlink_settings() { register_setting( 'tweetlink_settings', 'twitter_account' ); } كلّ شيءٍ تمام. الخطوة الأخيرة ستكون إضافة استمارة تستخدم خصائصنا. استخدم البرمجيّة التاليّة كنموذج لإنشاء إعداداتك الخاصّة، لا تنسَ استخدام دوال ()settings_fields و ()do_settings_sections لضمان قيام الووردبريس بحفظ البيانات لك. <?php function tweetlink_settings_page() { ?> <div class="wrap"> <h2>Tweet Link Settings</h2> <form method="post" action="options.php"> <?php settings_fields( 'tweetlink_settings' ); ?> <?php do_settings_sections( 'tweetlink_settings' ); ?> <table class="form-table"> <tr valign="top"> <th scope="row">Twitter Account</th> <td><input type="text" name="twitter_account" value="<?php echo esc_attr( get_option('twitter_account') ); ?>" /></td> </tr> </table> <?php submit_button(); ?> </form> </div> <?php } عند نهاية العمليّة يجب أن ترى ظهور حقل جديد يُمكّنك من إدخال حسابك على تويتر ثم الضغط على حفظ. بعد ذلك يمكنك استخدام دالّة 'get_option( 'twitter_account ( لاسترجاع القيمة المُدخلة واستخدامها بأي مكان داخل إضافتك. يمكننا الآن التعديل على رابط التغريدة لإضافة "via @username" إذا قام المستخدمون بإضافة حسابهم على تويتر في صفحة الخصائص. إليك كيف عدّلت دالّة ()tweet_link <?php function tweet_link( $content ) { $url = 'https://twitter.com/intent/tweet'; $url .= '?url=' . get_permalink(); $account = get_option( 'twitter_account' ); if( !empty( $account ) ) { $url .= '&via=' . $account; } return $content . '<p><a href="' . $url . '">Tweet about this</a></p>'; } خاتمة هكذا نختم سلسلتنا حول تطوير ووردبريس للمبتدئين. في هذه المقالة تعلّمنا طريقة إنشاء إضافة بسيطة نتمنّى أنها خلقت داخلك شعورًا بالرّضى كونك تمكّنت من برمجة أوّل إضافة لك. فقط التجربة والإصرار من سيجعلان تطوير الووردبريس أسهل بالنسبة إليك وسترتقي من مجرّد مبتدئ غير خبير إلى مستوى مطوّر. ترجمة -وبتصرّف- للمقال WordPress Development for Beginners: Building Plugins لصاحبه Daniel Pataki
