Сайт и блог студии собирались не одним рывком, а шаг за шагом: шаблон, рубрики, макеты, баннеры, выкладка. Ниже — путь в том порядке, как он записан в рабочих карточках.
С главной блога
Первым стал шаблон главной блога: общие шапка и подвал, статический CSS без внешних подключений, лента записей WordPress, мобильная версия и локальный предпросмотр. На сайте это страница «Журнал»: верхний блок с поиском, плитки рубрик, сетка «Новые публикации» три на три с пагинацией. Тогда в блоге было 10 статей. Критерием приёмки шаблона были предпросмотр на 1440 и 390 пикселей без ошибок консоли и горизонтального скролла и отсутствие внешних ссылок: никаких CDN и чужих шрифтов.
Рубрик согласовали семь, коротких: «Сайты», «Магазины», «Запись и поддержка», «Приложения», «Редизайн», «Лендинги», «Заказчику». От макета отличался акцент: на сайте он лавандовый, а не мятный. Часть секций из макета на первом шаге вырезали и оставили на следующие задачи.
Тема Greenlight
Когда сайт переводили на основу Greenlight, переносить оказалось почти нечего: тема уже была дочерней, с шаблонами блога, записи, архива, поиска и страницы 404. Коммит перехода так и назван: токены, зачистка старой темы, снимок сайта.
Макеты шестой версии
Новую структуру блога сначала собрали локально, в папке макетов, не трогая ни тему, ни сайт. На главной блога — первые восемь публикаций с кнопкой «Показать ещё», шесть последних, заметный поиск в верхнем блоке и переключатель «Карточки / Списком». У рубрики «Сайты» свои секции: «Начните отсюда», «Путь заказчика» из пяти шагов, вопросы и ответы. Отдельно сделали страницу тега, каталог из 29 тем и страницу автора с баннером-портретом. Скрипты сборки этих страниц перенесли в проект с относительными путями и проверили пересборку.
Заглушки в макетах названы заглушками: адрес почты в приглашении предложить тему был временным, а данные и фото автора — вымышленными.
Теги и автор
Описания 29 тегов жили в отдельном JSON-файле, а на сайте поле описания было пустым у всех тегов. Потом описания записали в WordPress: 29 из 29, каждое перечитано и сверено по контрольной сумме. Профиль автора записали по решению человека: макет остаётся как есть, портрет остаётся.
Баннеры рубрик
Каждая из семи рубрик получила свой баннер 21:9, размером 3024 на 1296, без текста: природа плюс предмет на тёмном фоне. Все изображения студии генерируются и хранятся в одном сервисе, основная модель по умолчанию — seedream-5-flash, а формат 21:9 отведён баннерам героев и широким секциям. Семь кадров обошлись в 245 кредитов, по 35 за кадр. В теме баннер выбирает шорткод по слагу рубрики, а для остальных страниц остаётся прежняя картинка героя. На 1440 пикселях горизонтального скролла нет.
Позже героя рубрики переделали в единый баннер, как на главной блога: картинка справа примерно на 78 процентов ширины, текст слева, левый край плавно уходит в фон. На живой сайт этот блок CSS выкладывали с бэкапом файла: девять строк на сервере заменили тринадцатью локальными, остальной файл не менялся.
Были и незакрытые места. Локальный предпросмотр не отображал шаблон рубрики, поэтому вид снимали со вспомогательной страницы, а проверку синтаксиса PHP оставили на сайт.
Рубрика «Кейсы»
Следующий шаг — переименование «Лендингов» в «Кейсы» со слагом kejsy. В задаче записано, что старый адрес рубрики должен отдавать перенаправление на новый, а баннер рубрики переименовывается вместе со слагом. Для главной блога задан блок историй: три свежих записи из этой рубрики, одна большая с цитатой и две малые, а при меньшем числе записей блок не выводится.
Эта статья — одна из трёх таких историй.
Добавить комментарий