Свои страницы на сайте Tilda: публикуем через Cloudflare Pages

Claude Code собирает вам страницу — калькулятор, прайс, лендинг под акцию — а она появляется на вашем сайте. Без серверов, без Google Cloud и без вёрстки в Zero Block.

Почему нельзя просто попросить Claude опубликовать в Tilda

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

Поэтому схема всегда одна: страница живёт снаружи, а Tilda её показывает. Либо не участвует вообще — это третий вариант, и он самый удобный.

Это бесплатный хостинг для страниц. В отличие от Google Cloud, здесь не нужно заводить проект, разбираться с правами доступа и настраивать кодировку — всё работает из коробки, включая HTTPS.

Самое приятное: делать это руками не придётся. Страницу собирает Claude Code или Codex, они же её и опубликуют — они знают, где лежит папка, и сами выполнят всё, что нужно. От вас — аккаунт и одно подтверждение в браузере.

Опубликуй эту страницу в интернете через Cloudflare Pages.

1. Проверь, установлен ли Node.js. Если нет — поставь и скажи мне, что сделал.

2. Залогинься в Cloudflare через wrangler. Когда откроется браузер,
   скажи мне об этом — я подтвержу доступ сам.

3. Создай проект Cloudflare Pages. Имя предложи сам, покажи мне
   перед созданием.

4. Добавь в мою страницу скрипт, который сообщает свою высоту наружу
   через postMessage с типом page-height — он понадобится, если я буду
   встраивать страницу на свой сайт.

5. Опубликуй папку целиком, вместе с картинками. Пути к картинкам
   в HTML должны быть относительными.

6. Верни мне готовую ссылку и проверь, что она открывается.

7. Запомни, как это делается: дальше я буду просить «обнови страницу»,
   и ты должен будешь повторить публикацию сам, без моих команд.

Командами меня не грузи — просто сделай и скажи результат.

Страница опубликована и доступна по адресу имя.pages.dev. Дальше три варианта, от самого простого к самому удобному.

Вариант А. Вставить код в блок Tilda

Самый прямой путь. В нужном месте страницы добавляете блок T123 «HTML-код» и кладёте в него это, поменяв адрес на свой:

<iframe id="my-page" src="https://ИМЯ.pages.dev/"
        style="width:100%;border:0;display:block;overflow:hidden"
        height="1400" scrolling="no" loading="lazy"></iframe>
<script>
window.addEventListener('message', function (e) {
  if (e.origin !== 'https://ИМЯ.pages.dev') return;
  if (!e.data || e.data.type !== 'page-height') return;
  var f = document.getElementById('my-page');
  if (f) f.style.height = e.data.height + 'px';
});
</script>

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

Без этой пары высота была бы фиксированной, и на телефоне получился бы скролл внутри скролла.

Проверка источника обязательна. Строка с e.origin — не украшение: без неё любой сайт сможет прислать вашей странице сообщение и растянуть блок.

Минус варианта: на каждую новую страницу вы руками создаёте страницу в Tilda, добавляете блок и правите адрес в коде. Две-три страницы — терпимо, тридцать — уже работа.

Вариант Б. Одна страница-контейнер на все случаи

Хитрость, которая убирает ручную работу почти полностью. В Tilda создаётся одна страница, например /guide, а что именно показать — решает адрес: /guide?g=linkedin, /guide?g=crm и так далее. Новые страницы в Tilda больше не создаются никогда.

<div id="page-host"></div>
<script>
(function () {
  var HOST = 'https://ИМЯ.pages.dev';

  // Белый список: ключ из адреса → папка на хостинге.
  // Всё, чего нет в этом списке, не открывается.
  var PAGES = {
    'calc':   'kalkulyator',
    'sale':   'akciya-mart',
    'about':  'o-kompanii'
  };

  var key = new URLSearchParams(location.search).get('g');
  var folder = Object.prototype.hasOwnProperty.call(PAGES, key) ? PAGES[key] : null;
  var host = document.getElementById('page-host');

  if (!folder) {
    host.innerHTML = '<p style="padding:40px 0;text-align:center">Страница не найдена</p>';
    return;
  }

  var f = document.createElement('iframe');
  f.src = HOST + '/' + folder + '/';
  f.setAttribute('style', 'width:100%;border:0;display:block;overflow:hidden');
  f.setAttribute('scrolling', 'no');
  f.height = 1400;
  host.appendChild(f);

  window.addEventListener('message', function (e) {
    if (e.origin !== HOST) return;
    if (!e.data || e.data.type !== 'page-height') return;
    f.style.height = e.data.height + 'px';
  });
})();
</script>

Минусы: адрес получается некрасивый и одинаковый для всех страниц, поисковики такие страницы индексируют плохо. Если хотите, чтобы страницы находились в поиске, — берите третий вариант.

Вариант В. Поддомен — и Tilda больше не нужна

Самый удобный способ, если шапка и меню сайта на странице не обязательны. Заводите поддомен вида pages.вашсайт.ru, он смотрит прямо на Cloudflare Pages. Основной сайт остаётся на Tilda, его это не трогает вообще.

Дальше каждая новая страница появляется там сама, как только Claude её опубликует: pages.вашсайт.ru/калькулятор. Ни блоков, ни iframe, ни подгонки высоты.

Настраивается один раз, порядок важен:

1. Сначала в Cloudflare. Дашборд → Workers & Pages → ваш проект → вкладка Custom domains → Set up a domain. Вводите guides.вашсайт.ru и подтверждаете.
2. Потом в DNS. Там, где у вас управляется домен — у регистратора или в панели хостинга — добавляете запись:
   • тип — CNAME
   • имя — pages
   • значение — ИМЯ.pages.dev
3. Ждёте несколько минут, пока разойдётся DNS. Сертификат Cloudflare выпустит сам.

Если домен уже обслуживается в Cloudflare, второй шаг не нужен: запись создастся сама. Записи основного сайта на Tilda при этом не трогаются — поддомен живёт отдельно от корня.

Что выбрать

Где спотыкаются

• Ждут, что Claude опубликует прямо в TildaНельзя: API Tilda работает только на чтение. Страница всегда живёт снаружи.
• Ставят iframe с фиксированной высотойПолучается скролл внутри скролла, особенно больно на телефоне. Нужна передача высоты из страницы.
• Забывают проверку источника в обработчике сообщенийБез строки с e.origin вашим блоком может управлять любой сайт.
• Подставляют параметр из адреса прямо в srcОткрытая дверь: на вашем сайте можно показать чужую страницу. Только белый список.
• Создают CNAME до того, как добавили домен в PagesПоддомен не поднимется. Сначала дашборд.
• Кладут страницу и картинки в разные местаПубликуется папка целиком. Картинки должны лежать рядом со страницей, а ссылки на них — быть относительными. Это четвёртый и пятый пункты промпта, но проверить нелишне.

Что дальше

Когда публикация перестаёт быть ручной работой, меняется сам подход к страницам. Отдельная страница под конкретную рассылку, калькулятор под один разговор с клиентом, разбор для одного заказчика — всё это перестаёт стоить времени, а значит начинает делаться. Дизайн собирает Claude Code, вы говорите, что поправить.