روش استاندارد فراخوانی فایل های css و js در قالب وردپرس

در این آموزش روش استاندارد فراخوانی فایل های css و js در قالب وردپرس را بررسی خواهیم کرد و روش های نادرست را هم مثال خواهیم زد.استفاده و فراخوانی نادرست فایل های در وردپرس می تواند مشکلات زیادی را برای سایت وردپرسی ایجاد کند و بهینه اسزی را کاهش دهد، اگر شما هم تاکون جزو این دسته از افراد هستید پیشنهاد میکنیم در ادامه با ما همراه باشید.

روش نادرست اضافه کردن فایل های استایل و اسکریپت

در گذشته ما به صورت مستقیم فایل های css را در سربرگ و فایل های جاوا اسکریپت را در پابرگ فراخوانی میکردیم که در حال حاضر این روش فقط در html امکانپذیر است و ما نمی توانیم از آن در وردپرس استفاده نماییم.کد زیر نمونه ای از اضافه کردن فایل های css و js برای شما قرار داده شده

<!DOCTYPE html>
<html lang="en" dir="rtl">
   <head>
      <meta charset="UTF-8">
      <link rel="stylesheet" href="name.css">
   </head>
   <body>
      <script src="name.js"></script>
   </body>
</html>

اضافه کردن فایل های css و js در وردپرس

وردپرس برای فراخوانی فایل های استایل و اسکریپت در خود دارای تابعی به نام wp_enqueue_style می باشد.با این روش می توانیم بسیار راحت روی تمامی فایل ها مدیریت داشته باشیم.

روش صحیح اضافه کردن فایل های css و js به وردپرس

حال نوبت شروع کار است بنابراین فانکشنی ایجاد میکنیم و کد آن را در فایل functions.php قرار می دهیم.در کد زیر ما یک فایل استایل به نام style.css در فولدر css و یک فایل اسکریپت به نام script.js در فولدر js در روت اصلی قالب خود قرار داده ایم.

function dastyarweb_scripts() {
    wp_enqueue_style( 'style-name', get_template_directory_uri() . '/css/style.css' );
    wp_enqueue_script( 'script-name', get_template_directory_uri() . '/js/script.js', array(), '1.0.0', true );
}
add_action( 'wp_enqueue_scripts', 'dastyarweb_scripts' );

نظرات

دیدگاه و سوالات قبل از خرید

جهت ارسال نظر ابتدا وارد شوید

مشخصات