في عالم الإنترنت الواسع، يحتل WordPress مكانة بارزة بين أنظمة إدارة المحتوى بفضل مرونته ونظامه البيئي القوي. وتعتمد قدرة WordPress على التوسع بشكل كبير على الإضافات (البرامج الإضافية) المتاحة له. بالنسبة للمطورين، إتقان تطوير إضافات WordPress لا يسمح فقط بتخصيص وظائف المواقع بشكل عميق، بل يمكّنهم أيضًا تحويل أفكارهم إلى منتجات قابلة لإعادة الاستخدام. سيقوم هذا المقال بتوجيهك خطوة بخطوة من الصفر لإنشاء أول إضافة لـ WordPress تحتوي على وظائف عملية، مما يساعدك على فهم أسرار تطوير الإضافات.
أساسيات إضافات ووردبريس والاستعدادات اللازمة لاستخدامها
قبل البدء في كتابة أول سطر من الكود، من المهم جدًا فهم المفاهيم الأساسية لإضافات ووردبريس (WordPress plugins) وإنشاء بيئة تطوير مناسبة. إضافة ووردبريس، في جوهرها، عبارة عن مجموعة من ملفات PHP واحد أو أكثر، وقد تحتوي أيضًا على موارد مثل JavaScript وCSS والصور. يمكن لهذه الإضافات إضافة وظائف جديدة أو تعديل الوظائف الموجودة مسبقًا، وهي مستقلة عن القوالب (templates) المستخدمة في موقع ووردبريس، مما يعني أن وظائف الإضافة عادةً لا تتأثر عند تغيير القالب.
أنت بحاجة إلى بيئة تطوير محلية (مثل Local by Flywheel، XAMPP، MAMP) أو موقع اختبار مخصص للتطوير. التطبيقات الأساسية التي تحتاجها تشمل محرر الكود (مثل VS Code، PhpStorm) بالإضافة إلى أدوات المطورين المتاحة في المتصفحات لتصحيح الأخطاء (Debugging Tools). من المهم أيضًا أن تكون على دراية تامة بكيفية عمل منصة ووردبريس (WordPress).wp-content/pluginsتُعد هيكلية المجلدات الخطوة الأولى؛ حيث يتم تثبيت جميع الإضافات (البرامج الإضافية) هناك.
القراءة الموصى بها الشروع في مسيرة تطوير الإضافات على ووردبريس يعني أنك ستكتسب المهارات اللازمة لخدمة جمهور عالمي.。
قم بإنشاء ملف الإضافة (plugin) الخاص بك الأول.
نقطة الدخول للإضافة (البرنامج الإضافي) هي ملف PHP رئيسي يقع داخل دليل مستقل خاص بها. يجب أن يحتوي هذا الملف على تعليقات رأسية قياسية للإضافة؛ حيث يعتمد ووردبريس عليها لتحديد وعرض إضافتك في واجهة الإدارة الخلفية.
تعريف معلومات رأس الإضافة (Plugin Header Information)
يجب أن يبدأ كل إضافة (plugin) بكتلة تعليقات PHP محددة. تحدد هذه الكتلة هوية الإضافة الأساسية داخل واجهة ووردبريس الخلفية (WordPress backend). في دليل الإضافات الخاص بك (مثلاً…wp-content/plugins/my-first-pluginفي الوثيقة، قم بإنشاء عنصر يُسمى…my-first-plugin.phpملف.
<?php
/**
* Plugin Name: 我的第一个功能插件
* Plugin URI: https://yourwebsite.com/my-first-plugin
* Description: 这是一个学习用的WordPress插件，用于在文章末尾添加自定义提示框。
* Version: 1.0.0
* Requires at least: 5.6
* Requires PHP: 7.4
* Author: 你的名字
* Author URI: https://yourwebsite.com
* License: GPL v2 or later
* Text Domain: my-first-plugin
*/بعد حفظ الملف، قم بتسجيل الدخول إلى واجهة ووردبريس الخلفية (الواجهة الإدارية) الخاصة بك، ثم اذهب إلى قائمة “الإضافات” (Plugins). يجب أن ترى إضافة بعنوان “My First Feature Plugin” موجودة في قائمة الإضافات؛ يمكنك تفعيلها الآن. على الرغم من أنها لا تحتوي على أي وظائف بعد، إلا أنك قد خطوت الخطوة الأولى بنجاح.
بنية أساسية لبناء إضافة (Plugin)
مع زيادة الوظائف، يصبح من الصعب الحفاظ على ملف واحد. الممارسة الجيدة هي إنشاء هيكل مجلدات منظم. على سبيل المثال، يمكن إنشاء المجلدات ضمن المجلد الرئيسي للإضافات (plugins).includes/تحتوي المجلدات على ملفات الكلاسات أو الدوال الأساسية للغة PHP.assets/المجلد يحتوي على ملفات JavaScript و CSS.admin/وpublic/يتم معالجة منطق الخادم (الخلفية) ومنطق واجهة المستخدم (الأمامية) بشكل منفصل. الملف الرئيسي (الملف الأساسي) هو المسؤول عن تنسيق وتنظيم كل هذه العمليات.my-first-plugin.phpومن ثم يكون مسؤولاً عن توجيه وتحميل هذه الوحدات (المودولات).
تنفيذ الميزات الأساسية: الخطافات (hooks) والمرشحات (filters)
الفلسفة الأساسية في تطوير إضافات ووردبريس (WordPress Plugins) هي “الخطافات” (Hooks)، والتي تسمح لك بإدخال كودك الخاص في نقاط زمنية محددة دون الحاجة إلى تعديل الملفات الأساسية لووردبريس. تنقسم الخطافات إلى نوعين: الإجراءات (Actions) والمرشحات (Filters). تسمح الإجراءات (Actions) بتنفيذ دوال عند حدوث أحداث معينة، مثل نشر مقال أو تحميل الواجهة الأمامية للموقع؛ بينما تسمح المرشحات (Filters) بتعديل البيانات، مثل محتوى المقال أو عنوانه.
القراءة الموصى بها من الصفر إلى الواحد: دليل شامل ودروس عملية لتطوير إضافات ووردبريس。
استخدم المرشحات لتعديل محتوى المقال.
دعونا نضيف أول ميزة حقيقية للإضافة: إضافة نافذة تنبيه مخصصة تلقائيًا في نهاية محتوى كل مقال. سنستخدم…the_contentمرشحات.
أولاً، في ملف الإضافة الرئيسي، أسفل التعليقات الخاصة بالرأس (header comments)، أضف الدالة والمكونات المطلوبة (hooks) التالية:
// 防止直接访问文件
if ( ! defined( 'ABSPATH' ) ) {
exit;
}
/**
* 在文章内容末尾添加自定义提示框
*
* @param string $content 原始文章内容。
* @return string 修改后的文章内容。
*/
function mfp_add_notice_box( $content ) {
// 仅在主循环的单篇文章页面显示
if ( is_single() && in_the_loop() && is_main_query() ) {
$notice_box = '<div class="mfp-notice" style="background-color: #f0f8ff; border-left: 4px solid #3498db; padding: 15px; margin: 20px 0; border-radius: 5px;">'$notice_box = '<p><strong>نصيحة:</strong> تم تحسين عرض هذا المقال بواسطة “أول إضافة وظيفية لي”. آمل أن تعجبك المحتويات!</p>'$notice_box = '</div>';
$content .= $notice_box;
}
return $content;
}
add_filter( 'the_content', 'mfp_add_notice_box' );دالةmfp_add_notice_boxReceiving the original content.$contentكمعامل، يتم التحقق مما إذا كانت البيئة الحالية صفحة لمقال واحد أم لا؛ إذا كان الأمر كذلك، يتم دمج كتلة HTML تحتوي على رسالة توجيهية، ثم يتم إرجاع المحتوى المعدل في النهاية.add_filterتقوم الدالة بتثبيت هذه الدالة المخصصة في نظام ووردبريس (WordPress).the_contentعلى الفلتر.
استخدم الإجراءات (Actions) لإضافة قائمة إعدادات كإضافة (Plugin).
لجعل الإضافة أكثر كمالاً، عادةً ما نحتاج إلى توفير صفحة تكوين في الواجهة الخلفية. هنا، سنحتاج إلى استخدام "خطافات الإجراءات" (action hooks).admin_menuلإضافة عنصر قائمة (menu item).
/**
* 在WordPress后台添加插件设置菜单
*/
function mfp_add_admin_menu() {
add_options_page(
'我的插件设置', // 页面标题
'我的第一个插件', // 菜单标题
'manage_options', // 所需权限
'my-first-plugin', // 菜单 Slug
'mfp_render_settings_page' // 用于输出页面内容的回调函数
);
}
add_action( 'admin_menu', 'mfp_add_admin_menu' );
/**
* 渲染设置页面内容
*/
function mfp_render_settings_page() {
?>
<div class="wrap">
<h1>إعدادات الإضافة الأولى الخاصة بي</h1>
<form action="/ar/options.php/" method="post" data-trp-original-action="options.php">
<?php
settings_fields( 'mfp_settings_group' );
do_settings_sections( 'my-first-plugin' );
submit_button();
?>
<input type="hidden" name="trp-form-language" value="ar"/></form>
</div>
أنا لا أعرف ماذا أقول.من خلال هذا المثال، تعلمت كيفية استخدام “خطافات الإجراءات” (action hooks) لتوسيع واجهة ووردبريس الخلفية. عادةً ما يتطلب إعداد الصفحات بشكل كامل أيضًا استخدام…register_setting, add_settings_sectionوadd_settings_fieldتُستخدم دوال مثل هذه لتعريف وحفظ الخيارات، وهي تشكل الأساس لتفاعلية الإضافات (البرامج الإضافية).
إضافة أنماط وبرمجيات إلى الإضافة (plugins)
يجب أن يكون الإضافة المهنية ليست فقط ذات وظائف ممتازة، ولكن أيضًا أن يكون تصميمها لائقًا. نحن بحاجة إلى إضافة ملفات CSS و JavaScript بالطريقة الصحيحة لتجنب حدوث تعارضات مع الثيمة الرئيسية للموقع أو مع
القراءة الموصى بها كيف تختار وتطور إضافات WordPress عالية الجودة: دليل من الصفر إلى الخبير.。
تسجيل الموارد الأمامية وتحميلها بشكل آمن
يوفر ووردبريسwp_enqueue_styleوwp_enqueue_scriptدالة لإضافة الموارد بشكل آمن. يجب أن نستخدمها.wp_enqueue_scriptsيتم استخدام “خطافات الإجراءات” (action hooks) لتحميل هذه الملفات.
/**
* 注册并加载插件的前端样式和脚本
*/
function mfp_enqueue_public_assets() {
// 获取插件URL
$plugin_url = plugin_dir_url( __FILE__ );
// 注册并排队样式表
wp_enqueue_style(
'mfp-public-style',
$plugin_url . 'assets/css/mfp-public.css',
array(),
'1.0.0'
);
// 注册并排队JavaScript文件（示例）
wp_enqueue_script(
'mfp-public-script',
$plugin_url . 'assets/js/mfp-public.js',
array('jquery'), // 依赖jQuery
'1.0.0',
true // 在页脚加载
);
}
add_action( 'wp_enqueue_scripts', 'mfp_enqueue_public_assets' );يجب عليك أولاً إنشاء الملفات المطلوبة في دليل الإضافات (plugins directory).assets/css/mfp-public.cssيمكننا إضافة ملفات، ثم إضافة أنماط (styles) لتحسين مظهر مربعات التنبيه (prompt boxes) التي قمنا بإنشائها مسبقًا.
/* assets/css/mfp-public.css */
.mfp-notice {
background-color: #f0f8ff;
border-left: 4px solid #3498db;
padding: 15px;
margin: 20px 0;
border-radius: 5px;
font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, sans-serif;
}
.mfp-notice p {
margin: 0;
color: #2c3e50;
}تحميل الموارد الخلفية
طريقة تسجيل الموارد في الخلفية مشابهة، لكن الأدوات (الهوكات – hooks) المستخدمة مختلفة.admin_enqueue_scriptsيجب عليك تحديد ما إذا كانت الصفحة الحالية هي صفحة إعدادات الإضافة الخاصة بك أم لا (على سبيل المثال، باستخدام بعض المعايير أو الكود المحدد).get_current_screen()يتم استخدام دوال معينة لتحميل الموارد بشكل انتقائي، وذلك لتجنب الأعباء غير الضرورية على أداء النظام.
الملخصات
بدأت بتعريف معلومات رأس الإضافة (plugin header) البسيطة، ثم استخدمت نظام الخطافات (hooks) القوي في ووردبريس (actions وfilters) لتعديل محتوى وهيكل الموقع بشكل ديناميكي، وبعد ذلك قمت بإدارة موارد الأنماط (styles) والسكريبتات بشكل محترف. لقد مررت بالعملية الكاملة لبناء أول إضافة وظيفية. الأمر الأساسي هو فهم واتباع معايير تطوير ووردبريس: استخدام الخطافات بدلاً من تعديل الكود الأساسي مباشرةً، وتسجيل الموارد وترتيب تنفيذها بشكل صحيح، بالإضافة إلى إنشاء هيكل ملفات واضح. هذا مجرد نقطة البداية في عالم تطوير الإضافات. فيما يلي، يمكنك استكشاف مواضيع أكثر تقدمًا مثل إنشاء الكود المختصر (Shortcodes)، وأنواع المقالات المخصصة (Custom Post Types – CPTs)، والتفاعل مع قواعد البيانات، ونقاط نهاية واجهات برمجة التطبيقات الخدمية (REST API endpoints)، وتدويل الإضافات (plugin localization)، لجعل إضافتك أكثر قوة وسهولة في الاستخدام.
الأسئلة الشائعة الأسئلة المتداولة
ما هي المعرفة المسبقة المطلوبة لتطوير إضافات (Plugins) لمنصة ووردبريس (WordPress)؟
يجب أن تمتلك المهارات الأساسية في برمجة PHP، وذلك يشمل فهم الدوال (functions)، والجمل الشرطية (conditional statements)، والحلقات (loops)، وعمليات معالجة المصفوفات (array operations). سيكون من المفيد أيضًا أن يكون لديك معرفة أساسية بلغات HTML وCSS وكمية صغيرة من JavaScript، خاصة عندما يتعلق الأمر بتعديل واجهات المستخدم الأمامية (front-end interfaces). الأهم من ذلك كله، أن تفهم المبادئ الأساسية لعمل منصة WordPress، مثل هيكل القوالب (templates)، والحلقة الرئيسية (main loop)، والبنية الأساسية لقاعدة البيانات (database).
كيف أقوم بتصحيح أخطاء (التصحيح) في إضافة (Plugin) ووردبريس الخاصة بي؟
تفعيل ووردبريس (WordPress)WP_DEBUGالنموذج (Pattern) هو الخطوة الأولى في عملية التصحيح (التصحيح الخاطئ أو Debugging). يجب أن يتم وضعه في المجلد الرئيسي (الجذري) لموقعك الإلكتروني.wp-config.phpفي الوثيقة، يتم تعيين الإعدادات.define( 'WP_DEBUG', true );سيؤدي ذلك إلى عرض أخطاء PHP وتحذيراته على الشاشة وتسجيلها فيwp-content/debug.logالملف موجود هناك. في الوقت نفسه، يمكن استخدام أدوات المطور في المتصفح، وتحديدًا لوحتي “Console” و“Network”， لتسهيل تصحيح أخطاء الكود المكتوب بلغة JavaScript وطلبات AJAX. بالنسبة للخوارزميات المعقدة، يمكن الاستعانة بأدوات إضافية لمساعدة في فهم وتطوerror_log()تقوم الدوال أو الإضافات المتخصصة في التصحيح بطباعة معلومات المتغيرات في السجلات (اللوغات).
كيف يمكنني إضافة خيارات قابلة للتكوين إلى إضافتي (plugin)؟
الطريقة القياسية لإضافة خيارات تعديل للإضافات (plugins) هي استخدام واجهة برمجة التطبيقات (API) الخاصة بإعدادات ووردبريس (WordPress Settings API). وهذا يتضمن مجموعة من الدوال (functions):register_setting()يُستخدم لتسجيل مجموعة من خيارات الإعدادات وحفظها بشكل آمن في قاعدة البيانات؛add_settings_section()أضف قسمًا جديدًا في صفحة الإعدادات الخاصة بك.add_settings_field()أضف حقول النموذج المحددة داخل الكتلة (مثل مربعات النصوص، قوائم الاختيار). يجب أن تتضمن دالة الاستدعاء الخاصة بصفحة الإعدادات (setting page callback function) هذه الحقول.settings_fields()وdo_settings_sections()يتم استدعاء هذه الدوال لتوليد النموذج بشكل صحيح وللتحقق من صحته.
كيف يمكنني التأكد من أن الإضافة (plugin) الخاصة بي لن تتعارض مع إضافات أو تصاميم (themes) أخرى؟
اتباع أفضل الممارسات هو المفتاح لتجنب حدوث التعارضات. قم بإضافة بادئة فريدة أو مساحة اسم (namespace) لجميع الدوال (functions) والفئات (classes) والثوابت (constants) وأسماء الإجراءات/المرشحات (actionsfilters) بالإضافة إلى فئات CSS في ملفات HTML الخاصة بك. على سبيل المثال،myplugin_function_nameمثل هذا اسم الدالة، وليس فقط…function_nameاستخدمه.wp_enqueue_styleوwp_enqueue_scriptقم بتحميل الموارد، وتأكد من أن معرفات الأنماط (styles) والسكريبتات (scripts) فريدة من نوعها. حيثما أمكن، ضع كودك داخل فئات (classes) لعزل المتغيرات والدوال بشكل أفضل.
بعد الانتهاء من التطوير، كيف يمكنني نشر إضافتي؟
إذا كنت ترغب في تقديم الإضافة (البرنامج الإضافي) إلى الدليل الرسمي لإضافات WordPress، يجب التأكد من أنها تتوافق تمامًا مع معايير الترميز الخاصة بـ WordPress وتحتوي على رخصة GPL. ستحتاج إلى تسجيل حساب على موقع WordPress.org لتقديم الإضافة للمراجعة. سيقوم فريق المراجعة بفحص أمان الكود ووظائف الإضافة بالإضافة إلى وثائقها. قبل التقديم، يرجى قراءة دليل تطوير إضافات WordPress الرسمي وإرشادات التقديم بعناية. بالنسبة للإضافات التجارية، يمكنك اختيار توزيعها على موقعك الخاص أو من خلال أسواق طرف ثالث.
ما التالي، ما التالي؟
القراءة الموسعة والمعرفة العملية
فيما يلي بعض الموضوعات ذات الصلة بموضوع هذه المقالة وهي مناسبة لمزيد من القراءة المتعمقة. وغالباً ما يكون من الأفضل إعطاء الأولوية للبدء بالمقال الأقرب إلى مشكلتك الحالية ثم التوسع تدريجياً إلى المواضيع المحيطة.
- ١٠ إضافات أساسية لتحسين أداء وأمان مواقع ووردبريس
- دليل شامل لتكوين واستخدام إضافات WooCommerce: إنشاء موقع تجاري إلكتروني من الصفر
- مقدمة: لماذا اختيار استخدام ووردبريس (WordPress) للتطوير؟
- لماذا تم اختيار WooCommerce كحل لمتجرك الإلكتروني؟
- دليل شامل لـ WooCommerce: بناء متجرك الإلكتروني واستراتيجيات المبيعات الخاصة بك من الصفر
العربية