Тильда · Вайб-блоки

Памятка заливщика

Расширение не рисует дизайн. Дизайн делает ваш ИИ-агент у вас на компьютере — в папке с проектом. Расширение забирает готовые секции из этой папки и раскладывает их по Вайб-блокам страницы Тильды. Ниже весь путь: от установки до залитой страницы.

«Тильда: заливка Вайб-блоков», версия 1.43.0

Что понадобится

1Chromeрасширение ставится только в него и в браузеры на его основе.
2Тильдапроект, где доступен Вайб-блок, и права на редактирование страниц.
3ИИ-агент, работающий с папкамиClaude Code, Codex, Gemini CLI или Cursor. Любой один.
4Парольвыдаём мы. Один пароль помнит три машины: ноутбук, домашний компьютер, переустановку.

Порядок работы

Поставить расширение и войти

Ставится из магазина Chrome по прямой ссылке — в поиске магазина его нет. После установки нажмите значок расширения, введите пароль, Войти. Браузер запомнит вход сам, каждый раз вводить не нужно.

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

Завести папку проекта

Создайте на компьютере пустую папку под лендинг — например my-landing. В панели расширения нажмите Подготовить… и укажите её. Расширение положит туда правила для агента:

my-landing/ .claude/skills/vibe-first/ правила для Claude Code AGENTS.md для Codex CLAUDE.md GEMINI.md указатели .cursor/rules/vibe-first.mdc для Cursor sections/README.txt порядок блоков на страницах

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

Попросить агента сделать секции

Откройте эту папку своим агентом и опишите словами, что за сайт. Правила он найдёт сам — вставлять их в переписку не нужно.

  • Агент спросит про вид проекта: есть ли референс — скриншот, ссылка, макет, фирменные цвета — и в каком направлении делать. Ответьте до того, как он начнёт: референс, показанный на пятой секции, означает переделку первых четырёх.
  • Каждый раздел он сохранит отдельным файлом в sections/: 00-header.html, 01-hero.html и так далее.
  • Порядок блоков он пропишет в sections/README.txt. Загляните туда глазами: имя в списке = имя файла без .html, символ в символ.

Открыть страницу в редакторе Тильды

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

Залить

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

Рядом ещё три кнопки, по необходимости: Залить картинки — загрузит картинки в файлы Тильды и подменит ссылки; Залить в HEAD — служебный код страницы; Собрать .tildastyles — файл стилей проекта, он импортируется в «Шрифты и цвета» настроек сайта.

Править — и заливать снова

Что-то не нравится — говорите об этом агенту, он правит файл в папке. Дальше снова Залить. Галочка Следить за папкой делает это сама: изменили файл — блок обновился.

Правила, которые экономят время

Правим файлы в папке, а не в панели СТИЛЬ Правки, сделанные в панели Тильды, живут в коде блока. Следующая заливка положит туда файл из папки — и правки исчезнут. Панель хороша, чтобы посмотреть и показать; менять текст и цвета надёжнее через агента.
Файл .tilda-map.json не трогаем Он появляется в sections/ после первой заливки, и по нему расширение помнит, какая секция каким блоком легла. Удалите — следующая заливка создаст все блоки заново, поверх старых.
Картинки — ссылками, не внутри кода У блока Тильды есть потолок на размер кода, около 120 000 знаков, и переполняют его почти всегда картинки, зашитые в код. Пусть агент ставит <img src="https://…">, а картинки загрузит кнопка Залить картинки.
Одна секция — один файл — один блок Не просите «весь лендинг одним файлом»: страницу потом нельзя будет пересобрать блоками, а Тильда такой объём может и не принять.

Если что-то пошло не так

«Это расширение сюда не пускают»

Так отвечает сервер расширению, которого нет в его списке. Обычно это копия, поставленная не из магазина, или очень старая версия.

Откройте chrome://extensions, проверьте, что стоит «Тильда: заливка Вайб-блоков» версии 1.43.0 и что она из магазина. Если версия старше — включите обновление или переставьте по ссылке из шага 1.

Пароль не принимается

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

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

В списке нет нужной страницы

Расширение читает ту вкладку Тильды, что открыта. Откройте страницу на редактирование и нажмите Обновить.

Секция есть в папке, но её нет в списке

Значит, её не упомянули в sections/README.txt — или упомянули с опечаткой. Имя блока в списке = имя файла без .html, символ в символ, только строчные латинские буквы, цифры и дефис.

Блок не сохранился

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