По умолчанию редактор блоков Gutenberg загружает свой CSS на фронт-части вашего WordPress сайта. Во многих случаях это нужно, ведь вы используете Gutenberg для написания статей, соответственно, они должны быть корректно стилизированы. Но бывают ситуации, когда вам нужно отключить лишние стили.
Недавно мы уже писали о плагине для WordPress Disable Gutenberg , что позволяет пользователям отключить Gutenberg и активировать классический редактор. В настройках плагина добавлена недавно опция, позволяющая пользователям включить или отключить CSS-стили от Gutenberg при необходимости.
Что если вы не пользуетесь этим плагином – тогда мы покажем, как отключить описанные стили программно (без плагина).
Как сделать?
Вот небольшой фрагмент кода, который можно добавить на свой сайт WordPress, и он магическим способом сделает то, что вам нужно. Вы можете добавить этот код в файл functions.php в вашей теме (не забывайте делать бекап):
// выключаем стили gutenberg на frontend
function wpcoua_disable_gutenberg_styles() {
wp_dequeue_style('wp-block-library');
wp_dequeue_style('wp-block-library-theme');
}
add_filter('wp_enqueue_scripts', 'wpcoua_disable_gutenberg_styles', 100);Code language: PHP (php)Почему это нужно
Одной из причин, почему вы можете захотеть удалить лишние/ненужные CSS-стили – это улучшение «скорости» сайта , измеряемое в частности Google PageSpeed Insights.
Если отключить CSS от Gutenberg (при условии, что он вам не нужен) — при загрузке сайта браузеру потребуется загрузить и обработать на один файл меньше для каждой страницы. Это может иметь большой эффект в некоторых случаях.
Когда стили гутенберг подключены на сайте – это выглядит так в исходном коде страниц:
<link rel='stylesheet' id='wp-block-library-css' href='https://domain.com/wp-includes/css/dist/block-library/style.min.css' type='text/css' media='all' />Code language: HTML, XML (xml)
