Индивидуальный дизайн на Progressive CMS: как устроена тема

Progressive CMS позволяет создавать тему под визуальную идею проекта. Шаблоны, компоненты, цвета и шрифты определяются командой, а материалы остаются в CMS.

Этот сайт использует тёплую редакционную композицию. Другой проект на той же системе может выглядеть совершенно иначе: архитектурно, минималистично, ярко или экспериментально.

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

Ниже — настоящий заголовок из содержимого статьи. Измените кегль и акцент: тот же текст меняет масштаб и настроение. На узком экране композиция перестраивается и сохраняет переносы. Эта проба работает только внутри образца, не меняя настройки сайта.

Фотография участвует в рассказе: показывает людей, материал, свет и среду. Поэтому для крупных иллюстраций тема использует вариант медиа, сохраняющий пропорции. Читатель видит изображение целиком, а подпись объясняет его роль.

Иллюстрации продолжают идею сайта. Можно использовать собственную съёмку, подобрать стоки или попросить агента создать изображения. Вы выбираете настроение и принимаете результат — от первого впечатления до каждой страницы.

Тема определяет, как один набор данных превращается в страницу. Крупный первый экран, редакционные главы, галерея, афиша или спокойный каталог требуют разных правил. Компоненты помогают повторять нужный приём, а отдельные шаблоны — сохранять различия между типами страниц.

На странице разработки можно переключить три композиции одной галереи. На главной каждый концепт имеет собственные разделы, фотографии и ритм. Данные остаются содержимым CMS, а сетка и поведение — частью темы. Так визуальная работа остаётся управляемой при росте сайта.

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

Здесь движение скромнее: индикатор показывает продвижение по материалу, а оглавление отмечает главу в области чтения. CSS scroll timelines работают там, где их поддерживает браузер. При предпочтении reduced motion декоративные переходы отключаются. Содержание и управление остаются доступными.

Тема и содержание имеют отдельные жизненные циклы. Студия или AI-агент может развивать шаблоны и компоненты, пока редакция обновляет материалы. Новое оформление проверяется в предпросмотре на реальных данных.

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