Как да премахнете неизползваните CSS и JS в WordPress (много лесно)

Наличието на много неизползвани CSS и JS във вашия уебсайт може да навреди на времето за зареждане на уебсайта ви. Ако управлявате уебсайта си чрез a инструменти за тестване на скоростта , като Google PageSpeed ​​Insight, може да получите предупреждение да премахнете неизползван CSS.

За щастие, има много лесен начин да направите това. Не е необходимо да имате специални технически познания, за да можете да премахнете неизползваните CSS и JS от вашия WordPress сайт.

Това се дължи на невероятен плъгин, известен като Asset CleanUp: Ускорител на скоростта на страницата. С този плъгин премахването на неизползван CSS е толкова лесно, колкото щракване върху няколко бутона. Като алтернатива, ако нямате нищо против да харчите няколко долара на година, с WP Rocket, има премахнат неизползван CSS бутон, просто го активирайте и плъгинът автоматично ще премахне всички неизползвани CSS.

Поръчка: Топ 7 на управляван Google Cloud WordPress хостинг

Какво е неизползван CSS?

Неизползваният CSS е CSS файл, който присъства в страницата, но най-често не е необходим за зареждането на страницата. Когато посетител отвори уебсайт, браузърът обикновено трябва да изтегли, анализира и обработи всички външни таблици със стилове на посетената страница, преди да може да покаже съдържанието на страницата на посетителя. Ако на такава страница съществува някакъв CSS, който не се използва на страницата, браузърът ще си губи времето с него.

Класически пример за това са повечето използвани плъгини за формуляри за контакт. Тези плъгини, въпреки че се използват най-вече само на страницата Свържете се с нас, зареждат своя CSS в целия уебсайт. Няма значение дали това е началната страница, където не се използва, CSS ще се зареди.

Ако има твърде много CSS, които не са необходими, но се зареждат и забавят времето на браузъра за четене и показване на страница, това може да се превърне в проблем.

Освен плъгини, разработчиците на теми пишат много неща в style.css, които в повечето случаи не са необходими. Но независимо дали са необходими или не, те се зареждат винаги, когато вашият сайт е зареден!

Един неизползван CSS може да не е проблем, но много неизползван CSS може да повлияе на времето за зареждане на вашия уебсайт.

Поръчка: Топ 10 на най-бързите и най-добри WordPress теми 

Как да идентифицирате неизползван CSS

Намирането на неизползвани CSS и JS е много лесно. Има два подхода, които ще препоръчам.

Единият е да анализирате уебсайта си чрез Google PageSpeed ​​Insight. Проверете дали вашият уебсайт има проблем с премахване на неизползван CSS. Кликнете върху него и ще можете да идентифицирате компонента на вашия сайт, отговорен за него.

Можете да видите отгоре, че има записан един случай на неизползван CSS. Мога да видя приставката и местоположението на неизползвания CSS, като погледна това.

Вторият вариант е да получите по-подробен анализ. Можете да постигнете това с помощта на инструменти за разработка на Chrome.

Във вашия браузър chrome отворете инструментите за разработка на Chrome, след което отидете на покритие. След това щракнете върху бутона за презареждане в зоната на покритие. Можете да намерите a изчерпателно ръководство за това как да направите това в инструмента на Google Developers.

Другият вариант е да използвате jitbit за сканиране за неизползвани CSS селектори, Можете също така да използвате PurifyCSS за намиране на неизползван CSS

Как да премахнете неизползван CSS

Следвайте тези стъпки, за да премахнете неизползван CSS от WordPress:

1. Инсталирайте Asset CleanUp

Отидете на плъгина и след това Добавете нов. След това въвеждате „Asset CleanUp“ в полето за търсене на страницата за добавяне на нов плъгин. Инсталирайте и активирайте приставката.

2. Отидете на настройките на плъгина

За достъп до настройките на плъгина, от таблото за управление на WordPress щракнете върху настройки, след което щракнете върху Asset CleanUp.

3. Разтоварете нежеланите CSS и JS

В настройките на приставката може да се наложи да приемете, че знаете как работи приставката под крана за отстраняване на мазнини, преди да започнете.

За да разтоварите CSS и JS, щракнете върху CSS и JSS мениджър. Оттам можете да премахнете всички CSS и JS, които не ви трябват. Можете да го премахнете само за началната страница, за целия сайт или за конкретен URL адрес. Можете също да премахнете за публикации, страници или категории.

Пример е да разтоварите всеки формуляр за контакт от зареждането за целия сайт, с изключение на страницата за връзка с нас

Отделете време и разтоварете всеки CSS и JS, за които знаете, че не са необходими. Уверете се, че сте тествали сайта си, след като сте готови, за да сте сигурни, че всичко е наред.

Премахнете неизползваните CSS WordPress добавки

Ето някои добавки, които можете да използвате, за да премахнете неизползван CSS в WordpPress:

1. Asset CleanUp: Ускорител на скоростта на страницата

Asset CleanUp: Ускорител на скоростта на страницата улеснява премахването на неизползваните CSS и JS в WordPress дори за начинаещи. Всичко, което трябва да направите, е да деактивирате определен CSS, който не е необходим за определена страница.

Можете също да деактивирате само за отделни публикации. С премиум версията можете да деактивирате неизползваните CSS/JS чрез добавки.

Този плъгин е пълен плъгин за производителност с много други опции за ускоряване на WordPress. Премахването на неизползван CSS/JS е само част от него.

В тази публикация използвах този плъгин има ръководство.

2. WP Rocket

WP Rocket е номер едно плъгин за премиум производителност на WordPress. Ако сте нуб, искам да кажа, че ако нямате опит или не се чувствате добре с WordPress, тогава WP Rocket е най-лесният начин да премахнете неизползван CSS за.

Трябва да закупите плъгина, след като го направите, можете да го изтеглите от акаунта си или да проверите имейла си за връзка за изтегляне.

Инсталирайте приставката чрез Табло>Приставки>Добавяне на ново>Качване.

Просто отворете настройките на WP Rocket, след което щракнете върху раздела „Оптимизиране на файлове“. След това превъртете надолу и ще видите „Премахване на неизползван CSS“, поставете отметка в квадратчето, запазете и изчистете кеша.

3. Perfmatters

Perfmatters е премиум плъгин, разработен от Brian Jackson и неговия брат, Brett Jackson. Този плъгин може да помогне за премахването на неизползван CSS много лесно.

Първо, трябва да закупите приставката. След това го инсталирайте. Активирайте лиценза. Когато отидете до настройките, включете диспечера на скриптове.

Просто отидете на която и да е страница или публикация на уебсайта си, ще видите иконата на мениджъра на скриптове в менюто на таблото, щракнете върху нея. Ще можете да премахнете неизползваните CSS и JS от страницата или глобално.

Този плъгин е плъгин за производителност, идва с много други опции за ускоряване на WordPress. Премахването на неизползван CSS/JS е част от него.

4. CSS JS мениджър

CSS JS мениджър може специално да премахне CSS или JS от мобилен или настолен компютър. В зависимост от това какво искате да постигнете.

Този плъгин може също да отложи зареждането на CSS или JS файлове.

Заключение

Ако имате много неизползвани CSS и JS, ще забележите голямо подобрение в резултатите за скорост и производителност.

Може да е невъзможно да премахнете всички неизползвани CSS, но можете да ги сведете до минимум. Използвам Asset CleanUp, за да премахна неизползван CSS за TargetTrend.

Не забравяйте, оптимизирайте, но не бъдете прекалено обсебени от това, освен ако не искате вашият сайт да изглежда така най-бързият уебсайт в света.

Също така прочетете:

Как да премахнете блокиращите изобразяването ресурси в WordPress

Как да направите WordPress много бърз

Как да привлечете трафик към вашия блог