هل تريد إنشاء إضافة ووردبريس؟ سيعلمك هذا البرنامج التعليمي كيفية القيام بذلك.

تساهم الإضافات في شعبية ووردبريس، حيث أنها تسمح للمستخدمين الذين ليس لديهم معرفة بالبرمجة بإنشاء مواقع ويب رائعة.

يوجد أكثر من 50 مكون إضافي في ملف rدليل WordPress  مُصممة لأغراض مُختلفة. ستجد إضافات ووردبريس لـ الاشتراك في النشرة الإخبارية , الامن et  التجارة الإلكترونية . فقط سمها.

بدونها، يصبح موقع ووردبريس مجرد مجموعة من الصور الثابتة والنصوص. أما مع الإضافات، فيمكن لنظام إدارة المحتوى أن يحقق مستوىً مذهلاً من التخصيص.

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

---

محتويات

---

أسئلة يطرح fréquemment

---

ما ستحتاج إليه لإنشاء البرنامج المساعد WordPress

لإنشاء إضافة، لست بحاجة لأن تكون مطور ووردبريس خبيرًا. كل ما تحتاجه هو بعض المعرفة الأساسية بالبرمجة للبدء.

• المعرفة الأساسية في برمجة PHP: تتم كتابة إضافات WordPress بلغة PHP ، لذا يجب أن تفهم اللغة وبناء الجملة قبل أن تبدأ.
• HTML و CSS أساسيان:  تتيح لك لغتا HTML وCSS التحكم في عرض ومظهر إضافاتك. لذا، يُعدّ فهم أساسياتهما أمرًا بالغ الأهمية لإنشاء إضافة ووردبريس.
• الإلمام بـ WordPress:  من المفيد التعرف على منصة ووردبريس ووظائفها الرئيسية، بالإضافة إلى... وورد الدستور (الدليل الإلكتروني لتطوير WordPress).
• بيئة تنموية: لتطوير واختبار المكون الإضافي الخاص بك ، تحتاج إلى تثبيت WordPress على جهازك المحلي أو على موقع تطوير. سيسمح لك ذلك باختبار المكون الإضافي الخاص بك دون التأثير على موقع ويب مباشر. سنوضح لك كيفية القيام بذلك في القسم التالي.
• محرر نصوص: ستحتاج إلى محرر نصوص لكتابة كود الإضافة. تتوفر العديد من الخيارات، مثل Sنص سامي, ذرة et كود الاستوديو المرئي.

---

كيفية إنشاء البرنامج المساعد WordPress في 7 خطوات

الخطوة 1: فهم كيفية عمل مكونات WordPress الإضافية

نظرًا لأن WordPress مكتوب بلغة برمجة ، يمكن لأي شخص لديه معرفة بالترميز الوصول إلى كود WordPress وتعديله.

هكذا تعمل الإضافات بالضبط. فهي تتيح لك تعديل وتوسيع وظائف ووردبريس من خلال التفاعل المباشر مع موقع ووردبريس الخاص بك باستخدام وظائف PHP معينة.

لن ينجح إنشاء إضافة ووردبريس وإضافة التعليمات البرمجية إلا إذا استدعيت دالة PHP باستخدام خطاف (Hook). الخطافات هي التي تسمح لإضافتك بالتفاعل مع ووردبريس دون الحاجة إلى تعديل الملفات الأساسية.

دعنا نلقي نظرة على العلاقة بين الأقواس المربعة والوظائف لفهم أساسيات مكونات WordPress الإضافية.

وظائف ووردبريس:

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

هذا مثال :

function sticky_header() {

  ?>

  <script>

  // Select the header element

  var header = document.querySelector(‘header’);

  // Get the offset position of the header

  var sticky = header.offsetTop;

  // Add the sticky class to the header when you reach its scroll position. Remove “sticky” when you leave the scroll position

  function addSticky() {

    if (window.pageYOffset > sticky) {

      header.classList.add(“sticky”);

    } else {

      header.classList.remove(“sticky”);

    }

  }

  // Add the sticky class to the header when you scroll the page

  window.onscroll = function() {

    addSticky();

  };

  </script>

  <?php

}

add_action( ‘wp_footer’, ‘sticky_header’ );

يمكنك استدعاء هذه الدالة مباشرةً في إضافة ووردبريس الخاصة بك بكتابة `sticky_header()` في المكان الذي تريد تنفيذ الكود فيه. مع ذلك، تُعدّ هذه ممارسةً سيئةً لأنك ستواجه على الأرجح مشاكل. إليك سببان إضافيان لعدم استدعاء الدوال مباشرةً في الكود.

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

قد يكون استدعاء دالة يدويًا أمرًا صعبًا إذا كنت مبتدئًا في البرمجة. عند إنشاء الإضافات، يُنصح بربطها بخطاف. سيُجنّبك هذا استدعاء الدالة في أماكن متعددة.

خطافات ووردبريس 

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

خطافات الحركة

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

add_action('hook_name', 'my_custom_function');

Le  اسم الخطاف  هو اسم خطاف الإجراء الذي تريد استخدامه.

توجد العديد من خطافات الإجراءات في ووردبريس. يمكنك العثور عليها في cأوديكس ووردبريس.

my_custom_function  هي الوظيفة التي تحتوي على الكود الذي تريد تنفيذه. يجب تحديد هذه الوظيفة قبل الوظيفة ADD_ACTION.

سيكون شكل بناء الجملة كالتالي لربط وظيفة الرأس الثابتة المذكورة أعلاه بخطاف.

add_action( 'wp_footer', 'sticky_header' );

تُنفّذ هذه الدالة وظيفة sticky_header() عند استدعاء خطاف الإجراء wp_footer. يمكنك أيضًا ربط هذه الدالة بخطاف مُحدد عن طريق استبدال wp_footer باسم الخطاف الذي تختاره.

على سبيل المثال:

add_action( 'init', 'sticky_header' );

سيؤدي هذا إلى تنفيذ وظيفة الرأس الثابت عند استدعاء إجراء تهيئة ووردبريس.

خطاطيف التصفية

تتيح لك خطافات التصفية تعديل البيانات قبل عرضها أو حفظها في قاعدة البيانات. إليك مثال على خطاف تصفية يُغيّر عنوان منشور مدونة إلى أحرف كبيرة.

add_filter( ‘the_title’, ‘uppercase_title’ );

function uppercase_title( $title ) {

  return strtoupper( $title );

}

تقبل هذه الدالة وسيطًا واحدًا، وهو $title، وهو العنوان الأصلي لمنشور المدونة.

ثم تستخدم الوظيفة الوظيفة strtoupper () لتحويل العنوان إلى أحرف كبيرة وإرجاع القيمة المعدلة.

الفرق بين خطافات الإجراءات وخطافات التصفية

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

من ناحية أخرى، تسمح لك خطافات التصفية بتعديل البيانات أثناء مرورها عبر قاعدة بيانات ووردبريس.

كما في المثال أعلاه، خطاف التصفية العنوان يتيح لك تغيير عنوان منشور المدونة قبل عرضه على الموقع الإلكتروني.

الخطوة 2: قم بإعداد بيئة اختبار

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

قد يتطلب إنشاء إضافة تعديلات متكررة. كما قد ترتكب أخطاءً تُلحق الضرر بموقعك الإلكتروني.

يمكنك استخدام جهاز الكمبيوتر الخاص بك كخادم محلي لاستضافة موقع WordPress اختباري حيث يمكنك إنشاء المكون الإضافي الخاص بك واختباره.

إذا كانت خطة الاستضافة الخاصة بك تدعم إنشاء موقع تجريبي، فيمكنك استخدامها أيضًا. سنستخدم الخيار الأول هنا.

لإنشاء بيئة اختبار ، سنفعل تنزيل محلي ، أداة تطوير لاستضافة مواقع ووردبريس محليًا.

بمجرد اكتمال التنزيل ، قم بتشغيل البرنامج على جهاز الكمبيوتر الخاص بك وانقر فوق رمز + في الجزء السفلي الأيسر لإنشاء موقع محلي جديد.

اختر من قم بإنشاء موقع جديد وانقر على زر اتبع الدورة.

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

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

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

هذا كل شيء. بيئة الاختبار جاهزة. لنبدأ بإنشاء إضافة ووردبريس الخاصة بك.

الخطوة 3: قم بإنشاء مجلد الملحقات الخاصة بك

بمجرد أن تصبح بيئة الاختبار الخاصة بك في مكانها الصحيح ، فإن أول شيء عليك القيام به هو إنشاء ملف مكون إضافي في دليل موقعك. بشكل افتراضي ، يخزن WordPress جميع المكونات الإضافية في الدليل wp-content/plugin.

سيحتوي كل مكون إضافي مُثبّت على موقع ووردبريس على مجلد داخل هذا الدليل. لذا، ستحتاج إلى إنشاء مجلد داخل هذا الدليل وتسميته لإضافتك.

في هذا البرنامج التعليمي ، سننتقل إلى المجلد wp-content/plugin في دليل المواقع المحلي لدينا. إليك الطريقة.

ملاحظة:  العملية هي نفسها إذا كنت تستخدم موقعًا وسيطًا.

في لوحة المعلومات المحلية الخاصة بك ، انقر فوق  انتقل إلى مجلد الموقع . ستتم إعادة توجيهك إلى دليل الموقع المحلي الخاص بك.

اختر التطبيقات في الخيارات ، انقر فوق جمهور ثم الفسفور الابيض بين المحتوى. سترى مجلدات مختلفة في هذا الدليل.

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

الخطوة 4: قم بإنشاء ملف PHP الرئيسي للمكوِّن الإضافي الخاص بك

بعد إنشاء مجلد الإضافة، تتمثل الخطوة التالية في إضافة ملف PHP إلى ذلك المجلد. هذا هو المكان الذي سيُخزَّن فيه كود الإضافة ووظائفها.

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

بالنسبة للإضافات الأكثر تعقيدًا ذات الوظائف المتقدمة ، قد تكون هناك أنواع ملفات مختلفة في مجلد البرنامج المساعد ، مثل CSS وجافا سكريبت. في حالتنا ، يكفي ملف PHP واحد.

للقيام بذلك، قم بإنشاء ملف PHP في مجلد الملحق، كما هو موضح في لقطة الشاشة أدناه.

بمجرد أن يصبح الملف جاهزًا، فقد حان الوقت لإضافة بعض المعلومات إلى الملحق الخاص بك.

الخطوة 5: تكوين معلومات البرنامج المساعد الخاص بك

يُطلق عليها أيضًا اسم رأس ملف الملحق، وهي عبارة عن كتلة تعليقات PHP تتضمن تفاصيل حول الملحق الخاص بك مثل اسم الملحق، والإصدار، وعنوان URL، واسم المؤلف وموقع الويب، والترخيص، وما إلى ذلك.

هذه هي المعلومات التي تراها على صفحة إضافة ووردبريس بعد تثبيت الإضافة.

يمكنك العثور على رأس ملف البرنامج المساعد في مجلد ووردبريس . تبدو هكذا.

ما عليك سوى نسخ هذا الكود ولصقه في ملف PHP الخاص بالملحق، ثم تعديل التفاصيل وفقًا لمواصفات الملحق. في حالتنا، سيبدو قارئ ملفات الترويسة الثابتة للملحق كما يلي.

<?php

/*

Plugin Name: Sticky Header

Plugin URI: https://wordpress.org/plugins/sticky-header/

Description: Make your website header sticks to the top of every page on your website as users scroll.

Author: The Team

Author URI: https://blogpascher.com/sticky-header

Text Domain: Sticky Header 

Domain Path: /languages

*/

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

سجّل الدخول إلى لوحة معلومات WordPress الخاصة بموقعك التجريبي وانتقل إلى Plugins>Plugins installés.

سترى المكوّن الإضافي Sticky Header مع التفاصيل. هاهو.

يمكنك الآن تنشيط المكون الإضافي ، لكنه لن يفعل أي شيء لأننا لم نضف أي وظائف إليه حتى الآن. لذلك دعونا نجعل المكون الإضافي الخاص بنا يفعل شيئًا ما.

الخطوة 6: أضف رمزًا إلى المكون الإضافي الخاص بك

للقيام بذلك، سنضيف رمز الترويسة الثابتة الذي استخدمناه عند تعلم وظائف وخطافات ووردبريس أعلاه. إليك كيفية القيام بذلك.

افتح ملف PHP الخاص بالملحق. ضمن قسم التفاصيل، انسخ والصق مقتطفات التعليمات البرمجية هذه في ملف PHP الرئيسي للملحق واحفظه.

function sticky_header() {

  ?>

  <script>

  // Select the header element

  var header = document.querySelector(‘header’);

  // Get the offset position of the header

  var sticky = header.offsetTop;

  // Add the sticky class to the header when you reach its scroll position. Remove “sticky” when you leave the scroll position

  function addSticky() {

    if (window.pageYOffset > sticky) {

      header.classList.add(“sticky”);

    } else {

      header.classList.remove(“sticky”);

    }

  }

  // Add the sticky class to the header when you scroll the page

  window.onscroll = function() {

    addSticky();

  };

  </script>

  <?php

}

add_action( ‘wp_footer’, ‘sticky_header’ );

يقوم هذا الرمز بأمرين أساسيين ،

الوظيفة رأس_الثبات يتم تفعيلها عندما يقوم المستخدم بتمرير الصفحة وتتوقف عندما يتوقف التمرير.

ثانياً، الفعل add_action('wp_footer', 'sticky_header' ); يستخدم العنوان …..

احفظ الكود، وانتهى الأمر. لقد أنشأت بنجاح إضافة ووردبريس تجعل رأس موقعك الإلكتروني ثابتًا عند قيام المستخدمين بالتمرير لأسفل.

الخطوة 7: تفعيل البرنامج المساعد

ارجع إلى موقعك وقم بتنشيط المكون الإضافي.

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

بمجرد أن ترى تأثير الإضافة الجديدة على موقعك التجريبي، فقد حان الوقت لتجربتها على موقعك الفعلي.

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

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

وإذا كنت ترغب في جني المال من البرنامج المساعد الخاص بك، فيمكنك بيعه على أحد المواقع الإلكترونية التي أدرجناها أعلاه.

---

خاتمة

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

يتبع إنشاء الإضافات المعقدة نفس الطريقة. المزيد من الوظائف تعني المزيد من الوظائف في ملف البرنامج المساعد الخاص بك.

هل سبق لك أن حاولت إنشاء مكون إضافي لبرنامج WordPress؟ دعنا نتحدث عن تجربتك في قسم التعليقات أدناه.