Верстак На главную Контакт
Конструктор изнутри · без кода

Редактор, в котором
правки не ломают дизайн

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

0строк кода — меняете текст и фото
0 ₽чтобы начать: собрать и опубликовать
35страниц — каждую правите из панели
Витрина готовых шаблонов конструктора Верстак — выбор ниши и вход в редактор шаблонов
Сердце «Верстака» — готовые нишевые шаблоны. Выбираете нишу, открываете в редакторе и правите под себя: тексты, фото, разделы. Дизайн не ломается.
01
Что видит посетитель
  • Главная. Первый экран во всю высоту, список работ, блок обо мне с честными цифрами, отзывы и форма заявки. Светлая тема по умолчанию, тёмная — по выбору посетителя.
  • Страницы кейсов. Задача, что сделано, стек, результат — по одному шаблону, но собираются из данных, а не лежат отдельными файлами.
  • Страница доработок. Отдельная посадочная под платные модули: CRM, брони, оплаты, интеграции — что можно допилить поверх шаблона.
  • Правовая часть. Оферта, политика обработки данных, согласие, страница о cookie. Формы не отправляются без отметки о согласии, и проверяет это сервер, а не только галочка в вёрстке.
  • Приём заявок. Заявка уходит в панель и приходит уведомлением на телефон. Форма защищена ловушкой для ботов, ограничением частоты и reCAPTCHA v3.
Готовый сайт на шаблоне конструктора Верстак — то, что видит посетительСмотреть шаблоны
02
Ведёте сайт после публикации

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

Редактор главной страницы в панели управления: поля заголовков, подписей и фонового фото
Тексты — полями, а не в коде.Пустое поле возвращает то, что записано в файле: сломать вёрстку правкой нельзя.
Раздел «Кейсы»: список проектов с порядком, кнопками скрытия и удаления
Кейсы — данные, а не файлы.Один источник питает список на главной, хаб и страницу кейса. Новый проект заводится скрытым.
Медиатека: загруженные фото с описаниями alt и списком страниц, где они используются
Фото сами становятся WebP.Описание alt живёт с файлом и подставляется везде. Занятый кадр не даст себя удалить.

И то же самое с телефона — не «мобильная версия для просмотра», а полноценная работа: загрузить фото, ответить на заявку, снять отзыв с публикации.

Панель управления на телефоне в тёмной теме: карточки медиатеки
Тёмная тема.Подписи кнопок сменились иконками, карточки встали в две колонки.
Панель управления на телефоне в светлой теме: медиатека
Светлая тема.Обе темы работают и в панели, не только на сайте.
Выдвижное меню панели на телефоне: разделы и кнопки управления
Меню в выдвижном ящике.Разделы, переключатель темы и выход — под большим пальцем.
  • Заявки. Статусы «новая → в работе → закрыта», заметка для себя, телефон и Telegram ссылками — со смартфона звонок в одно касание.
  • Отзывы. Приходят с сайта на модерацию: сами на страницу не попадают, текст можно поправить перед публикацией.
  • Уведомления. Push на телефон о новой заявке и отзыве — без своего приложения в сторах.
03
Как это устроено
  • Дизайн живёт в файлах, правки — в базе. Панель хранит только изменённые поля и накладывает их при отдаче страницы. Пустая база — сайт выглядит ровно как в исходниках. Это значит, что правка из панели не может «увести» дизайн.
  • Лёгкий код под капотом. Обычный HTML и CSS, без тяжёлых сборщиков и фреймворков. Страница весит килобайты, а не мегабайты, и открывается быстро даже на слабом телефоне — это сразу и SEO, и конверсия.
  • SEO — часть системы, а не «потом». robots и карта сайта генерируются из тех же данных, что и страницы: добавили проект — он сам появился в карте. Пока не задан боевой домен, сайт закрыт от индексации, чтобы в поиск не попал временный адрес.
  • Данные не теряются. Копии контента снимаются при старте и раз в сутки, старые чистятся сами — бэкапы не должны однажды забить диск, я это уже проходил.
  • Запуск. Systemd поднимает сервис и перезапускает при сбое, nginx отдаёт HTTPS, сертификат продлевается сам. Обновление — одна команда, контент при этом не трогается.

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

  • Первый экран на телефоне. Привычная вёрстка «на всю высоту» прячет нижние подписи под панелью браузера. Высота считается по реально видимой области и пересчитывается при повороте — но не дёргается, когда панель прячется при прокрутке.
  • Иконки вместо символов. Стрелки и галочки нарисованы вектором: типографские знаки часть телефонов подменяет цветными эмодзи, и соседние ссылки разъезжаются по высоте.
  • Крупные фоновые слова. Их размер пересчитывается после загрузки шрифта, чтобы длинное слово не вылезало за край экрана.
  • Движение с уважением. Блоки появляются при прокрутке, но если в системе включено «уменьшить движение» — анимации выключаются, а работа остаётся.
  • Две темы целиком. Светлая и тёмная работают и на сайте, и в панели, включая тёмный подвал, на котором кнопка «наверх» иначе сливалась бы с фоном.
04
Что это значит для вас
  • Вы видите товар до покупки. Не «сделаем панель управления», а вот она — со всеми экранами, включая телефон.
  • Правки без разработчика. Поменять текст, заменить фото, добавить проект, снять отзыв с публикации — это работа на минуту, без письма мне и без ожидания.
  • Начинаете бесплатно. Собрать и опубликовать на поддомене — 0 ₽. Свой домен и снятие плашки — от 390 ₽/мес, без скрытых доплат за каждую страницу.
  • Так же устроен и ваш сайт из конструктора. Многое подключается из коробки по тарифу — формы, отзывы, аналитика, приём оплаты. А чего из коробки нет — допилю под вас.
Блочный редактор Верстак — свободная сборка страницы с нуля, для тех, кому мало шаблонаОткрыть витрину
Понравилось, как устроено?
Соберите свой на этом же движке — бесплатно
Собрать бесплатно