Одной из частых проблем при использовании множества плагинов в WordPress является избыточная загрузка CSS файлов, которые не всегда нужны на всех страницах сайта. Это увеличивает время загрузки и ухудшает производительность. В этой статье мы подробно рассмотрим, как эффективно удалить или отключить ненужные стили плагинов, сохранив при этом корректную работу сайта.
Почему важно удалять CSS стили плагинов
Многие плагины подключают свои CSS файлы глобально, даже если их функционал используется только на отдельных страницах. Это приводит к нескольким проблемам:
- Увеличение общего объема загружаемых ресурсов;
- Замедление загрузки страниц;
- Возможные конфликты стилей между плагинами и темой;
- Сложность поддержки и отладки.
Для решения этих проблем нужно научиться selectively отключать CSS стили там, где они не нужны.
Как определить, какие стили плагинов грузятся на странице
Первым шагом станет определение, какие CSS файлы подгружаются на страницах сайта. Для этого можно использовать инструменты разработчика в браузере (Chrome DevTools, Firefox Developer Tools):
- Откройте любую страницу сайта и вызовите инструменты разработчика (F12).
- Перейдите на вкладку Network и отфильтруйте по типу CSS.
- Посмотрите список загруженных стилей и определите, какие из них принадлежат плагинам.
Также можно проверить в коде темы или плагина, как именно подключается стиль — через wp_enqueue_style с каким handle.
Способы удаления CSS стилей плагинов в WordPress
Самый распространённый и надёжный способ — отписаться от стилей, используя wp_dequeue_style и wp_deregister_style. Сделать это можно в файле functions.php вашей темы или в отдельном плагине.
Удаление глобально загружаемых стилей
Чтобы удалить стиль плагина по его handle, добавьте следующий код:
function wpskins_dequeue_plugin_styles() {
wp_dequeue_style('plugin-style-handle');
wp_deregister_style('plugin-style-handle');
}
add_action('wp_enqueue_scripts', 'wpskins_dequeue_plugin_styles', 20);
Вместо plugin-style-handle укажите реальный идентификатор стиля. Узнать его можно в коде плагина или через инспектор кода.
Удаление стилей на конкретных страницах
Если стиль нужен только на определённых страницах, его можно отключить везде, кроме нужных. Например, отключим стиль плагина на всех страницах, кроме страницы с ID 42:
function wpskins_conditional_dequeue_styles() {
if (!is_page(42)) {
wp_dequeue_style('plugin-style-handle');
wp_deregister_style('plugin-style-handle');
}
}
add_action('wp_enqueue_scripts', 'wpskins_conditional_dequeue_styles', 20);
Это помогает уменьшить нагрузку на остальные страницы.
Удаление стилей плагинов, которые подключают стили через inline CSS
Если плагин добавляет стили через wp_add_inline_style или напрямую в <head>, нужно искать другой способ, например, фильтры плагина или переопределение стилей в теме.
Пример: удаление стилей плагина Contact Form 7 на всех страницах, кроме контактной
Contact Form 7 подключает свои стили на всех страницах по умолчанию. Чтобы отключить их, кроме страницы с формой, используем:
function wpskins_cf7_dequeue_styles() {
if (!is_page('contact')) {
wp_dequeue_style('contact-form-7');
wp_deregister_style('contact-form-7');
}
}
add_action('wp_enqueue_scripts', 'wpskins_cf7_dequeue_styles', 20);
Где 'contact' — slug страницы с формой. Это уменьшит нагрузку на остальные страницы.
Рекомендации по оптимизации загрузки стилей плагинов
Кроме удаления стилей, можно:
- Использовать плагины оптимизации, например, Clearfy Pro, который умеет отключать ненужные стили и скрипты;
- Собрать CSS в один файл и минимизировать его — это уменьшит количество запросов;
- Использовать отложенную загрузку стилей (critical CSS и lazy loading);
- Анализировать работу плагинов и отключать ненужные.
Автоматизация удаления CSS стилей с помощью WP Rocket и Clearfy Pro
Если вы используете WP Rocket, то в ней есть опция «Удаление неиспользуемого CSS», которая поможет оптимизировать загрузку. Однако она не всегда корректно работает с динамическими стилями плагинов.
Плагин Clearfy Pro предоставляет удобный интерфейс для отключения CSS и JS плагинов на выбранных страницах без кодирования. Это особенно полезно, если вы не хотите писать код вручную.
Советы по отладке и тестированию после удаления стилей
После удаления стилей внимательно проверьте работу сайта:
- Проверьте отображение страниц, где отключали стили;
- Убедитесь, что функционал плагина работает корректно;
- Используйте инструменты производительности (Google PageSpeed Insights, GTmetrix) для оценки пользы;
- Тестируйте на разных устройствах и браузерах.
Если что-то сломалось, попробуйте отключать стили выборочно или только на отдельных страницах.
Заключение
Удаление ненужных CSS стилей плагинов — простой и эффективный способ ускорить загрузку сайта на WordPress и улучшить пользовательский опыт. Используйте функции wp_dequeue_style и wp_deregister_style для управления подключением стилей, комбинируйте это с плагинами оптимизации, такими как Clearfy Pro, и всегда проводите тщательное тестирование после изменений.