Как пользоваться книгой стилей при редактировании сайта

В этом руководстве показано, как использовать книгу стилей для просмотра влияния изменения стилей на отображение любого блока, не вставляя его на сайт.

Эта функция доступна на сайтах с тарифными планами WordPress.com Premium, Business и Commerce, а также с устаревшим тарифным планом Pro. Для бесплатных сайтов или сайтов с тарифным планом Personal необходимо приобрести платный тарифный план более высокого уровня, чтобы получить доступ к этой функции.

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

1. Откройте консоль вашего сайта.
2. Перейдите в раздел Внешний вид → Редактор.
3. Выберите «Стили» в меню слева.
4. Щёлкните по значку в виде глаза справа от надписи «Стили». (Чтобы вернуться в редактор, нажмите значок ещё раз.)

Открыть книгу стилей можно также в процессе редактирования любой страницы, шаблона или части шаблона. Перечислим этапы, изложенные в видеообзоре ранее. Выполните следующие действия.

1. Откройте консоль вашего сайта.
2. Перейдите в раздел Внешний вид → Редактор.
3. Начните редактировать страницу, шаблон или часть шаблона.
4. Нажмите значок «Стили» (чёрно-белый кружок) на верхней панели инструментов редактора.
5. Нажмите значок «Книга стилей» (в виде глаза), чтобы открыть книгу стилей. (Чтобы вернуться в редактор, нажмите значок ещё раз.)

Открыв книгу стилей, вы можете просмотреть и отредактировать цветовую схему и типографику, наблюдая, как каждое вносимое изменение повлияет на определённый текст, блоки, медиафайлы и др.

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

1. Щёлкните по элементу («Цвета», «Типографика» и т. д.) в области предварительного просмотра справа от экрана.
2. Редактируйте стили элемента на панели «Стили» слева.
3. Нажмите стрелку назад рядом с названием элемента, чтобы вернуться к полному списку элементов и выбрать другой элемент для стилизации.

4. Когда закончите, нажмите кнопку «Просмотреть изменения…» в нижней части панели «Дизайн», чтобы просмотреть и сохранить изменения.

Чтобы выйти без сохранения изменений, щёлкните по значку в левом верхнем углу панели «Дизайн» и выберите вариант «Выйти без сохранения изменений».