نحوه کوچک کردن پرونده های CSS / JavaScript در وردپرس

آیا می خواهید پرونده ها را در سایت وردپرس خود کوچک کنید؟ کوچک کردن پرونده های CSS و Javascript وردپرس می تواند باعث بارگذاری سریعتر آنها و سرعت بخشیدن به سایت وردپرس شما شود. در این راهنما ، ما به شما نشان می دهیم که چگونه برای بهبود عملکرد و سرعت ، فایل های CSS / Javascript را در وردپرس کوچک کنید.

How to Minify CSS/JavaScript Files in WordPress

Minify چیست و چه زمانی به آن نیاز دارید؟ h4>

اصطلاح “Minify” برای توصیف روشی استفاده می شود که اندازه پرونده وب سایت شما را کوچکتر می کند. با حذف فضاهای سفید ، خطوط و نویسه های غیرضروری از کد منبع به این هدف می رسد.

معمولاً توصیه می شود فقط برای پرونده هایی که به مرورگرهای کاربر ارسال می شوند استفاده شود. این شامل HTML ، CSS ، و پرونده های JavaScript . شما می توانید PHP نیز استفاده می کند اما PHP یک سرور است در کنار زبان برنامه نویسی و کوچک کردن آن سرعت بارگذاری صفحه را برای کاربران شما بهبود نمی بخشد.

مزیت بارز کوچک کردن پرونده ها بهبود سرعت وردپرس و عملکرد پرونده های کم حجم سریعتر بارگیری و بهبود می یابند.

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

در اینجا مثالی از کد CSS عادی آورده شده است:

body {
margin: 20px؛
padding: 20px؛
color: # 333333؛
background: # f7f7f7؛
}
h1 {
font-size: 32px؛
color # 222222؛
margin-bottom: 10px؛
}

بعد از کوچک کردن کد ، اینگونه به نظر می رسد:

body {margin: 20px؛ padding: 20px؛ color: # 333؛ background: # f7f7f7} h1 {font-size: 32px؛ margin-bottom: 10px}

اگر در صدد دستیابی به امتیاز 100/100 در Google Pagespeed یا ابزار GTMetrix ، سپس کوچک کردن CSS و JavaScript نمره شما را به طور قابل توجهی بهبود می بخشد.

با این اوصاف ، بیایید نگاهی به چگونگی کوچک کردن آسان CSS / JavaScript در سایت وردپرس خود بیاندازیم.

CSS / Javascript را در وردپرس کوچک کنید h4>

اولین کاری که باید انجام دهید نصب و فعال کردن افزونه بهتر WordPress Minify . برای جزئیات بیشتر ، به راهنمای گام به گام ما در نحوه نصب افزونه وردپرس .

پس از فعال شدن ، افزونه مورد جدیدی از منو با عنوان “BWP Minify” را به نوار مدیر WordPress شما اضافه می کند. با کلیک بر روی آن ، به صفحه تنظیمات افزونه منتقل می شوید.

BWP Minify settings

در صفحه تنظیمات ، باید دو گزینه اول را بررسی کنید تا به صورت خودکار فایلهای JavaScript و CSS را در سایت وردپرس خود کوچک کنید.

اکنون می توانید بر روی دکمه ذخیره تغییرات کلیک کنید تا تنظیمات خود را ذخیره کنید.

گزینه های پیشرفته دیگری نیز در این صفحه وجود دارد. تنظیمات پیش فرض برای اکثر وب سایت ها مفید خواهد بود ، اما می توانید این گزینه ها را مورد به مورد بررسی و تغییر دهید.

بعد ، باید به وب سایت خود مراجعه کنید. روی هر نقطه کلیک راست کرده و سپس “مشاهده صفحه منبع” را از فهرست مرورگر انتخاب کنید.

View page source of a WordPress site

اکنون کد منبع HTML تولید شده توسط سایت وردپرس خود را مشاهده خواهید کرد. اگر خوب دقت کنید ، متوجه می شوید که این پلاگین به جای مضامین و افزونه های وردپرس شما ، پرونده های CSS / JavaScript را از پوشه خود پلاگین بارگیری می کند.

اینها نسخه های کوچک شده پرونده های CSS و JavaScript اصلی شما هستند. افزونه بهتر WordPress Minify آنها را در حافظه پنهان نگه داشته و نسخه های کوچک شده را به مرورگرها ارائه می دهد.

این همه ، امیدواریم این مقاله به شما کمک کند یاد بگیرید چگونه سایت وردپرس خود را کوچک کنید. همچنین ممکن است بخواهید راهنمای نهایی ما را در مورد چگونگی برای مبتدیان.

اگر این مقاله را دوست داشتید ، لطفاً در کانال YouTube برای آموزش های ویدئویی وردپرس. همچنین می توانید ما را در Twitter و فیس بوک .

منبع:
https://www.wpbeginner.com/plugins/how-to-minify-css-javascript-files-in-wordpress/.

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