ما هو WP Enqueue وكيف تستخدمه؟

نشرت: 2017-10-28

عندما تتعلم HTML لأول مرة ، فإن الطريقة الوحيدة التي تعرف بها كيفية إدراج أي نوع من التفاعل هي استخدام علامات البرنامج النصي في رأس الصفحة أو تذييلها لتعيين نوع ومصدر ملف JavaScript خارجي. (أو إذا كنت تتعلم حقًا ، فإن وظيفة JS بأكملها بين علامات البرنامج النصي في الجسم نفسه. هذا جيد للتعلم ، لكنها ممارسة سيئة جدًا بمجرد الانتقال إلى تطوير WordPress المتقدم. أدخل وظيفة قائمة الانتظار .

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

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

و wp_enqueue_scripts في طليعة تلك الممارسات.

ما هي الصفقة الكبيرة؟

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

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

هذا. مذهل.

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

WP Enqueue Syntax and Params

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

في علامة البرنامج النصي النموذجية ، ستقوم إما باستيراد ملف .js الخارجي مباشرة أو لصق مقتطف الشفرة الطويل بالكامل بين العلامات نفسها. (هذا أيضًا ما تفعله إذا قمت بلصق شيء ما في وحدة كود Divi أو عناصر واجهة مستخدم النص أو HTML المخصصة لـ WP).

تحتاج فقط إلى معرفة بعض المعلمات الأساسية وبناء الجملة.

يعطي الدستور هذا الرمز الأساسي لقائمة الانتظار:

wp_enqueue_script( $handle, $src, $deps, $ver, $in_footer );

بشكل عام ، من السهل جدًا التقسيم إلى وحدات بت قابلة للاستخدام بواسطة المعلمات.

  • wp_enqueue_script () هي الوظيفة التي ستضع كل التعليمات البرمجية في الصفحة التي تنتقل إليها.
  • $ handle هو اسم فريد للنص البرمجي نفسه.
  • يمثل $ src عنوان URL لملف .js الفعلي الذي تضعه في قائمة الانتظار.
  • Deps $ هي المقابض $ لأي تبعيات يتطلبها هذا الشخص.
  • سيكون $ ver رقم الإصدار. إذا لم يتم تحديد أي شيء ، فستتم إضافة إصدار تثبيت WP تلقائيًا.
  • يخبر $ in_footer أو $ in_header WordPress بمكان وضع البرنامج النصي الخاص بك.

يمكن رؤية الوثائق الكاملة لإدراج النصوص في قائمة المخطوطات.

انتباه الطلاب: بدء التسجيل في WP الآن!

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

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

سوف تسجل رمزك مثل هذا:

wp_register_script( 'jquery', 'http://ajax.googleapis.com/ajax/libs/jquery/1.10.1/jquery.min.js', false, null, $in_footer);

ثم ، كلما احتجت إليه مرة أخرى ، يمكنك دائمًا الاتصال به مرة أخرى على النحو التالي:

wp_enqueue_script( 'jquery' ); 

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

يمكنك أن تقرأ كل شيء عن الطريقة في الدستور الغذائي.

بالإضافة إلى ذلك ، يُطلب من مؤلفي الإضافات إدراج نصوص برمجية في قائمة الانتظار إذا كانوا يريدون تضمينها في مستودع WordPress.org ، لذلك إذا كان ذلك على لوحتك ... فمن الأفضل الحصول على قائمة الانتظار '.

نضعها معا

تنفيذ الكود سهل. ما عليك سوى إسقاط مقتطف مثل المقتطف أدناه في ملف jobs.php . ويتولى WordPress الباقي. أعني ، هذا مقتطف أساسي حقًا لاستدعاء jQuery ، ولكن يمكنك أن ترى كيف تعمل الأشياء معًا.

عادة ما تستخدم شيئًا يشبه هذا:

<script type="text/javascript" src="jquery.js"></script>

بمجرد أن تتعلم كيفية استخدام enqueue_scripts_ ، سترى شيئًا مثل هذا:

add_action('wp_enqueue_scripts', 'add_scripts');
function add_scripts(){
    wp_register_script( 'jquery', 'http://ajax.googleapis.com/ajax/libs/jquery/1.10.1/jquery.min.js', false, null, true);
    wp_enqueue_script( 'jquery' ); 
}

الآن ، لاحظ في الكود أعلاه كيف تستخدم الوظيفة add_scripts () _ التي تعد جزءًا من WordPress بالفعل لتوضيح ترتيب الخطوات القليلة التالية. أولاً ، تحصل الدالة wp_register_ على جميع التفاصيل المحددة وتضع النص في تذييل الصفحة ، ثم تستخدم wp_enqueue لاستدعائها أخيرًا بمجرد إعداد كل شيء.

تغليف

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

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

الصورة المصغرة للمادة من hanss / shutterstock.com