Этот раздел кастомайзера отвечает за внешний вид сайта, отдельных его элементов.
Здесь настраиваются цвета, типографика, кнопки, меню, карточки записей, формы и другие элементы интерфейса.
Настройки из этого раздела применяются ко всему сайту и помогают создать единый стиль оформления без редактирования кода.
Внешний вид шапки и подвала настраивается в разделе Структура.
Палитра сайта
В этом разделе настраивается основная цветовая схема сайта. Выбранные цвета автоматически применяются ко всем элементам интерфейса, помогая создать единый стиль оформления.
Основной цвет — используется для акцентных элементов сайта: кнопок, активных состояний, ссылок и других компонентов, где требуется выделение.
Цвет ссылок — определяет цвет ссылок во всем контенте сайта.
Фон сайта — задает основной фон сайта.
Фон Body — позволяет изменить фон области за пределами основного контейнера сайта. Настройка заметна при использовании фиксированной ширины макета.
Цвет текста — определяет основной цвет текста на сайте.
Цвет заголовков — используется для заголовков всех уровней.
Приглушенный цвет текста — применяется к второстепенному тексту, например описаниям, метаданным, подписям и другим менее важным элементам.
Цвет границ — используется для границ блоков, полей форм и других элементов интерфейса.
Цвет активной границы — определяет цвет границы элементов в активном состоянии, например при получении фокуса полем ввода.
Типографика
В этом разделе настраиваются шрифты и параметры отображения текста на сайте. Здесь можно задать общий стиль текста, а также отдельно настроить оформление заголовков всех уровней.
Для лучшей производительности сайта рекомендуется использовать не более двух семейств шрифтов.
Базовый шрифт
Настройка отвечает за основной текст сайта: содержимое записей, страниц и другие текстовые элементы.
Можно выбрать:
- семейство шрифта;
- размер шрифта для компьютеров, планшетов и мобильных устройств;
- высоту строки;
- насыщенность шрифта.
Также доступны дополнительные параметры оформления текста:
- курсив;
- заглавные первые буквы;
- все буквы заглавные;
- подчеркивание.
Заголовки H1–H6
Для каждого уровня заголовков H1–H6 можно отдельно настроить типографику.
По умолчанию в теме используется готовая иерархия заголовков с оптимальными настройками размеров и отображения. При необходимости каждый уровень можно изменить вручную.
Для каждого заголовка доступны те же параметры, что и для базового шрифта: выбор семейства шрифта, размер для разных устройств, высота строки, насыщенность и дополнительные стили оформления.
Кнопки
В этом разделе настраивается общий стиль кнопок на сайте: основных, контурных и кнопок Gutenberg.
По умолчанию цвет фона кнопок использует основной цвет из раздела Палитра сайта. При необходимости цвета можно изменить отдельно для кнопок.
Доступны следующие настройки:
Высота кнопки — определяет общую высоту кнопок.
Размер шрифта — настраивает размер текста внутри кнопок.
Горизонтальный внутренний отступ — позволяет изменить расстояние между текстом кнопки и её краями по горизонтали.
Толщина границы — настраивает толщину контура для кнопок с границами.
Скругление углов — позволяет задать радиус скругления углов кнопок.
Цвет кнопки — определяет цвет фона кнопки.
Цвет текста кнопки — настраивает цвет текста внутри кнопки.
Формы
В этом разделе настраивается внешний вид полей форм на всем сайте: полей ввода (input), выпадающих списков (select) и текстовых областей (textarea).
Доступны следующие настройки:
Высота поля — определяет общую высоту полей формы.
Размер шрифта — настраивает размер текста внутри полей.
Толщина границы — позволяет изменить толщину границы полей.
Скругление углов — настраивает радиус скругления углов полей.
Цвет границы — определяет основной цвет границ полей формы.
Цвет активной границы — используется для выделения поля в активном состоянии, например при установке курсора или заполнении формы.
Фон поля — настраивает цвет фона полей формы.
Цвет текста — определяет цвет текста внутри полей.