هل تريد إتقان كيفية إضافة كود jQuery على WordPress؟ لذا استمر في القراءة لمعرفة المزيد.

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

لذلك سوف نحاول توضيح الأشياء.

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

ولكن من قبل ، إذا لم تقم بتثبيت WordPress ، فاكتشف كيفية تثبيت ملف بلوق وورد في 7 خطوات et كيفية العثور عليها، وتثبيت وتفعيل موضوع ورد على بلوق 

ثم عد إلى سبب وجودنا هنا.

وضع التوافق مسج

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

اكتشف ما إذا كان يجب إزالة jQuery من السمات والإضافات الخاصة بك WordPress ?

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

ألقِ نظرة على الكود أدناه لترى ما أقصده:

/ * الوضع العادي * / $ ('. Hideable'). تشغيل ('انقر' ، الوظيفة () {$ (this) .hide () ؛}) / * وضع التوافق * / jQuery ('. Hideable'). تشغيل ('click'، function () {jQuery (this) .hide ()؛})

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

تحقق من 10 المحررين متاحة للمطورين وورد

فقط للتعبير ، إذا كنت تعرف jQuery ، فإن علامة $ هي مجرد اسم مستعار لـ jQuery () ، ثم اسم مستعار لوظيفة. بناء الجملة الأساسي هو: $ (محدد) .action () :

  • علامة الدولار لتحديد مسج
  • (محدد) للبحث عن عناصر HTML
  • إجراء jQuery () لتنفيذ هذه العناصر

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

(function ($) {$ ('. hideable'). on ('click'، function () {$ (this) .hide ()؛})}) (jQuery)؛

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

اكتشاف أيضا بالمناسبة كيف تضيف بسهولة كود على ووردبرس] دون كسر موقع الويب الخاص بك

jQuery (document) .ready (function ($) {$ ('. hideable'). on ('click'، function () {$ (this) .hide ()؛})})؛

كيفية ربط البرامج النصية الخاصة بك إلى مسج

الآن يمكنك كتابة رمز jQuery صالح على WordPress ، وسنربط عملنا بموقعنا. في ووردبريس العملية تسمى " enqueueing "(نظام الذيل). بالنسبة إلى موقع ويب HTML عادي ، يجب أن نستخدم العلامةسيناريو> لإضافة البرامج النصية.

يستطيع WordPress فعل نفس الشيء ، لكننا سنستخدم الميزات الخاصة لـ WordPress لتحقيق ذلك. بهذه الطريقة ، يدير WordPress جميع تبعياتنا لنا.

إذا كنت تعمل على سمة ، يمكنك استخدام الوظيفة wp_enqueue_script () داخل ملفك functions.php ملف. إليك كيف يمكنك القيام بذلك:

function my_theme_scripts () {wp_enqueue_script ('my-great-script'، get_template_directory_uri (). '/js/my-great-script.js'، array ('jquery')، '1.0.0'، true)؛ } add_action ('wp_enqueue_scripts'، 'my_theme_scripts') ؛

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

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

اكتشف ايضا كيفية تحميل جافا سكريبت على وورد

المعلمة الرابعة هي رقم الإصدار والخامس يسمح لـ WordPress بمعرفة مكان وضع البرنامج النصي. بشكل افتراضي ، سيتم تحميل البرامج النصية في العنوان ، وهي ممارسة سيئة ، لأنها تبطئ تحميل صفحة موقع الويب الخاص بك (المتصفحات توقف تحميل جميع الصفحات ، كلما تم حظرها est rencontré). يجب عليك تحميل جميع البرامج النصية الخاصة بك في تذييل الصفحة ، إذا أمكن عن طريق جعل المعلمة الخامسة " صحيح ".

كيفية إضافة برنامج نصي على لوحة القيادة

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

function my_admin_scripts () {wp_enqueue_script ('my-great-script'، plugin_dir_url (__FILE__). '/js/my-great-script.js'، array ('jquery')، '1.0.0'، true)؛ } add_action ('admin_enqueue_scripts'، 'my_admin_scripts') ؛

بدلا من استخدام wp_enqueue_scripts يجب علينا استخدام admin_enqueue_scripts، وهذا كل شيء !

استخدام العلامات الشرطية

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

اكتشف أيضا لدينا ملحقات 10 WordPress لتحسين سرعة تحميل مدونتك

نلقي نظرة على وadmin_enqueue_scripts الوثائق في WordPress Codex لمزيد من المعلومات.

اكتشف أيضًا بعض الإضافات المتميزة لبرنامج WordPress  

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

نحن نقدم لك هنا بعض الإضافات WordPress المتميزة التي سوف تساعدك على القيام بذلك.

1. خرائط العالم التفاعلية

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

خرائط العالم التفاعلية

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

تحميل | عرض | استضافة المواقع

2. نموذج الاتصال AJAX مع تتبع

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

ميزاته الرئيسية هي من بين أمور أخرى: أللبريد الإلكتروني ، ودعم CAPTCHA الرياضيات على النماذج والتخصيص والتكوين عبر لوحة القيادة وورد ، وإمكانية دتحديد الرد الآلي المخصص ، ودعم CSS المخصص ، والمزيد

تحميلعرضاستضافة المواقع 

3. PayPal Standard Payment Gateway for Ninja Forms

تسمح لك بوابة PayPal القياسية لنماذج Ninja بإنشاء نماذج تتكامل بسلاسة مع بوابة الدفع PayPal. 

بوابة الدفع القياسية باي بال لأشكال النينجا

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

تحميل | عرض |  استضافة المواقع

الموارد الأخرى الموصى بها

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

وفي الختام

هنا ! هذا كل شيء في هذا البرنامج التعليمي. آمل أن تعرف الآن كيفية إضافة نص إلى WordPress. لا تتردد في شارك النصائح مع أصدقائك على شبكات التواصل الاجتماعي الخاصة بك.

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

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

...