افزایش سرعت و پرفورمنس Conditional Enqueue Hook پلتفرم: wordpress متوسط (Medium) سطح ریسک: پایین و بی‌خطر (Low Risk)

بارگذاری شرطی فایل‌های CSS در صفحات دلخواه وردپرس (Conditional CSS)

تست‌شده و بازبینی‌شده در 1405/06/29 ۲۵۸ بار کپی ۲۶۵۳ مشاهده
پاسخ سریع و خلاصه کاربردی (Quick Answer)

با تابع `wp_enqueue_style` درون تگ شرطی `is_page('contact')` یا `is_singular('product')` فایل‌های CSS را منحصراً در صفحه مورد نظر لود کنید.

مشخصات فنی و شناسنامه کد (Code Information)

بازبینی: 1405/06/29
پلتفرم اجرایی (Platform) wordpress
نوع کد (Code Type) Conditional Enqueue Hook
محل قرارگیری فایل (Location) functions.php
سطح دشواری (Difficulty) متوسط (Medium)
سطح ریسک (Risk Level) پایین و بی‌خطر (Low Risk)
نیاز به بکاپ اولیه؟ خیر (کم‌ریسک)
سازگاری با وردپرس تمامی نسخه‌ها
سازگاری با ووکامرس و HPOS سازگار
|
<?php
/**
 * بارگذاری هوشمند و شرطی فایل‌های CSS بر اساس نوع صفحه
 */
function bisco_conditional_enqueue_styles() {
    // بارگذاری استایل فرم تماس فقط در برگه تماس با ما
    if ( is_page( 'contact-us' ) ) {
        wp_enqueue_style(
            'bisco-contact-style',
            get_stylesheet_directory_uri() . '/assets/css/contact.css',
            array(),
            '1.0.0'
        );
    }

    // بارگذاری استایل گالری فقط در پست‌های تکی وبلاگ
    if ( is_single() && 'post' === get_post_type() ) {
        wp_enqueue_style(
            'bisco-single-gallery',
            get_stylesheet_directory_uri() . '/assets/css/gallery.css',
            array(),
            '1.0.0'
        );
    }
}
add_action( 'wp_enqueue_scripts', 'bisco_conditional_enqueue_styles', 20 );

کد را کجا قرار دهیم؟ (Placement Guide)

کد را در functions.php قرار دهید و اسلاگ برگه‌ها را مطابق سایت خود تنظیم کنید.

مسیر فایل: functions.php

این کد چگونه کار می‌کند؟ (How it Works)

تابع وردپرسی is_page یا is_single ساختار صفحه را می‌سنجد و تنها در صورت صحیح بودن شرط، استایل را به صف بارگذاری (Queue) می‌فرستد.

چه زمانی از این کد استفاده کنیم؟ (Use Cases)

در وب‌سایت‌های حرفه‌ای برای حفظ نمره سبز سرعت صفحات اصلی و فرود (Landing Pages).

چه زمانی نباید از این کد استفاده کنیم؟ (Anti-patterns)

برای استایل‌های پایه قالب (Global Styles) که در تمام صفحات مشترک هستند.

پیش‌نیازهای اجرا

وردپرس ۳.۰ به بالا.

نحوه تست و اطمینان از عملکرد

صفحه تماس را باز کنید؛ استایل باید لود شود. سپس صفحه اصلی را باز کنید؛ در تب Network فایل contact.css نباید وجود داشته باشد.

نحوه بازگردانی سریع (Rollback)

توابع شرطی را از functions.php بردارید.

خطاهای رایج و راه‌حل رفع

استفاده از توابع شرطی قبل از اکشن wp_enqueue_scripts (در اکشن init توابع شرطی صفحه به درستی مقداردهی نشده‌اند).

ملاحظات و نکات امنیتی

استفاده از get_stylesheet_directory_uri برای ارجاع امن به مسیر چایلدتم.

تاثیر بر سرعت و پرفورمنس

کاهش حجم DOM و حذف صدها کیلوبایت CSS بلااستفاده (Unused CSS) از دید آزمون‌های گوگل.

پرسش‌های متداول پیرامون این کد (FAQ)

بله، با wp_dequeue_style می‌توانید فایل افزونه‌ها را در سایر صفحات از صف خارج کنید.
منابع و مستندات رسمی بررسی‌شده (Official Sources):

سبد خرید شما

0 افزونه

سبد خرید شما خالی است

هنوز محصولی را به سبد خرید اضافه نکرده‌اید. می‌توانید از افزونه‌های اختصاصی ما دیدن فرمایید.

مشاهده فروشگاه افزونه‌ها

ثبت درخواست مشاوره

با تکمیل فرم زیر، کارشناسان فنی بیسکو وب در سریع‌ترین زمان ممکن با شما تماس می‌گیرند.

مشاور
پشتیبانی و مشاوره تخصصی
پاسخگویی سریع کارشناسان
09903336117