0
551
2018-12-21

WordPress CSS - Как отключить любые стили плагинов в function.php

В данном уроке я объясню на примере, как отключить практически любые файлы стилей и для любых плагинов добавив функцию в function.php. Так поговорим о идентификаторах стилей в WordPress
Понравилась страница? Поставь свою оценку!
PLUGIN_STAR_RATINGS.SCORE_TEXTPLUGIN_STAR_RATINGS.VOTES_TEXT

И вот настал тот торжественный момент когда проект грубо говоря полностью готов, всё сделано и последним штрихом осталось произвести ускорение сайта. Это заключительная фаза всех трудов и стараний но иногда случается так что по своей продолжительности данный этап разработки занимает внушительный ресурс времени. Основной причиной трудозатрат являются файлы каскадных стилей CSS, так как веб мастеру необходимо не только произвести работу с оптимизацией CSS файлов, а также настроить очередность вывода каждого файла в зависимости от его важности для отображения того или иного элемента (или элементов) сайта.

Отключение стилей плагинов в function.php

Часто случается Так что необходимо отключить файл CSS одного из определенных плагинов дабы стили плагина не блокировали рендеринг страницы во время загрузки сайта. Код ниже позволит отключить файл стилей практически любого плагина:

// Отключаем любые CSS стили плагинов
function custom_dequeue() {
    wp_dequeue_style('full-screen-search');
    wp_dequeue_style('prettyPhoto');
    wp_deregister_style('full-screen-search');
    wp_deregister_style('prettyPhoto');
}
add_action( 'wp_enqueue_scripts', 'custom_dequeue', 9999 );
add_action( 'wp_head', 'custom_dequeue', 9999 );

Как определить идентификатор подключаемого css файла

Для того чтобы отключить файл стилей определенного плагина, в начале Вам необходимо узнать идентификатор данного файла стилей. В примере выше данный перечень названий является идентификаторами файлов стилей:

full-screen-search
prettyPhoto

Для того чтобы определить какой идентификатор подключенного файла стилей, достаточно заглянуть в код страницы, и если например блок подключения стилей выглядит так:

<link rel='stylesheet' id='elementor-animations-css'  href='/wp-content/plugins/elementor/assets/lib/animations/animations.min.css' type='text/css' media='all' />

Значит идентификатор имеет такое имя:

elementor-animations

То есть окончание в виде:

-css

Откидываем и получаем правильное имя идентификатора.

Правильное подключение отключенных файлов стилей

Здесь важным моментом является тот факт, что мало отключить стили плагина, ведь они могут понадобиться для отображения определенных (а возможно и важных) элементов страницы. По этому после отключения стилей плагинов, настоятельно рекомендую создать отдельный файл стилей в котором будут находиться все отключенные стили. После чего отдельно подключить файл с отключенными стилями например вот так:

function all_dequeue_styles() {
    wp_enqueue_style( 'true_style', get_stylesheet_directory_uri() . '/css/all_dequeue_styles.css' );
}

add_action( 'wp_enqueue_scripts', 'all_dequeue_styles' );