أضف Javascript إلى موقع WordPress - 7 طرق خطوة بخطوة

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

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

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

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

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

انقر هنا للعثور على خبراء رخيصين لإصلاحات WordPress

ما هو JavaScript؟

إذا كنت تقرأ هذا المنشور ، فمن المحتمل أنك تعرف بالفعل ماهية JavaScript.

ومع ذلك ، لجعله في متناول الجميع ، سنقوم بسرعة بتحديد ماهية JavaScript وماذا تفعل. لا تتردد في تخطي هذا الجزء إذا كنت تعرف بالفعل.

JavaScript هي لغة برمجة يتم تشغيلها في متصفح. يمكن استدعاؤه من خادم الويب ولكنه يعمل داخل متصفح الزائر.

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

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

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

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

هل يمكنك استخدام JavaScript في WordPress؟

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

الاستخدامات كثيرة ومتنوعة ولكن نظرًا لتشغيل JavaScript بواسطة متصفح المستخدم ، يمكن أن تفعل الكثير دون إبطاء خادم الويب الخاص بك.

يمكنك إضافة برنامج نصي بعدة طرق كما سنناقش بعد قليل.

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

لا يمكنك أن تكون حذرا للغاية!

كيفية إضافة JavaScript إلى WordPress

هناك عدة طرق لإضافة كود Javascript مخصص إلى موقع WordPress الخاص بك ، ولكل منها استخداماته الخاصة:

1. أضف نصًا إلى صفحات محددة باستخدام مكون إضافي مثل WPCode
2. أضف البرنامج النصي إلى صفحة محددة أو صفحة واحدة من اختيارك ، أو صفحات متعددة باستخدام function.php
3. أضف JavaScript إلى كافة الصفحات
4. أضف ملف Javascript إلى عنوان القالب الخاص بك
5. استخدام wp_head Hook لإضافة JavaScript مخصص
6. أضف JavaScript إلى تذييل WordPress الخاص بك
7. إضافة JavaScript إلى WordPress Video
8. أضف JavaScript إلى عنصر واجهة مستخدم WordPress

لنستعرض كل طريقة من هذه الطرق بالتفصيل.

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

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

لا نوصي بالضرورة بإجراء تغييرات بهذه الطريقة ولكننا نؤمن بإعطائك جميع المعلومات ثم اتخاذ قرارك الخاص.

1. استخدم مكونًا إضافيًا مثل WPCode

إذا كنت ترغب في استخدام مكون إضافي لتضمين مرجع جافا سكريبت لملف رأس أو تذييل قالب WordPress ، فإن المكون الإضافي WPCode هو خيار سهل ومجاني.

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

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

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

اطلع على  تنزيل WPCode هنا أو قم بتثبيته باستخدام وظيفة تثبيت الإضافات في WordPress.

قم بتثبيت البرنامج المساعد WPCode:

• قم بتسجيل الدخول إلى الواجهة الخلفية لموقعك أو المسؤول.
• انتقل إلى البرنامج المساعد في التأليف الإضافات > إضافة جديدة
• ابحث عن البرنامج المساعد "WPCode" وانقر فوق تثبيت الآن.
• بمجرد التثبيت ، انقر فوق تفعيل

يمكنك الآن إما تحميل برنامج نصي مخصص بدون ملف (على سبيل المثال لإضافة نص برمجي تم تقديمه لك مثل Google Analytics) أو تحميل ملف Javascript مخصص. 

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

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

يمكنك اختيار إضافة البرنامج النصي إلى Header أو Body أو Footer. يجب أن تحصل على إرشادات من موفر البرنامج النصي في أي قسم من هذه الأقسام تحتاج إلى إضافة البرنامج النصي إليه.

لنفترض أنك تريد إضافته إلى الرأس:

انقر حفظ التغييرات لانهاء.

سيضيف المكون الإضافي WPCode الآن الرمز إلى كل صفحة من صفحات موقع الويب الخاص بك.

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

يتيح لك WPCode أيضًا إنشاء مقتطفات التعليمات البرمجية الخاصة بك.

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

ببساطة انتقل إلى كود القصاصات > أضف المقتطف ثم حدد إنشاء الخاصة بك.

سيتم نقلك الآن إلى ملف إنشاء مقتطف مخصص الصفحة حيث يمكنك إعطاء الكود الخاص بك عنوانًا ولصقه في ملف معاينة التعليمات البرمجية مربع.

ثم ، من نوع الرمز القائمة المنسدلة ، اختر مقتطف جافا سكريبت.

ثم قم بالتمرير لأسفل حتى تصل إلى ملف إدخال منطقة.

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

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

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

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

هذا كل ما يتطلبه الأمر لإضافة JavaScript إلى WordPress!

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

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

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

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

انقر هنا للعثور على خبراء رخيصين لإصلاحات WordPress

2. أضف JavaScript إلى صفحة WordPress أو منشور معين

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

هذا يستخدم IS_PAGE الوظيفة التي يمكنك العثور عليها هنا: 

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

• is_single(),
• is_front_page(),
• is_home,
• is_admin وما إلى ذلك. 

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

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

• الآن بعد أن أصبح لديك معرف الصفحة ، ستحتاج إلى تحميل ملف .js إلى موقع. نوصي بتحميل ملف .js إلى مجلد القالب الخاص بك ، ربما في الدليل الفرعي.
• بمجرد تحميل ذلك ، ستحتاج إلى تدوين الدليل بالضبط واسم ملف .JS ، الذي نستخدمه بدلاً من PATH_TO_JS_FILE أدناه. على سبيل المثال ، قد يكون ملفك في: https://www.yourwebsite.com/wp-content/themes/twentynineteen/js/myjsfile.js
• لاحظ تمامًا عنوان URL الكامل هذا واستبدل PATH_T_JS_FILE أدناه. ستحتاج أيضًا إلى استبدال المعرف الذي وجدته أعلاه.
• أضف الكود الكامل أدناه إلى نهاية ملف وظائف ملف القالب الخاص بك.

وظيفة collectiveray_load_js_script () {
  إذا (is_page (ID)) {
    wp_enqueue_script ('js-file'، 'PATH_TO_JS_FILE'، array ('jquery')، ''، false) ؛
    // أو استخدم الإصدار أدناه إذا كنت تعرف بالضبط مكان الملف
    // wp_enqueue_script ('js-file'، get_template_directory_uri (). '/js/myscript.js') ؛
  }
}

add_action ('wp_enqueue_scripts'، 'collectiveray_load_js_script ') ؛

إذا كنت تعرف بالضبط المكان الذي وضعت فيه ملف JS ، فيمكنك استخدام اختلاف بسيط في wp_enqueue_script: 

wp_enqueue_script ('js-file'، get_template_directory_uri (). '/js/myscript.js') ؛

في هذه الحالة ، يكون ملف /js/mysript.js هو موقع الملف الذي تريد إضافته.

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

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

• is_single ("17") - يستخدم معرف آخر
• is_single ("عنوان رسالتي") - يستخدم عنوان المنشور للتحقق مما إذا كان هذا هو المنشور لإضافة الملف إليه
• is_single ("عنوان البريد الخاص بي") - الشيكات ضد سبيكة البريد
• is_single (المصفوفة (17، 'my-post-title'، 'My Post Title')) - يتحقق هذا مما إذا كان أي من معرّف نشر الشروط هو "17" ، أو slug هو "my post-title" ، أو العنوان هو "My Post Title"
• هو وحيد() - متغيرات أخرى للدالة is_single باستخدام مصفوفة من القيم للتحقق منها

سيكون الرمز ، في هذه الحالة ، هو التالي أو اختلافًا طفيفًا اعتمادًا على معلمات دالة is_single. 

وظيفة collectiveray_load_js_script () {
  إذا (is_single ('17 ')) {
    wp_enqueue_script ('js-file'، 'PATH_TO_JS_FILE'، array ('jquery')، ''، false) ؛
    // أو استخدم الإصدار أدناه إذا كنت تعرف بالضبط مكان الملف
    // wp_enqueue_script ('js-file'، get_template_directory_uri (). '/js/myscript.js') ؛
  } 
}

add_action ('wp_enqueue_scripts'، 'collectiveray_load_js_script ') ؛

إذا كان لديك عنوان المنشور ، فيمكنك استخدامه بدلاً من المعلمة "17". مرة أخرى ، يمكن أيضًا تعديل wp_enqueue_script إلى:

wp_enqueue_script ('js-file'، get_template_directory_uri (). '/js/myscript.js') ؛

3. أضف JavaScript إلى كافة الصفحات

كما رأينا ، الطريقة الأسهل والأنظف لإضافة ملف جافا سكريبت إلى قالب WordPress الخاص بك هي باستخدام functions.php ملف مع wp_enqueue_script.

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

هيريس كيفية القيام بذلك:

فتح الخاص functions.php ملف ونسخ مقتطف الشفرة أدناه إليه. تأكد من استبدال عنوان URL للنموذج بعنوانك قبل الحفظ.

وظيفة collectiveray_theme_scripts_function () {
  wp_enqueue_script ('js-file'، get_template_directory_uri (). '/js/myscript.js') ؛
}
add_action ('wp_enqueue_scripts'، 'collectiveray_theme_scripts_function ') ،

إذا كنت باستخدام موضوع الطفل، ستحتاج إلى استخدام get_stylesheet_directory_uri () بدلاً من get_template_directory_uri () 

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

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

انقر هنا للعثور على خبراء رخيصين لإصلاحات WordPress

4. أضف JavaScript إلى عنوان الموضوع الخاص بك

في بعض الحالات ، قد ترغب في استخدام ملف JavaScript في موقعك بالكامل ، لكنك لا تريد استخدام مكون إضافي للقيام بذلك.

على سبيل المثال ، إذا كنت ترغب في إضافة برنامج نصي تابع لجهة خارجية إلى جميع صفحاتك ، (على سبيل المثال ، البرنامج النصي الخاص بـ Instantpage.js لجعل موقع الويب الخاص بك أسرع) ، يمكنك إدراج البرنامج النصي ، أو إضافة ملف البرنامج النصي المشار إليه نفسه ، في head من الخاص header.php ملف نموذجي. 

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

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

يجب إضافة هذا الاستدعاء للملف (أو البرنامج النصي) بين العلامات الوصفية ورابط ورقة الأنماط. هذا هو نفسه تمامًا كما لو كنت تضيف كود Javascript في أي صفحة HTML. 

لإضافة ملف Javascript إلى موقعك ، في ملف head، أنت تستخدم الكود التالي:

تأكد من أنك قد حددت type بشكل صحيح ، وإلا فلن يكون موقعك صالحًا. تأكد أيضًا من وجود الدليل / البرامج النصية في السمة وقمت بإضافة myscript.js إليها.

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

على سبيل المثال ، هذا مثال على استخدام الوظيفة التي أضفتها للتو.

" >العنوان يذهب هنا

4. استخدام wp_head Hook لإضافة Custom JavaScript

يمكنك أيضًا إضافة JavaScript مخصص إلى رأسك باستخدام ملف wp_head ربط العمل. مرة أخرى ، هذا الحل غير مفضل لأنه يولد عددًا كبيرًا من البرامج النصية. هو كذلك ، لاless، يُفضل إدراج البرامج النصية يدويًا في ملف header.php الخاص بك.

هذه الطريقة ، التي يمكن استخدامها أيضًا للتذييل ، تستخدم خطاف الإجراء لإدراج نصوص مضمنة في موقعك. على عكس وظيفة البرنامج النصي wp enqueue ، التي تضع نصوصًا مخصصة في قائمة الانتظار ، فإن طريقة wp head تطبع البرامج النصية في قالب الرأس (والتذييل ، إذا كنت تستخدم wp_footer صنارة صيد).

للبدء ، انتقل إلى ملف functions.php وانسخ الكود التالي والصقه:

وظيفة collectiver_custom_javascript () {؟>

<?php } add_action('wp_head', 'collective_custom_javascript');

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

يحب المطورون وظيفة البرنامج النصي wp enqueue لأنها تتجنب التعارضات التي يمكن أن تحدث مع حلول أخرى ، مثل إضافة البرامج النصية مباشرة إلى ملف header.php الخاص بك. علاوة على ذلك ، لا يُنشئ هذا الحل أي نصوص برمجية تابعة.

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

5. أضف JavaScript إلى تذييل WordPress الخاص بك

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

نظرًا لأنه يجب عليك تجنب إضافة JavaScript إلى ملفات header.php أو footer.php ، فسنستخدم مكونًا إضافيًا.

أوصي WPCode - أدخل الرؤوس والتذييلات + مقتطفات التعليمات البرمجية المخصصة البرنامج المساعد.

أختار الإعدادات و الرؤوس والتذييلات إدراج القائمة.

ثم الصق كود JavaScript الخاص بك في قسم التذييل على الصفحة.

احفظ تغييراتك عند الانتهاء.

6. إضافة JavaScript إلى WordPress Video

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

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

أفضل شيء عن ملف الوظائف هو أنه يعمل كمكوِّن إضافي ، يمكن استخدامه لإضافة ميزات وتوسيع وظائف كل من السمة وكذلك WordPress نفسه.

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

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

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

(ملاحظة خاصة: هل تبحث عن قائمة بالتعديلات / الحيل التي يمكنك إجراؤها بسهولة على موقع WordPress الخاص بك دون استخدام مكون إضافي؟ يمكنك الرجوع إلى دليلنا هنا: 101 حيلة ووردبريس يجب أن يعرفها كل مدون جاد.)

7. أضف JavaScript إلى أداة WordPress

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

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

أضف JavaScript داخل tags and select تحديث.

يجب أن يكون الرمز الذي أضفته مرئيًا على الفور عند عرض الأداة في الواجهة الأمامية لموقعك.

كيفية تصحيح خطأ JavaScript في صفحة WordPress

تصحيح أخطاء JavaScript عملية تستغرق وقتًا طويلاً ولكنها حتمية للمبتدئين.

لحسن الحظ ، لديك الأدوات المتوفرة للتحقق من الأخطاء.

افتح صفحة في متصفحك واضغط على F12 أو حدد أدوات المطور من القائمة (Chrome). يمكنك أيضًا استخدام Ctrl + Shift + J (Windows / Linux) أو Cmd + Option + J (Mac).

إختار ال كنسولات في الجزء الجديد من الشاشة الذي يفتح وسترى أي أخطاء JavaScript مظللة باللون الأحمر.

حدد مصدر الخطأ وصحح الجزء ذي الصلة من JavaScript الذي أضفته.

اعمل في طريقك حتى تتم معالجة جميع الأخطاء.

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

الأسئلة المتداولة حول إضافة Javascript إلى WordPress

ما هو جافا سكريبت؟

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

كيف أقوم بإضافة ملف Javascript إلى WordPress؟

هل يمكنني استخدام جافا سكريبت في ووردبريس؟

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

كيف أقوم بإضافة الكود الخاص بي إلى WordPress؟

أفضل طريقة لإضافة الكود الخاص بك إلى WordPress هي من خلال ملف jobs.php. يوصى بإنشاء سمة فرعية ثم إضافة تعديلاتك الخاصة إلى السمة الفرعية بحيث لا تكسر قابلية ترقية السمة الخاصة بك.

كيف أقوم بتعديل Javascript في WordPress؟

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

وفي الختام

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

انقر هنا للعثور على خبراء رخيصين لإصلاحات WordPress

عن المؤلف

كاتب: ديفيد أتاردالموقع: https://www.linkedin.com/in/dattard/بريد إلكتروني: ديفيد @collectiverayكوم

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