Как настроить стили сайта через Design

Панель Design позволяет изменить внешний вид сайта без правки кода: цвет фона, основные цвета, шрифты и параметры текста для заголовков и абзацев. Настройки применяются ко всему сайту.

Раздел Typography (типографика)

Здесь настраиваются стили текста. Доступны восемь типов:

Выбор элемента для редактирования

Есть два способа:

1. В панели — нажмите нужный тип в списке (например, Heading 1 или Paragraph).
2. На странице — пока панель открыта, наведите курсор на заголовок или абзац и кликните по нему. Элемент подсветится, и в панели откроются его настройки.

Параметры текста

После выбора типа текста можно изменить:

• Шрифт — из списка доступных (Inter, Roboto, Lato, Noto Sans, Noto Serif и другие).
• Начертание — Regular, Medium, Semibold, Bold и т.д. (набор зависит от выбранного шрифта).
• Размер — размер шрифта в пикселях.
• Line height — межстрочный интервал (чем больше число, тем выше строки).
• Letter spacing — расстояние между буквами.
• Color — цвет текста. Можно выбрать в палитре или ввести код цвета (например, #000000).

Изменения видны на странице сразу, но сохраняются только после нажатия Save (см. ниже).

Чтобы вернуть типографику к исходным значениям, нажмите Reset typography to default внизу раздела Typography.

Раздел Design (оформление)

Здесь задаются общие цвета и тема сайта.

Theme (тема)

• Lined — тема с линиями и разделителями.
• Pure — минималистичная тема без лишних линий.

На некоторых шаблонах страниц (Docs, Centered, Notes) доступна только тема Pure — переключатель будет заблокирован.

Background (фон)

Цвет фона всего сайта. Выберите оттенок в палитре или введите hex-код (например, #ffffff для белого).

Primary и Secondary (основной и дополнительный цвет)

• Primary — главный акцентный цвет (кнопки, ссылки, выделения).
• Secondary — второй акцентный цвет для дополнительных элементов.

Оба поля работают так же: палитра или текстовый код цвета.

Сохранение изменений

1. Настройте типографику и/или цвета в разделах Typography и Design.
2. Прокрутите панель вниз и нажмите Save.
3. Кнопка на время покажет Saving… — дождитесь окончания.
4. Обновите страницу или откройте другую — настройки должны сохраниться для всего сайта.

Что вы должны увидеть

• После Save — те же шрифты и цвета на всех страницах сайта (для всех посетителей).
• На мобильных устройствах заголовки автоматически немного уменьшаются для удобного чтения.
• Шрифт абзаца (Paragraph) задаёт основной шрифт для текста на сайте.

Частые вопросы