
به اشتراک بگذارید
آموزش وردپرس | بلاگ وبداده
حل مشکل کار نکردن jQuery در قالب وردپرس
- شایعترین علت: استفاده از میانبر
$در حالی که وردپرس jQuery را در حالت no-conflict لود میکند. - تداخل نسخهها: قالب یا افزونه نسخهٔ جداگانهای از jQuery را لود میکند و با نسخهٔ هستهٔ وردپرس تداخل میکند.
- ترتیب بارگذاری: افزونهٔ سرعت با defer/async باعث میشود jQuery بعد از اسکریپتهای وابسته لود شود.
- کد قدیمی: قالب/افزونهٔ قدیمی از توابع منسوخشدهٔ jQuery استفاده میکند که در نسخهٔ 3.x حذف شدهاند.
- راهکار امن: ابتدا کنسول را بخوانید، سپس no-conflict و enqueue درست را اصلاح کنید و در نهایت تداخل افزونه/قالب را پیدا کنید.
در یک جمله
$(document).ready به فرم no-conflict یعنی jQuery(document).ready(function($){ ... }) تغییر دهید و مطمئن شوید jQuery بهدرستی enqueue شده است؛ بقیهٔ موارد به تداخل افزونه یا افزونهٔ سرعت برمیگردد.حل مشکل کار نکردن jQuery در قالب وردپرس چیست و چرا رخ میدهد؟
jQuery صدا زده شود، نه با لقب کوتاه $ (این همان حالت no-conflict است تا با کتابخانههای دیگر قاطی نشود). حالا اگر یک قالب یا افزونه بدون توجه به این قانون، مترجم را با لقب کوتاه صدا بزند یا مترجم دومی استخدام کند، سوءتفاهم پیش میآید و کدها اجرا نمیشوند.نکتهٔ کلیدی
$(document).ready استفاده کنید؛ چون میانبر $ در سطح سراسری تعریف نشده و همین موضوع منشأ بخش بزرگی از خطاهای «$ is not a function» است.
مراحل عیبیابی و رفع مشکل jQuery (گامبهگام)
گام اول: خطا را در کنسول مرورگر بخوانید
F12 یا Ctrl+Shift+I ابزار توسعهدهندهٔ مرورگر را باز کنید و به سربرگ Console بروید. پیام خطا معمولاً دقیقاً میگوید مشکل کجاست: «jQuery is not defined» یعنی خودِ کتابخانه لود نشده، «$ is not a function» یعنی مشکل از no-conflict و میانبر $ است، و خطای 404 روی فایل jquery یعنی مسیر بارگذاری اشکال دارد. بررسی همزمان فایل ارور لاگ سایت هم کمک میکند ریشهٔ خطاهای سمت سرور را پیدا کنید.گام دوم: کد را به فرم no-conflict اصلاح کنید
$(document).ready از فرم زیر استفاده کنید:// وردپرس jQuery را در حالت no-conflict لود میکند؛ پس میانبر $ سراسری نیست.
// بهجای $(document).ready از فرم زیر استفاده کنید تا $ داخل تابع در دسترس باشد:
jQuery(document).ready(function ($) {
// اینجا با خیال راحت از $ استفاده کنید
$('.menu-toggle').on('click', function () {
$('#main-nav').slideToggle();
});
});// اگر کل فایل شما از $ استفاده میکند، آن را در یک IIFE بپیچید:
( function ( $ ) {
'use strict';
$( function () {
// کد شما؛ $ اینجا معادل jQuery است
$( '.faq-item' ).on( 'click', function () {
$( this ).toggleClass( 'is-open' );
} );
} );
} )( jQuery );نکتهٔ مهم دربارهٔ $
گام سوم: jQuery را بهدرستی enqueue کنید
wp_enqueue_script بارگذاری کنید و jQuery را بهعنوان وابستگی اعلام کنید تا وردپرس تضمین کند jQuery همیشه اول لود میشود. این کد را در فایل functions.php قالب فرزند قرار دهید:<?php
// اسکریپت سفارشی را با اعلام jquery بهعنوان وابستگی enqueue کنید
// این کد را در functions.php قالب فرزند قرار دهید
add_action( 'wp_enqueue_scripts', 'webdade_enqueue_theme_scripts' );
function webdade_enqueue_theme_scripts() {
wp_enqueue_script(
'theme-main', // نام دلخواه اسکریپت
get_stylesheet_directory_uri() . '/js/main.js',
array( 'jquery' ), // وابستگی: jQuery حتماً اول لود میشود
'1.0.0',
true // بارگذاری در فوتر
);
}PHPهشدار: ویرایش نادرست functions.php سایت را از کار میاندازد
گام چهارم: تداخل افزونه یا قالب را پیدا کنید
گام پنجم: jQuery را از defer/async افزونهٔ سرعت مستثنا کنید
jquery.js (یا jquery.min.js و jquery-core) را به فهرست استثناهای defer/async اضافه کنید. سپس کش را کامل پاک کنید و دوباره تست بگیرید.گام ششم: برای کدهای قدیمی از افزونهٔ Migrate کمک بگیرید

| پیام خطا در کنسول | علت اصلی | راهحل پیشنهادی |
|---|---|---|
| jQuery is not defined | اسکریپت قبل از jQuery لود شده | با wp_enqueue_script و وابستگی jquery بارگذاری کنید |
| $ is not a function | استفاده از $ بدون رعایت no-conflict | کد را به فرم jQuery(function($){…}) ببرید |
| Uncaught TypeError روی توابع قدیمی | قالب/افزونه سازگار با jQuery 1.x | قالب و افزونه را آپدیت یا Migrate Helper را فعال کنید |
| فایل jquery با خطای 404 | مسیر یا CDN اشتباه/تداخل نسخه | نسخهٔ دستی را حذف و از jQuery هسته استفاده کنید |
| کدها فقط با افزونهٔ کش خراب میشوند | defer/async روی jquery | jquery.js را از defer/async مستثنا و کش را پاک کنید |
معایب، محدودیتها و نکاتی که باید صادقانه بدانید
- ریسک ویرایش functions.php: یک اشتباه کوچک میتواند سایت را با خطای 500 از دسترس خارج کند؛ بکاپ و استفاده از قالب فرزند ضروری است.
- افزونهٔ Migrate راهحل دائمی نیست: فقط سازگاری موقت میدهد و در آینده حذف خواهد شد؛ راهحل واقعی بهروزرسانی کد است.
- قالبهای نالشده و قدیمی: اگر قالب یا افزونهای بهروزرسانی نمیشود، این مشکل مدام برمیگردد و بهتر است جایگزینش کنید.
- وابستگی به کش: بعد از هر اصلاح باید همهٔ لایههای کش (افزونه، مرورگر، CDN) را پاک کنید وگرنه تصور میکنید راهحل جواب نداده است.
نقلقول از منبع رسمی وردپرس
نقش هاست وردپرس وبداده در عیبیابی بیدردسر
✅ زیرساخت نسل جدید HPE (Gen11 و Gen10) برای پایداری و پاسخ سریع سرور.
✅ دیتاسنترهای ایران، هلند و آلمان برای انتخاب نزدیکترین لوکیشن به مخاطبان شما.
✅ پشتیبانی فنی ۲۴ ساعته برای کمک در ویرایش کد، بکاپ و رفع خطای احتمالی.
پرسشهای پرتکرار دربارهٔ کار نکردن jQuery در وردپرس
چرا در وردپرس نمیتوانم مستقیم از $ استفاده کنم؟
چون وردپرس jQuery را در حالت no-conflict لود میکند تا با کتابخانههای جاوااسکریپت دیگر تداخل نکند. در این حالت میانبر $ در سطح سراسری تعریف نمیشود. راهحل این است که از فرم jQuery(document).ready(function($){ … }) استفاده کنید یا کل کد را داخل یک IIFE بپیچید و jQuery را بهعنوان $ به آن پاس دهید.
خطای «jQuery is not defined» دقیقاً یعنی چه؟
یعنی اسکریپتی که به jQuery وابسته است، قبل از لودشدن خودِ کتابخانهٔ jQuery اجرا شده است. رایجترین راهحل، بارگذاری اسکریپت با تابع wp_enqueue_script و اعلام jquery بهعنوان وابستگی است تا وردپرس ترتیب درست را تضمین کند.
این مشکل بعد از بهروزرسانی وردپرس شروع شد؛ چه کار کنم؟
از وردپرس 5.6 نسخهٔ jQuery به 3.5.1 ارتقا یافت و برخی توابع قدیمی حذف شدند. اگر قالب یا افزونهٔ قدیمی دارید، اول آن را بهروزرسانی کنید. اگر فعلاً امکانپذیر نیست، افزونهٔ رسمی و موقتی Enable jQuery Migrate Helper را نصب کنید تا سازگاری برگردد.
چطور بفهمم مشکل از کدام افزونه یا قالب است؟
افزونهها را یکییکی غیرفعال کنید و هر بار سایت را تست کنید؛ وقتی مشکل برطرف شد، افزونهٔ آخر مقصر است. برای قالب هم موقتاً یک قالب پیشفرض وردپرس را فعال کنید. اگر با قالب پیشفرض مشکل نبود، ریشه در قالب شماست.
آیا ویرایش functions.php خطرناک است؟
بله، یک خطای نگارشی کوچک میتواند کل سایت را با خطای 500 از کار بیندازد. برای همین همیشه قبل از ویرایش بکاپ کامل بگیرید، کد را در قالب فرزند قرار دهید و اگر با کدنویسی راحت نیستید از افزونهٔ Code Snippets استفاده کنید تا در صورت خطا بتوانید سریع غیرفعالش کنید.
چرا با فعالبودن افزونهٔ کش، jQuery خراب میشود؟
چون بعضی افزونههای سرعت به همهٔ اسکریپتها defer یا async میدهند و باعث میشوند jQuery دیرتر از اسکریپتهای وابسته لود شود. راهحل این است که فایل jquery.js را در تنظیمات افزونه از defer/async مستثنا کنید و بعد کش را کامل پاک کنید.
بعد از اصلاح کد، چرا هنوز مشکل هست؟
به احتمال زیاد کش قدیمی نمایش داده میشود. همهٔ لایههای کش شامل افزونهٔ کش، کش مرورگر و CDN را پاک کنید و صفحه را در حالت ناشناس باز کنید. اگر باز هم خطا بود، کنسول را دوباره بخوانید؛ ممکن است خطای دومی وجود داشته باشد.
آیا لود دو نسخهٔ jQuery همیشه مشکلساز است؟
بله، بارگذاری همزمان دو نسخهٔ jQuery تقریباً همیشه به تداخل و کار نکردن اسکریپتها منجر میشود. بهترین کار این است که از همان نسخهٔ همراه هستهٔ وردپرس استفاده کنید و نسخهٔ دستی یا CDN اضافی را که قالب/افزونه لود میکند حذف کنید.
جمعبندی و قدم بعدی شما
جمعبندی سریع
✅ کد را به فرم jQuery(function($){…}) یا IIFE ببرید.
✅ اسکریپت را با wp_enqueue_script و وابستگی jquery لود کنید.
✅ تداخل افزونه/قالب و defer/async افزونهٔ سرعت را بررسی و کش را پاک کنید.



