طريقة إنشاء ملحقات WordPress باستخدام تقنيات OOP

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

ما نحن بصدد تعلمه:

• فوائد استخدام OOP لملحقات WordPress.
• كيفية إعداد رمز قصير.
• كيفية إعداد علامة قالب.
• كيفية تمكين الرمز المختصر في أدوات WordPress.
• مثال من العالم الحقيقي باستخدام واجهة برمجة تطبيقات Dribbble.

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

لماذا تستخدم OOP؟

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

مقالات ذات صلة

• 
  احصل علي الهدية” اكواد بلوكس فروت Blox Fruits وطريقة استبدالها 2024

  ديسمبر 21, 2024
• 
  طريقة انشاء محفظة بال باي محفظتي palpay مجاناً

  ديسمبر 21, 2024

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

دريبل

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

1. إعداد فئة البرنامج المساعد

يعتمد الكود الكينوني على الفئات والطرق (الوظائف). لنقم بإنشاء صفنا الأساسي ، والذي سيتفاعل مع أدوات وفلاتر WordPress.

<?php
class WPDribbble {
    public function __construct()
    {
    }
}
 
$wpDribbble = new WPDribbble();

تحتوي فئات PHP على دالة مُنشئ ، __construct، والذي يتم تنفيذه بمجرد إنشاء مثيل جديد للفئة. سيتم تسجيل جميع أدوات وفلاتر WordPress تحت مُنشئ فئة البرنامج المساعد الخاص بنا. دعنا نمضي قدمًا ونسجل رمزًا قصيرًا للمكوِّن الإضافي الخاص بنا. ال add_shortcode() الوظيفة / الخطاف سيخضعان لدالة المُنشئ.

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

<?php
class WPDribbble {
    public function __construct()
    {
        add_shortcode('Dribbble', array($this, 'shortcode'));
    }
     
    public function shortcode()
    {
    }
}
 
$wpDribbble = new WPDribbble();

add_shortcode: المعلمة الأولى هي علامة الرمز القصير ، والثانية هي وظيفة رد الاتصال.

لاحظ كيف نستخدم مصفوفة في معامل وظيفة رد الاتصال؟ لتسجيل وظائف رد الاتصال داخل كائن ، علينا استخدام مصفوفة.

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

وهكذا ، كلما كان Dribbble يجب تنفيذ الرمز القصير ، فسيستدعي shortcode طريقة WPDribbble صف دراسي.

لازلت مشوش؟

<?php
# 1. Standard usage
add_shortcode('shortcode_name', 'shortcode_func');
 
function shortcode_func()
{
 // Contents of this function will execute when the blogger
// uses the [shortcode_name] shortcode.
}
 
# 2. With PHP 5.3, we can pass an anonymous function.
add_shortcode('shortcode_name', function() {
   // Contents of this function will execute when the blogger
  // uses the [shortcode_name] shortcode.
});
 
#3. Within a class
class WPDribbble {
    public function __construct()
    {
        add_shortcode('Dribbble', array($this, 'shortcode'));
    }
     
    public function shortcode()
    {
           // Contents of this function will execute when the blogger
          // uses the [shortcode_name] shortcode.
    }
}

2. فئة Dribbble API

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

سنقوم بكتابة ملف DribbbleAPI الكائن ، وتسجيل طريقة تسمى getPlayerShots() للتفاعل مع Dribbble API وإرجاع مجموعة من أحدث اللقطات.

لنقم بإنشاء ملف جديد لهذه الفئة يسمى DribbbleAPI.php

<?php
class DribbbleAPI {
    // url to Dribbble api
    protected $apiUrl="
}

في ال DribbbleAPI class ، نقوم بإعداد متغير الفئة التالي:

• • $apiUrl: الرابط إلى Dribbble API ، حيث سيتم إرسال المكالمات.

نبدأ الخاصية أو اسم المتغير بـ public لتحديد إمكانية استرداد قيمة هذه الخاصية من خارج الفصل الدراسي. إذا كنا نرغب بدلاً من ذلك في قصر الوصول إلى الخاصية على هذه الفئة فقط ، وربما أي فئات ترث منها ، فسنستخدم protected بادئة. يشار إلى هذه الممارسة باسم التغليف. في حالتنا ، حددنا $apiUrl الملكية باعتبارها protected منشأه.

لدينا القاعدة الجاهزة لغلاف Dribbble API الخاص بنا. الآن ، سنقوم بكتابة عملية جديدة تسمى getPlayerShots(). سيكون الغرض من هذه الطريقة هو الاستعلام عن واجهة برمجة التطبيقات وتحويل النتيجة إلى مصفوفة للاستخدام داخل المكون الإضافي الخاص بنا.

<?php
class DribbbleAPI 
{
    // url to Dribbble api
    protected $apiUrl="
     
    public function getPlayerShots(int $user, int $perPage = 15) : array
    {
        $json = wp_remote_get($this->apiUrl . 'players/' . $user . '/shots?per_page=" . $perPage);
         
        $array = json_decode($json["body']);
         
        $shots = $array->shots;
         
        return $shots;
    }
}

تعلم المزيد عن wp_remote_get.

ال getPlayerShots الطريقة لها حجتين. الوسيطة الأولى هي معرف المستخدم ، والذي سيتم استخدامه في عنوان URL الخاص بواجهة برمجة التطبيقات. والوسيطة الثانية هي القيمة النهائية التي سيتم استخدامها لترقيم السجلات.

ال getPlayerShots طريقة استخدام WordPress ‘ wp_remote_get وظيفة للاستعلام عن Dribbble API. تستجيب واجهة برمجة التطبيقات (API) بعد ذلك لاستعلامنا بسلسلة JSON ، والتي يتم تحليلها بعد ذلك في مصفوفة بمساعدة json_decode وظيفة وإعادتها إلى الوظيفة باستخدام ملف return كلمة رئيسية.

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

3. دمج DribbbleAPI فصل

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

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

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

ضبط متغيرات الفئة

<?php
class WPDribbble {
    protected $pluginPath;
    protected $pluginUrl;
    protected $dribbbleApiObject;
     
    public function __construct(DribbbleAPI $dribbbleApiObject) : void
    {
        // Set Plugin Path
        $this->pluginPath = dirname(__FILE__);
     
        // Set Plugin URL
        $this->pluginUrl = WP_PLUGIN_URL . '/wp-Dribbble';
        
        // Init DribbbleAPI Object
        $this->dribbbleApiObject = $dribbbleApiObject;
         
        add_shortcode('Dribbble', array($this, 'shortcode'));
    }
}

ال getImages() طريقة

قم بإنشاء طريقة جديدة داخل WPDribbble فئة تسمى getImages.

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

public function getImages($user, $images = 3, $width = 50, $height = 50, $caption = true)
{
}

• • مستخدم $ – اسم المستخدم أو معرف المستخدم الخاص بـ Dribbble. $user سيتم استخدامه عند تسجيل مثيل جديد من DribbbleAPI صف دراسي.

• • صور – عدد الصور المراد عرضها. $images سيتم استخدامه عند الاستعلام عن API من خلال getPlayerShots طريقة.

• • عرض دولار وارتفاع دولار – تخيل أنه سيتم استخدامها لإنشاء صور مصغرة.

• • التسمية التوضيحية – خيار تقديم عنوان الصورة.

بعد ذلك ، سنقوم بتضمين ملف DribbbleAPI فئة في WPDribbble plugin ، حتى نتمكن من إنشاء مثيل جديد منه لالتقاط اللقطات.

...
require_once __DIR__ . '/DribbbleAPI.php';
...

بعد ذلك ، لنقم بإنشاء مثيل DribbbleAPI فئة ، عندما نقوم بإنشاء مثيل WPDribbble صف دراسي.

...
...
$wpDribbble = new WPDribbble(new DribbbleAPI());
...
...

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

سيتم إنشاء HTML للقائمة داخل ملف $shots عقدة.

public function getImages(int $user, int $images = 3, int $width = 50, int $height = 50, bool $caption = true) : string
{    
    $shots = $this->dribbbleApiObject->getPlayerShots($user, $images);
     
    if($shots) {
        $html[] = '<ul class="wp-Dribbble">';
         
        foreach($shots as $shot) {
            $image = $shot->image_url; // url of the image
            $fileName = $shot->id . '.png'; // generating a filename image_id.png
            $thumbFileName="thumb_" .$shot->id . '.png';
            $destThumbFilePath = $this->pluginPath . '/cache/' .  $thumbFileName;
             
            if (!file_exists($this->pluginPath . '/full-images/' . $fileName)) { // check if the full image exists
                $rawImage = wp_remote_get($image); // get the full image
                $newImagePath = $this->pluginPath  . '/full-images/' . $fileName;
                $fp = fopen($newImagePath, 'x');
                fwrite($fp, $rawImage['body']); // save the full image
                fclose($fp);
            }
             
            // generate thumbnail url
            $imagine = new \Imagine\Gd\Imagine();
            $image = $imagine->open($newImagePath);
            $thumbnail = $image->thumbnail(new Imagine\Image\Box($width, $height));
            $thumbnail->save($destThumbFilePath);
            $destThumbURL = $this->pluginUrl . '/cache/' .  $thumbFileName;
             
            if($caption) { // if caption is true
                $captionHTML = '<p class="wp-Dribbble-caption">' . $shot->title . '</p>';
            }
             
            // combine shot url, title and thumbnail to add to the ul list
            $html[] = '<li class="wp-Dribbble-list"><a href="' . $shot->url . '" title="' . $shot->title . '"><img src="' . $destThumbURL . '" alt="' . $shot->title . '" /></a>'.$captionHTML.'</li>';
        }
         
        $html[] = '</ul>';
         
        return implode("\n", $html);
    }

إضافة الفصول

من الجيد دائمًا إضافة فئات إلى كل عنصر من عناصر المكون الإضافي الخاص بك. يوفر هذا للمستخدمين المتقدمين للمكوِّن الإضافي حرية تخصيصه. تجنب استخدام CSS المضمنة للمحتوى الذي يتم إنشاؤه من خلال المكون الإضافي الخاص بك.

4. إعداد الكود القصير

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

لدينا بالفعل add_shortcode الخطاف جاهز في مُنشئ فئة البرنامج المساعد الخاص بنا. الآن ، سنقوم بكتابة الرمز القصير method داخل class، والذي سيؤدي إلى استخراج سمات الرمز القصير وإرجاع صور Dribbble باستخدام ملف getImages() طريقة.

سنقوم بالاتصال بالرمز المختصر الخاص بنا [Dribbble]. كما ذكرنا سابقًا ، يتم تحديد اسم الرمز القصير بواسطة المعلمة الأولى في ملف add_shortcode وظيفة. سيتم استخدامه مع السمات المطلوبة لملف getImages() طريقة. فمثلا: [Dribbble user=haris images=5 width=100 height=100 caption=true].

public function shortcode($atts)
{
    // extract the attributes into variables
    extract(shortcode_atts(array(
        'images' => 3,
        'width' => 50,
        'height' => 50,
        'caption' => true,
    ), $atts));
     
    // pass the attributes to getImages function and render the images
    return $this->getImages($atts['user'], $images, $width, $height, $caption);
}

إضافة دعم الرمز القصير لأدوات WordPress

بشكل افتراضي ، لا تدعم أدوات WordPress الرموز القصيرة ، ومع ذلك ، باستخدام امتداد widget_text عامل التصفية ، يمكننا فرض دعم الرمز القصير في عناصر واجهة مستخدم WordPress.

يمكننا إضافة عامل التصفية في ملف WPDribbble منشئ الكائن.

public function __construct(DribbbleAPI $dribbbleApiObject) : void
{
    // Set Plugin Path
    $this->pluginPath = dirname(__FILE__);
 
    // Set Plugin URL
    $this->pluginUrl = WP_PLUGIN_URL . '/wp-Dribbble';

    add_shortcode('Dribbble', array($this, 'shortcode'));

    // Add shortcode support for widgets
    add_filter('widget_text', 'do_shortcode');

    $this->dribbbleApiObject = $dribbbleApiObject;
}

5. إعداد علامة القالب

يمكن استخدام علامة القالب مباشرة في قوالب WordPress. سيكون الغرض الأساسي لعلامة القالب هو إنشاء مثيل جديد من WPDribbble الطبقة ، واستدعاء getImages() طريقة. ستكون علامة القالب دالة PHP بسيطة ويجب تسجيلها خارج فئة البرنامج المساعد. يجب أن يكون لها اسم فريد ؛ خلاف ذلك ، فإنه سيتعارض مع الوظائف / الإضافات التي تحمل اسمًا مشابهًا. منذ أن تم استدعاء البرنامج المساعد الخاص بنا WP-Dribbble، سوف نسمي علامة القالب ، wp_Dribbble().

function wp_Dribbble($user, $images = 3, $width = 50, $height = 50, $caption = true)
{
    $wpDribbble = new WPDribbble(new DribbbleAPI());
    echo $wpDribbble->getImages($user, $images, $width, $height, $caption);
}

هاهو!

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