ملت وب مرجع دانلود قالب وردپرس فارسی و قالب فارسی وردپرس و قالب html و افزونه وردپرس
24
ساعت با شما

04144235034

آیا میدانستید دلیل اصلی محبوبیت ملت وب در چیست ؟ ملت وب به عنوان مرجعی پیشرو در پشتیبانی مشتریان خود توانسته رضایت کاربران را در برگیرد در واقع در ملت وب وب شخص پاسخگو نیاز های شما نیست در اینجا یک شرکت معتبر و پاسخگو در کنار مشتریان خود می باشد و تمام مسئولیت پشتیبانی بر عهده شرکت می باشد و نقطه قوت فوق العاده بالای برای یک وب سایت می باشد
فروش محصولات
فروش محصولات شما

آموزش حذف css های استفاده نشده در وردپرس

آموزش حذف css های استفاده نشده در وردپرس
امین صفرپور
امین صفرپور
Asset 1
۱۴۰۰-۰۳-۲۸
Asset 2

دانلود شده

0
Asset 1

نظرات

0
Asset 1

بازدید شده

235
آموزش حذف css های استفاده نشده در وردپرس

آیا می خواهید CSS استفاده نشده را در وردپرس حذف کنید تا سایت شما سریعتر بارگیری شود؟

CSS استفاده نشده هر کد CSS است که توسط قالب یا افزونه های وردپرس شما اضافه شده است که واقعاً نیازی به آن ندارید. حذف این کد CSS عملکرد وردپرس و تجربه کاربری را بهبود می بخشد .

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

 

CSS استفاده نشده در وردپرس چیست؟

CSS استفاده نشده در وردپرس کد CSS است که در وب سایت شما بارگیری می شود اما در واقع برای نمایش صفحه مورد نیاز نیست.

کد اضافی می تواند باعث شود مرورگر  مدت زمان بیشتری برای ارائه یک صفحه زمان تلف کند ، که باعث ایجاد تجربه بد کاربر می شود. کندترین زمان بارگذاری حتی می تواند بر روی رتبه بندی جستجوی شما تأثیر بگذارد و در نتیجه بازدید کمتری به سایت شما واردشود.

با استفاده از Google Pagespeed Insights می توانید ببینید که کد CSS استفاده نشده بر روی وب سایت شما تأثیر می گذارد . این به شما بخشی با عنوان Remove unused CSS را نشان می دهد که دارای جزئیات مربوط به پرونده های CSS بر زمان بارگیری شما است.

مشکل کد CSS استفاده نشده در Google Pagespeed Insights

چرا CSS استفاده نشده در وردپرس اضافه می شود؟

CSS برای استایل ظاهر وب سایت وردپرس شما استفاده می شود . قالب وردپرس شما شامل CSS است که بیشتر آن در یک فایل single.css گنجانده شده است.

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

سپس ، فونت های وب ، فونت های آیکن و سایر عناصر خود را دارید که باید فایل های CSS خود را نیز اضافه کنند.

معمولاً این پرونده ها بسیار کم و سریع بارگیری می شوند. با این حال ، اگر سایت وردپرس شما دارای تعداد زیادی از آنها باشد ، اثرات می توانند اضافه شده و تأثیر قابل توجهی در سرعت سایت شما داشته باشند.

چگونه CSS استفاده نشده را در وردپرس حذف کنیم؟

چند روش مختلف وجود دارد که می توانید CSS استفاده نشده را در وب سایت وردپرس خود کاهش دهید.

با این وجود حذف کامل CSS استفاده نشده در وردپرس کار کاملاً دشواری است.با این اوصاف ، ما دو روش برای حذف CSS استفاده نشده به شما نشان خواهیم داد و شما می توانید روشی را که برای شما مناسب است انتخاب کنید.

روش 1. با استفاده از WP Rocket CSS استفاده نشده را در وردپرس حذف کنید

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

ابتدا باید افزونه WP Rocket را نصب و فعال کنید. 

پس از فعال سازی ، باید از صفحه تنظیمات»WP Rocket» بازدید کرده و به تب «File Optimization» بروید.

بهینه سازی فایل در WP Rocket

در مرحله بعدی ، باید به بخش فایل های CSS بروید. از اینجا ، باید کادر کنار گزینه "Optimize CSS delivery" را علامت بزنید.

تحویل CSS را در WP Rocket بهینه کنید

این گزینه یک فایل CSS تولید می کند که فقط حاوی کد CSS مورد نیاز برای نمایش قسمت قابل مشاهده وب سایت شما است. ابتدا آن پرونده را بارگیری می کند ، صفحه را برای بازدیدکنندگان شما نمایش می دهد و سپس سایر پرونده های CSS را با استفاده از فناوری بنام تأخیر بارگیری، بارگیری می کند.

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

پس از فعال کردن گزینه "Optimize CSS delivery" ، روی دکمه ذخیره تغییرات کلیک کنید و منتظر بمانید تا WP Rocket پرونده CSS لازم را برای همه پست ها و صفحات شما ایجاد کند. همچنین به طور خودکار کش وب سایت شما را پاک می کند .

پس از پایان کار ، می توانید با استفاده از Google Pagespeed Insights دوباره عملکرد وب سایت خود را آزمایش کنید.

ترفندهای اضافی تحویل فایل برای افزایش عملکرد

WP Rocket همچنین به شما امکان می دهد رشته های پرس و جو را از پرونده های ثابت حذف کنید ، فایل های Google Fonts را با هم ترکیب کنید و HTML را کوچک کنید. همه این تنظیمات پیشرفت های کوچکی در سرعت کلی شما ایجاد می کند که به تجربه بارگیری سریعتر بازدیدکنندگان شما می افزاید.

بهینه سازی فایل اصلی

همچنین گزینه هایی را برای کوچک کردن و ترکیب فایل های CSS مشاهده خواهید کرد. این گزینه ها باعث کاهش درخواست های HTTP و افزایش سرعت اضافی می شود.

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

پرونده های CSS را کم و ترکیب کنید

علاوه بر این ، می توانید همان بهینه سازی را برای پرونده های JavaScript در وب سایت خود اعمال کنید. می توانید آنها را کوچک کرده و ترکیب کنید تا به عنوان یک فایل واحد عمل کنند و بارگیری پرونده های JavaScript را برای بهبود عملکرد به تعویق بیندازید.

تحویل جاوا اسکریپت را بهینه کنید

روش 2. با استفاده از Asset CleanUp CSS استفاده نشده را در وردپرس حذف کنید

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

با این حال ، کمی پیچیده است و شما باید عملکرد و شکل ظاهری وب سایت خود را کاملاً آزمایش کنید تا مطمئن شوید که چیزی خراب نشده است.

ابتدا باید افزونه Asset Cleanup را نصب و فعال کنید. 

پس از فعال سازی ، باید به صفحه تنظیمات Asset CleanUp »بروید و به تب Test Test بروید. از اینجا ، باید گزینه "Enable Test Mode" را روشن کنید.

گزینه حالت آزمون را فعال کنید

این به شما امکان می دهد تنظیمات مختلف را امتحان کنید و بدون تأثیرگذاری بر بازدیدکنندگان وب سایت ، آنها را به عنوان مدیر آزمایش کنید.

پس از آن ، باید به صفحه Asset CleanUp »CSS / JS Manager مراجعه کنید. از اینجا می توانید پرونده های ناخواسته CSS و JavaScript را در یک صفحه به صفحه بارگیری کنید.

مدیر CSS / JS

ابتدا صفحه اصلی شما را واکشی می کند و تمام فایل های CSS و JavaScript بارگذاری شده در آن صفحه را به شما نشان می دهد.

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

در حال بارگیری پرونده ها

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

در صفحه ویرایش پست ، کادر Asset CleanUp را درست در زیر ویرایشگر پست مشاهده خواهید کرد.

پاکسازی دارایی در داخل ویرایشگر پست

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

پرونده ها را برای یک صفحه خاص بارگیری کنید

مهم: فراموش نکنید که پس از حذف CSS یا JavaScript بدون استفاده ، وب سایت خود را آزمایش کنید تا مطمئن شوید همه چیز خوب کار می کند.

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

فراموش نکنید که برای ذخیره تغییرات خود ، روی دکمه Update All Settings کلیک کنید.

اکنون می توانید وب سایت خود را با استفاده از Google Pagespeed Insights آزمایش کنید تا تغییر در اطلاعیه CSS استفاده نشده را مشاهده کنید.

CSS در وردپرس کاهش می یابد

امیدواریم این مقاله به شما کمک کند یاد بگیرید چگونه CSS بدون استفاده را در وردپرس به راحتی حذف کنید. 

ارسال پرسش و دیدگاه

0دیدگاه
آموزش php طراحی فروشگاه اینترنتی کانال تلگرامی ما تا 50% تخفیف دریافت کنید
مطالبی که شاید خوشتان بیاد