Собираем лендинг за один прогон визарда

Собираем лендинг за один прогон визарда

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

В DynapiCMS для этого есть визард «Лендинг». Отвечаете на короткую анкету — получаете опубликованную страницу на адресе своего проекта: шапка с якорями, цифры, меню, отзывы, вопросы, форма заявок, тёмная тема. Страница остаётся в проекте записями CMS, файлами шаблона и парой сценариев — всё можно править руками, без кода.

Здесь я прогоняю визард от первой кнопки до живого адреса: кофейня «Тёплый пар», чистый демо-проект, скриншот каждого шага. Лендинг займёт корень проекта — warmsteam.dynapi.ru/.

Лендинг после прогона: герой «Тёплый пар» с кнопками «Заказать кофе» и «Смотреть тарифы», в шапке якоря «Почему мы», «Меню», «Вопросы», «Контакты»

Сначала совет: прогоняйте на демо-проекте

Визард создаёт типы контента, файлы и сценарии в том проекте, где его запустили. Первый прогон делайте на отдельном демо-проекте: в чистом проекте вы ничем не рискуете и спокойно смотрите на результат — а повторять идёте туда, где страница нужна по-настоящему.

Шаг 1. Карточка «Лендинг» в галерее

В админке: «Сайт» → вкладка «Сценарии» → кнопка «Создать сценарий». Вместо формы открывается галерея «Что создаём?» — карточки с иконкой и описанием; среди них форма с капчей, уведомление в Telegram, JSON-эндпоинт, страница, приём оплаты через ЮKassa. Выбираем «Лендинг».

Галерея «Что создаём?»: карточки сценариев — «Форма с капчей», «Уведомление в Telegram», «JSON-эндпоинт», «Страница», «Приём оплаты через ЮKassa»; внизу — карточка «Лендинг»

Слаг и адрес на этом шаге не спрашивают: по умолчанию визард поставит страницу на путь /lp, а при коллизии возьмёт следующее свободное имя и ничего не перезапишет. Нам лендинг нужен всем сайтом — путь поменяем в анкете.

Шаг 2. Анкета вместо брифа

Дальше одна анкета на одном экране:

  • «Название продукта» и «Оффер — одна фраза» — встанут в заголовок и подзаголовок героя;
  • «Надпись на кнопке» — вместо безликой «Отправить» будет «Заказать кофе»;
  • «Акцентный цвет» — четыре палитры: индиго, изумруд, графит, янтарь;
  • двенадцать переключателей блоков — от логотипов до формы заявки;
  • «Путь страницы» — по умолчанию /lp; лендингу на весь проект ставим /;
  • «SEO-описание» и «Картинка Open Graph».

Анкета визарда заполнена под кофейню: в кадре переключатели от «О продукте» до «Формы заявки», путь страницы / и SEO-описание про доставку за 30 минут

Заполняю: «Тёплый пар», «Спешелти-кофе и десерты — с доставкой за 30 минут», кнопка «Заказать кофе», палитра — изумруд, все блоки включены, путь /.

Поля «адрес сайта» в анкете нет, потому что адрес визарду не нужен: каноническую ссылку, og:url и микроразметку он строит из хоста запроса — на поддомене они ведут на этот поддомен, на собственном домене — на него. Один и тот же контент работает на любом адресе без перегенерации. Картинка из анкеты становится og:image — ссылка в мессенджере уезжает с обложкой.

Шаг 3. План «Что будет создано»

Перед запуском визард показывает план — список операций, которые сейчас выполнит. Видно ровно то, что появится в проекте.

План «Что будет создано»: строки создания типов контента — «Шапка лендинга», «Пункты меню», «Секции лендинга» — и первые привязки записей к секциям

Двадцать типов контента: «Страница лендинга», «Хиро лендинга», «Мета лендинга», «SEO лендинга», «Шапка лендинга», «Пункты меню», «Форма лендинга», «Секции лендинга», одиннадцать типов наполнения и «Заявки лендинга». За ними привязки: записи тарифов — к секции меню, вопросы — к секции FAQ — каждая секция получает наполнение ссылками, а страница-хаб собирает роли воедино. Замыкают план шаблон landing.liquid, стили, скрипт, сценарий страницы, сценарий приёма заявок и маршрут.

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

Готово — и уже опубликовано

Прогон заканчивается работающим адресом: визард публикует шаблон, статику, сценарии и маршрут сам. Мы просили корень вместо дефолтного /lp — визард перевёз привязку и отчитался тостом «Страница переехала: /lp → /». В списке сценариев — «Лендинг» и «Заявки лендинга», оба со статусом «Опубликован», оба на /.

Список сценариев после прогона: «Заявки лендинга» и «Лендинг», оба опубликованы и привязаны к маршруту /

Страница сразу открывается на публичном домене — отдельного шага «выложи черновик» нет.

Что где лежит после прогона

Всё созданное остаётся обычными объектами платформы: слоган через полгода лежит там же, где и в день прогона, — в записи «Хиро лендинга».

Контент — в CMS. Меню — три записи «Тарифы лендинга»: название, цена и список того, что входит. Вопросы — четыре записи «Вопросы лендинга»; у цифр, отзывов, команды и галереи — свои типы. Каждая секция — запись в «Секциях лендинга», и эта запись держит ссылки на своё наполнение в поле items. Пункты меню — записи в «Пунктах меню»: добавить или убрать ссылку — дело одной записи.

Секция «Меню» на живом лендинге: эспрессо за 150 ₽, капучино за 230 ₽ с плашкой «Популярный» и раф «Тёплый пар» за 280 ₽

Оформление — в файлах. Шаблон landing.liquid, рядом landing.css и landing.js: мобильная вёрстка, светлая и тёмная тема, aria-атрибуты, focus-стили, OG- и Twitter-мета, canonical и JSON-LD — WebSite и FAQPage, если блок вопросов включён.

Логика — в сценариях. Сценарий страницы делает три запроса к контенту и рендерит шаблон; главный приносит запись «Страница лендинга», в которой собран весь сайт. Форма — отдельный сценарий с honeypot-полем против ботов: POST уходит на тот же адрес страницы, заявки падают в тип «Заявки лендинга» и смотрятся в админке как обычные записи.

Двенадцать переключателей

Каждый блок — тумблер в анкете: логотипы, цифры, преимущества, «о продукте», шаги, галерея, тарифы, отзывы, FAQ, команда, призыв, форма. Выключили — секция исчезла целиком. Порядок тумблеров задаёт порядок секций: анкета читается как оглавление.

Форма — самый весомый тумблер: без неё визард не создаёт ни «Формы лендинга», ни «Заявок лендинга», ни сценария приёма.

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

Правки и переезды

После публикации тексты правятся в записях — как любой контент проекта. Повторный прогон на том же проекте существующие записи не трогает. Адрес перестал устраивать — меняете путь в настройках сценария: страница переезжает, старый маршрут подчищается, приходит тост «Страница переехала: A → B».

Тема по умолчанию следует за системной настройкой посетителя, а в шапке есть ручной переключатель — выбор запоминается. Проверяйте страницу в обеих темах.

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

Нужен ли программист?

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

Что появится в проекте после прогона?

До двадцати типов контента с записями под ваш текст (часть зависит от включённых блоков), шаблон со стилями и скриптом, два сценария и маршрут на выбранном пути.

Можно ли сменить адрес после публикации?

Да. Меняете путь в настройках сценария — страница переезжает, старый маршрут подчищается.

Что будет, если прогнать визард второй раз?

Существующие записи он не трогает. Второй прогон нужен для чистого проекта или пересборки привязок; для «обновления» контента он не нужен.


Лендинг — это часто «нужно вчера»: анкета на пять минут, правки в CMS без раундов с вёрсткой. Как устроены сценарии и файлы сайта под капотом — рассказано в документации; визард создаёт ровно те же сущности, поэтому разобрать свою страницу по винтикам можно в любой момент.

Документация: сценарии и файлы сайта.


Все записи