بارگزاری CSS و JS در قالب وردپرس به صورت Lazy
وردپرس روش داخلی و مستقیمی برای درج اسکریپتها و استایلها به طور مستقیم در فوتر سایت ارائه نمیدهد. به طور پیشفرض، wp_enqueue_script و wp_enqueue_style فایلها را در بخش سرآمد یا head سایت درج میکنند. با این حال، برای بهینهسازی عملکرد، به ویژه برای بهبود Core Web Vitals و تقویت سئو، اغلب بسیار مهم است که استایلها و اسکریپتهای غیرضروری را به فوتر منتقل کنید. بارگذاری همه چیز در هدر میتواند رندر سایت را مسدود کند، زمان بارگذاری صفحه را افزایش دهد و به تجربه کاربر آسیب برساند.
در این مقاله، ما یک روش قابل اعتماد و سازگار با وردپرس را برای درج صحیح اسکریپتها و استایلها در فوتر بررسی خواهیم کرد که به شما کمک میکند برخی موارد را در پایین سایت بارگزاری کنید.
|
1 2 3 4 5 6 7 8 9 |
add_action( 'wp_print_footer_scripts', 'lazy_enqueue_depends', 0 ); function lazy_enqueue_depends() { if ( $GLOBALS[ 'pagenow' ] !== 'wp-login.php' ) { wp_enqueue_style( 'roka', get_template_directory_uri() . '/css/all.css', false, 1.1, 'all' ); wp_enqueue_script( 'roka', get_template_directory_uri() . '/js/base.min.js', array ( 'jquery' ), 1.1, true ); } } |
این کد بررسی میکند که صفحهی فعلی صفحات ورود و ثبت نام و فراموشی رمز عبور پیشفرض وردپرس نباشد و از بارگزاری فایلهای جانبی در این صفحات جلوگیری میکند.
در گذشته و پیش از اینکه سرعت سایتها تا حد امروزی مورد توجه باشد، معمول بود که فایلهای جانبی در بخش Head بارگزاری میشدند ولی امروزه توصیهها به این سمت است که فایلهای جانبی تا حد امکان دیر بارگزاری شوند تا مانع نمایش محتوای اصلی صفحه نباشند.
نکته کارایی
نکتهای که نباید فراموش کنید این است که امکان بارگزاری تمام اسکریپتها در پایین سایت وجود ندارد و برای سازگاری با افزونهها یا عملکردهای ضروری سایت ممکن است وجود برخی موارد در بالای سایت ضروری باشند
تکلیف این دو فایل چی میشه
/css/all.css
/js/base.min.js
خودش میسازه یا ما باید تو تم تعریف کنیم؟ فکر کنم اموزش ناقصه
با سلام
این کدها برای بارگزاری فایلهای شما در انتهای قالب هستند. اگر فایلی ندارید که در قالب بارگزاری کنید، این کدها کاری برای شما انجام نمیدهند