Вы хотите изменить цвет фона редактора блоков WordPress для администраторов?
Иногда при работе над пользовательским клиентским проектом вам может понадобиться изменить цвет фона редактора Gutenberg в WordPress, чтобы он соответствовал цветам их бренда.
В этой статье мы покажем вам, как легко настроить цвет фона редактора блоков WordPress для административной области.
Примечание: В этом руководстве рассматривается изменение цвета редактора в панели администратора WordPress. Если вы хотите изменить цвет фона в интерфейсе WordPress, ознакомьтесь с нашим руководством о том, как изменить цвет фона в WordPress.
Зачем менять цвет фона редактора блоков в WordPress?
Вы можете захотеть изменить цвет фона редактора блоков WordPress по ряду причин.
Например, большинство современных тем WordPress используют тот же цвет фона для редактора блоков, что и живой веб-сайт, включая Astra, OceanWP, GeneratePress и другие.
Однако, если ваша тема WordPress не использует те же цвета, то внешний вид вашего поста в редакторе будет сильно отличаться от того, что ваши пользователи увидят на живом веб-сайте.
Другой причиной изменения цвета фона могут быть личные предпочтения.
Например, по умолчанию редактор блоков использует простой белый фон. Некоторым пользователям может показаться немного напряженным смотреть на белый экран в течение долгих часов. Напряжение глаз может быть реальной проблемой для многих людей, а белый фон по умолчанию не удобен для глаз.
При этом давайте посмотрим, как вы можете легко изменить цвет фона редактора WordPress.
Как изменить цвет фона редактора WordPress
Вы можете легко изменить цвет фона редактора WordPress, добавив собственный код в файл functions.php вашей темы.
Однако имейте в виду, что даже самая маленькая ошибка в коде может сломать ваш сайт и сделать его недоступным. Именно поэтому мы рекомендуем использовать WPкод плагин. Это лучший плагин для фрагментов кода WordPress на рынке и самый простой и безопасный способ добавить собственный код на ваш сайт WordPress.
Во-первых, вам необходимо установить и активировать бесплатный плагин WPCode. Дополнительные инструкции см. в нашем пошаговом руководстве по установке плагина WordPress.
После активации вам необходимо посетить Фрагменты кода » + Добавить фрагменты страница из боковой панели администратора.
Отсюда вам нужно нажать кнопку «Использовать фрагмент» под опцией «Добавить свой собственный код (новый фрагмент)».
Вы перейдете на страницу «Создать пользовательский фрагмент», где вы можете начать с ввода имени своего фрагмента кода. Это только для вас и может быть чем угодно, что поможет вам идентифицировать код.
Затем вам нужно выбрать «Фрагмент PHP» в качестве «Типа кода» в раскрывающемся меню справа.
После этого вам нужно скопировать и вставить следующий код в поле «Предварительный просмотр кода».
add_action( 'admin_footer', function() {
?>
<style>
.editor-styles-wrapper {
background-color: #bee0ec;
}
</style>
<?php
});
Затем вам нужно найти следующий код в только что вставленном фрагменте PHP.
background-color: #bee0ec;
Затем вы должны добавить шестнадцатеричный код предпочитаемого цвета рядом с параметром цвета фона. Если вы не хотите использовать шестнадцатеричный код, вы можете вместо этого использовать некоторые базовые названия цветов, такие как «белый» или «синий».
После этого вам нужно прокрутить вниз до раздела «Вставка» и выбрать опцию «Автоматическая вставка».
Затем вам нужно выбрать «Расположение» фрагмента кода как «Только для администратора» в раскрывающемся меню.
После этого вам нужно вернуться к началу страницы и переключить переключатель «Неактивный» на «Активен».
Наконец, не забудьте нажать кнопку «Сохранить фрагмент», чтобы сохранить изменения.
Теперь зайдите в редактор блоков с боковой панели администратора.
Вот так выглядел редактор блоков на нашем сайте после добавления фрагмента кода CSS.
Мы надеемся, что эта статья помогла вам узнать, как легко изменить цвет фона редактора WordPress. Вы также можете ознакомиться с нашим исчерпывающим руководством по 85+ ярлыкам WordPress, экономящим время, или взглянуть на наш лучший выбор лучших плагинов для создания страниц WordPress.
Если вам понравилась эта статья, то, пожалуйста, подпишитесь на нашу YouTube канал для видеоуроков WordPress. Вы также можете найти нас на Твиттер и Фейсбук.
