خانه » وبلاگ » روش حل خطای “jQuery is not defined”

روش حل خطای “jQuery is not defined”

اگر در ناحیه مدیریت وردپرس (یا سایر بخش‌های سایت خود) با خطای jQuery is not defined مواجه شده‌اید، نگران نباشید – شما تنها نیستید. این یک مشکل رایج است که بسیاری از کاربران وردپرس با آن روبه‌رو می‌شوند. با این حال، زمانی که سایت شما به درستی کار نمی‌کند، ممکن است ناامیدکننده باشد.

ما بیش از یک دهه است که با وردپرس کار می‌کنیم و در این مدت یاد گرفته‌ایم چگونه برخی از رایج‌ترین خطاهای وردپرس، از جمله خطای jQuery is not defined را شناسایی و رفع کنیم.

در این راهنما، توضیح خواهیم داد که چرا این خطا رخ می‌دهد و مهم‌تر از همه، چگونه می‌توانید آن را برطرف کنید. ما همه چیز را به زبانی ساده توضیح می‌دهیم تا حتی اگر توسعه‌دهنده نیستید، بتوانید این مشکل را به‌راحتی و به‌سرعت حل کنید.

چه عواملی باعث بروز خطای jQuery is not defined می‌شوند؟

jQuery یک کتابخانه جاوا اسکریپت پرکاربرد در وردپرس است که برای اجرای بسیاری از ویژگی‌های تعاملی استفاده می‌شود. با این حال، گاهی اوقات ممکن است به درستی بارگذاری نشود، که این امر می‌تواند بر عملکرد سایت شما تأثیر بگذارد.

این خطا معمولاً در ابزارهای توسعه‌دهنده مرورگر، زیر تب Console ظاهر می‌شود. به همین دلیل، بسیاری از کاربران ممکن است متوجه آن نشوند تا زمانی که بخشی از سایتشان از کار بیفتد.

اگر با خطای jQuery is not defined مواجه شدید، به این معناست که وردپرس در بارگذاری صحیح آن دچار مشکل شده است.
در طول سال‌ها، ما به تعداد زیادی از کاربران کمک کرده‌ایم تا این مشکل را برطرف کنند و متوجه شده‌ایم که این خطا معمولاً از چند دلیل رایج ناشی می‌شود:

  • قالب‌ها یا افزونه‌های قدیمی: بسیاری از کاربران با این خطا روبه‌رو می‌شوند زمانی که قالب‌ها یا افزونه‌های آن‌ها با نسخه جدید وردپرس سازگار نیستند. این مشکل اغلب پس از به‌روزرسانی‌های بزرگ وردپرس رخ می‌دهد.
  • بارگذاری نادرست اسکریپت‌ها: jQuery باید قبل از سایر فایل‌های جاوا اسکریپت بارگذاری شود. اگر این ترتیب رعایت نشود، اسکریپت‌هایی که به jQuery وابسته هستند، دچار مشکل خواهند شد. این موضوع معمولاً به دلیل کدنویسی نادرست قالب‌ها یا افزونه‌ها برای بارگذاری اسکریپت‌ها رخ می‌دهد.
  • تعارض جاوا اسکریپت‌ها: اسکریپت‌های دیگری که روی سایت شما اجرا می‌شوند، ممکن است با jQuery تعارض داشته باشند، به‌ویژه اگر به درستی بارگذاری نشده باشند. این تعارض می‌تواند باعث ایجاد خطا در jQuery شود.
  • مشکلات CDN: برخی از سایت‌ها از نسخه میزبانی شده jQuery روی یک شبکه تحویل محتوا (CDN) استفاده می‌کنند. اگر CDN در دسترس نباشد یا مسدود شود، سایت قادر به بارگذاری jQuery نخواهد بود و این خطا ایجاد می‌شود.

تمام این مسائل می‌توانند مانع از اجرای صحیح jQuery شوند. اما نگران نباشید – با تجربه‌ای که داریم، می‌توانیم شما را در مسیر حل این مشکل راهنمایی کنیم.

چگونه خطای jQuery is not defined را برطرف کنیم

برای رفع این خطا چند روش وجود دارد که می‌توانید از آن‌ها استفاده کنید. در ادامه، مؤثرترین روش‌هایی که ما برای حل این مشکل به کار برده‌ایم، آورده شده است.

پیشنهاد می‌کنیم این استراتژی‌ها را به ترتیب امتحان کنید، اما اگر ترجیح می‌دهید از یک روش خاص شروع کنید، می‌توانید از فهرست زیر استفاده کنید:

  • به‌روزرسانی وردپرس، قالب‌ها و افزونه‌ها
  • بررسی کنید که آیا jQuery به درستی بارگذاری شده است
  • اضافه کردن یک jQuery Fallback
  • رفع ترتیب بارگذاری اسکریپت‌ها (پیشرفته)
  • ویرایش فایل wp-config.php برای حل مشکلات بارگذاری jQuery
  • دریافت پشتیبانی حرفه‌ای برای رفع خطا
  • منابع اضافی: رفع مشکلات رایج وردپرس

در ادامه هر یک از این روش‌ها را بررسی می‌کنیم و در پایان منابع اضافی برای رفع مشکلات وردپرس را نیز در اختیار شما قرار می‌دهیم. بیایید شروع کنیم!

1. به‌روزرسانی وردپرس، قالب‌ها و افزونه‌ها

نرم‌افزارهای قدیمی یکی از متداول‌ترین دلایل بروز خطای jQuery is not defined هستند. قالب‌ها یا افزونه‌های قدیمی ممکن است با نسخه‌های جدید وردپرس سازگار نباشند و در نتیجه تداخل اسکریپتی ایجاد کنند. برای رفع این مشکل مراحل زیر را انجام دهید:

ابتدا، مطمئن شوید که هسته وردپرس به‌روز باشد: به Dashboard » Updates بروید. در صورت وجود به‌روزرسانی، روی گزینه ‘Update to version X.X.X’ کلیک کنید.

راهنمای کامل ما را برای به‌روزرسانی ایمن وردپرس به نسخه جدید مشاهده کنید تا جزئیات بیشتری در این مورد بدانید.

به‌روزرسانی‌های مربوط به افزونه‌های وردپرس در زیر بخش به‌روزرسانی هسته نمایش داده خواهند شد.

می‌توانید همه آن‌ها را انتخاب کرده و روی ‘Update Plugins’ کلیک کنید.

در نهایت، به‌روزرسانی‌های مربوط به قالب‌های وردپرس شما نمایش داده خواهند شد.

کافیست همه آن‌ها را انتخاب کرده و روی ‘Update Themes’ کلیک کنید.

2. بررسی کنید jQuery به درستی بارگذاری شده باشد

قبل از امتحان روش‌های پیشرفته‌تر، لازم است بررسی کنید که آیا jQuery واقعاً در وب‌سایت شما بارگذاری شده است یا خیر. این مرحله به شما کمک می‌کند تا تأیید کنید که jQuery در دسترس است و به درستی کار می‌کند.

برای این کار: در هر جایی از وب‌سایت وردپرس خود کلیک راست کرده و گزینه ‘View Page Source’ را انتخاب کنید.

نکته: می‌توانید از کلیدهای ترکیبی Ctrl + U در ویندوز یا Cmd + Option + U در مک استفاده کنید تا کد منبع صفحه را باز کنید.

این کار کد HTML و JavaScript خام صفحه شما را نمایش خواهد داد.

سپس کلیدهای Ctrl + F (یا Cmd + F در مک) را فشار دهید تا نوار جستجو ظاهر شود و عبارت ‘jquery.min.js’ را در آن وارد کنید.

اگر jQuery به درستی بارگذاری شده باشد، باید مرجعی از آن را در کد مشاهده کنید.

روش دیگر برای بررسی jQuery می‌توانید از ابزار Inspect Tool مرورگر خود استفاده کنید. برای این کار: به تب ‘Network’ بروید و صفحه را دوباره بارگذاری کنید.

نکته: در ویندوز با فشار دادن F12 روی صفحه‌کلید می‌توانید ابزار Inspect را باز کنید. در مک با فشار دادن Options + Cmd + I می‌توانید به این ابزار دسترسی پیدا کنید.

سپس در نوار جستجو عبارت ‘jquery’ را وارد کنید. اگر jQuery بارگذاری شده باشد، در این قسمت فهرست خواهد شد.

اگر در هیچ‌یک از دو روش jQuery را مشاهده نکردید، ممکن است مشکل مربوط به نحوه بارگذاری (enqueue) آن در وردپرس باشد. در مراحل بعدی، شما را در رفع این مشکل راهنمایی خواهیم کرد.

3. اضافه کردن jQuery Fallback

گاهی اوقات، یک اسکریپت در وب‌سایت شما ممکن است از طریق یک CDN برای بارگذاری jQuery استفاده کند که دچار مشکلات اتصال باشد. در این صورت، jQuery بارگذاری نمی‌شود و باعث بروز خطا خواهد شد.

برای رفع این مشکل: یک jQuery fallback به وب‌سایت وردپرس خود اضافه کنید. این کار اطمینان می‌دهد که jQuery همیشه به درستی بارگذاری شود.

مکان مناسب برای قرار دادن کد باید کد مربوطه را در بخش وب‌سایت خود قرار دهید تا jQuery ابتدا بارگذاری شود. با این حال، ویرایش مستقیم فایل‌های قالب توصیه نمی‌شود. چرا که در بسیاری موارد مشاهده شده تغییرات کاربر با به‌روزرسانی قالب از بین رفته است.

بهترین روش برای اضافه کردن کد بهترین روش برای اضافه کردن کد دلخواه در وردپرس استفاده از افزونه WPCode است. این افزونه یک مدیر قطعه کد (Code Snippet Manager) است که به شما اجازه می‌دهد بدون ایجاد مشکل در وب‌سایت، کدهای شخصی‌سازی شده را به صورت امن اضافه کنید.

مراحل نصب و استفاده از WPCode: افزونه WPCode را نصب و فعال کنید.

نکته: نسخه رایگان این افزونه با نام WPCode Lite نیز در دسترس است.

پس از فعال‌سازی، به مسیر Code Snippets » + Add Snippet بروید. روی دکمه ‘Use snippet’ در قسمت ‘Add Your Custom Code (New Snippet)’ کلیک کنید.

در ویرایشگر کد، برای قطعه کد خود یک نام مانند ‘jQuery Fallback’ انتخاب کنید.

سپس برای گزینه ‘Code Type’، گزینه ‘HTML Snippet’ را انتخاب کنید.

Next, paste the following code in the ‘Code Preview’ box:

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.6.0/jquery.min.js"></script>
<script>
window.jQuery || document.write('<script src="/wp-includes/js/jquery/jquery.js"><\/script>')
</script>

سپس به بخش ‘Insertion’ اسکرول کنید.

در این قسمت می‌توانید مشخص کنید که WPCode این کد را در کدام بخش بارگذاری کند. مطمئن شوید که گزینه ‘Site Wide Header’ را انتخاب کرده‌اید.

در نهایت، روی دکمه ‘Save Snippet’ در بالای صفحه کلیک کنید تا کد سفارشی شما ذخیره شود.

پس از آن، فراموش نکنید که با تغییر وضعیت سوئیچ به ‘Active’، قطعه کد را فعال کنید.

4. رفع ترتیب بارگذاری اسکریپت‌ها (پیشرفته)

یکی از دلایل رایج خطای ‘jQuery is not defined’ این است که jQuery بعد از سایر اسکریپت‌هایی که به آن وابسته هستند بارگذاری می‌شود. با اصلاح ترتیب بارگذاری اسکریپت‌ها، اطمینان حاصل می‌شود که jQuery همیشه ابتدا بارگذاری شده و از بروز تضاد جلوگیری می‌شود.
اگر می‌دانید کدام اسکریپت به jQuery وابسته است، می‌توانید آن اسکریپت را به‌درستی enqueue کنید و jQuery را به‌عنوان یک وابستگی مشخص کنید.

اگر این خطا به دلیل بارگذاری jQuery پس از اسکریپت‌های وابسته باشد، می‌توانید با استفاده از WPCode ترتیب بارگذاری اسکریپت‌ها را اصلاح کنید.

ابتدا افزونه WPCode را نصب و فعال کنید، یا از نسخه رایگان آن به نام WPCode Lite استفاده کنید.

پس از فعال‌سازی، به مسیر Code Snippets » + Add Snippet بروید و روی دکمه ‘Use snippet’ در زیر گزینه ‘Add Your Custom Code (New Snippet)’ کلیک کنید.

در ویرایشگر کد، برای قطعه کد خود نامی مانند ‘Fix Script Loading Order’ انتخاب کنید و نوع کد را روی ‘PHP snippet’ تنظیم کنید.

سپس کد زیر را اضافه کنید تا اطمینان حاصل شود که jQuery به‌عنوان یک وابستگی برای هر اسکریپت سفارشی enqueue شده است:

wp_enqueue_script( 'your-script-handle', get_template_directory_uri() . '/js/your-script.js', array( 'jquery' ), null, true );

فراموش نکنید که ‘your-script-handle’ را با یک نام معنادار برای شناسایی اسکریپت جایگزین کنید. همچنین، ‘/js/your-script.js’ را با نام واقعی فایل اسکریپت در پوشه /js/ قالب خود جایگزین کنید.

بخش array(‘jquery’) در کد، تضمین می‌کند که jQuery ابتدا بارگذاری شود.

پس از اضافه کردن کد، به قسمت ‘Insertion’ بروید و گزینه ‘Site Wide Header’ را انتخاب کنید تا مطمئن شوید اسکریپت در بخش مناسبی از HTML سایت شما بارگذاری می‌شود.

در نهایت، روی دکمه ‘Save Snippet’ در بالای صفحه کلیک کنید تا کد سفارشی شما ذخیره شود.

پس از آن، فراموش نکنید که با تغییر وضعیت سوئیچ به ‘Active’، قطعه کد را فعال کنید.

استفاده از WPCode برای enqueue کردن صحیح اسکریپت‌ها، تضمین می‌کند که jQuery به ترتیب درست بارگذاری شود. اگر مشکل از این موضوع باشد، این روش باید خطا را برطرف کند.

۵. ویرایش فایل wp-config.php برای رفع مشکلات بارگذاری jQuery

اگر روش‌های دیگر مؤثر نبودند، ویرایش فایل wp-config.php می‌تواند با کنترل نحوه مدیریت بارگذاری اسکریپت‌ها توسط وردپرس کمک‌کننده باشد.

این روش زمانی مفید است که مشکلاتی مانند ترکیب اسکریپت‌ها یا مسیرهای فایل باعث ایجاد خطای ‘jQuery is not defined’ شده باشند.

مراحل انجام این روش:ابتدا به فایل wp-config.php دسترسی پیدا کنید. می‌توانید این کار را با استفاده از یک کلاینت FTP مانند FileZilla یا از طریق File Manager در کنترل پنل هاست خود انجام دهید.

فایل wp-config.php در دایرکتوری اصلی نصب وردپرس (معمولاً در پوشه public_html) قرار دارد.

پس از یافتن فایل، آن را برای ویرایش باز کنید و کد زیر را درست قبل از خط / That’s all, stop editing! Happy blogging. / اضافه کنید:

/** Absolute path to the WordPress directory. */
if ( !defined('ABSPATH') )
define('ABSPATH', dirname(FILE) . '/');
define('CONCATENATE_SCRIPTS', false);

توضیحات کد:

۱. تعریف ABSPATH اطمینان می‌دهد که وردپرس مسیر صحیح به فایل‌های اصلی خود را شناسایی کند؛ این کار می‌تواند از بروز مشکلات مربوط به بارگذاری jQuery جلوگیری کند.

۲. خط CONCATENATE_SCRIPTS، ترکیب اسکریپت‌ها را غیرفعال می‌کند. این کار باعث می‌شود وردپرس هر اسکریپت را به صورت جداگانه بارگذاری کند؛ این روش از بروز تداخل (conflict) که هنگام ترکیب اسکریپت‌ها ایجاد می‌شود، جلوگیری می‌کند.

پس از اضافه کردن کد تغییرات خود را ذخیره کرده و سایت خود را بازخوانی (Reload) کنید تا ببینید آیا خطا برطرف شده است یا خیر.

غیرفعال کردن ترکیب اسکریپت‌ها می‌تواند یک راه حل ساده اما مؤثر برای رفع مشکلات مربوط به jQuery باشد؛ مخصوصاً زمانی که روش‌های دیگر کارساز نبوده باشند.

منبع: https://www.wpbeginner.com


دیدگاه‌ها

دیدگاهتان را بنویسید

نشانی ایمیل شما منتشر نخواهد شد. بخش‌های موردنیاز علامت‌گذاری شده‌اند *