Установка и быстрый старт
Плагин создаёт пакет в Figma или Pixso, расширение принимает его в Tilda, а сайт хранит аккаунт и доступ.
Установите плагин и расширение
Установите плагин TildEka в Figma или Pixso и добавьте расширение TildEka в браузер (Chrome, Edge, Яндекс). Авторизуйтесь под единым аккаунтом.
Выделите любые элементы или экраны
Выделите нужные слои в макете: это может быть отдельная кнопка, карточка, текст, вектор, группа Auto Layout или несколько адаптивных экранов под брейкпоинты (1200..320 px). Для интерактивов (слайдер, табы, аккордеон) добавьте в имена слоёв маркеры [c-].
Скопируйте пакет в плагине
В плагине TildEka нажмите «Обновить и синхронизировать», дождитесь подготовки и нажмите «Скопировать пакет». Плагин упакует все слои, стили, векторный SVG, нативный Flexbox и код интерактивов в буфер обмена.
Вставьте в Zero Block кнопкой TILDEKA
Откройте редактор Zero Block в Tilda, нажмите кнопку TILDEKA на верхней панели и выберите «Импортировать пакет из буфера» (обычный Ctrl+V в Tilda не нужен). Подтвердите импорт.
Сохраните и опубликуйте
Zero Block мгновенно заполнится элементами с точными координатами по всем брейкпоинтам. Нажмите «Сохранить» и опубликуйте страницу: слайдеры, табы и аккордеоны работают сразу, без ручного кода T123.
Подробная установка Figma, Pixso и расширения
TildEka состоит из трёх связанных частей. Сайт отвечает за аккаунт и лимиты, плагин собирает макет, расширение вставляет его в Zero Block.
Figma
Откройте Figma Community, найдите TildEka и нажмите Run или Save. В нужном файле запустите Plugins → Saved plugins → TildEka. Плагин работает локально: API-токен Figma не нужен.
Pixso
Откройте Pixso Community, установите TildEka и запустите его в макете. Интерфейс и формат пакета такие же, а редактор определяется автоматически. Если Community-версия ещё проходит модерацию, используйте локальную установку из официального архива TildEka.
Chrome / Edge
Установите расширение TildEka в Chromium-браузер. Нажмите «Авторизоваться»: откроется сайт. После входа или регистрации сайт подтвердит привязку, а расширение получит отдельную защищённую сессию. Пароль расширению не передаётся.
Tilda
Откройте страницу и редактор Zero Block, затем обновите вкладку. Кнопка TILDEKA появляется именно внутри Zero Block. Нажмите её и выберите «Импортировать пакет из буфера» — обычный Ctrl+V не требуется.
Как проверить, что всё связано
- В кабинете отображается ваш email и доступ.
- В расширении виден статус «Подключено».
- Плагин видит выбранные элементы или экраны и рассчитывает геометрию.
- После импорта операция появляется в истории кабинета.
- Каждый успешный импорт уменьшает бесплатный остаток на один.
Подготовка макета
Импортёр читает не только пиксели, но и структуру. Эти три простых правила делают результат предсказуемым.
Адаптивы «Hero / 960», «Hero / 640», «Hero / 320»
↳ Button [c-hero-button] [l-#pricing]
↳ Слайдер [c-slide], табы [l-#tab] или обычные группы и Auto Layout
Интерактивы из имён слоёв
TildEka генерирует скрытый HTML-runtime внутри Zero Block. Никаких ручных скриптов после импорта.
Что переносится
Текст, формы, фигуры и медиа сохраняют редактируемость там, где это позволяет Tilda.
Где хранятся данные и как всё проверить
Сайт хранит аккаунт и право на импорт. Сам макет идёт напрямую из плагина в расширение через буфер обмена и в базу сайта не попадает.
Проверьте работу за пять минут
Создайте аккаунт и запомните число оставшихся импортов. Выполните тестовый импорт любого элемента или макета и обновите кабинет — остаток уменьшится на один, а операция появится в истории. Повторите импорт: после второго успешного завершения остаток уменьшится ещё на один. Отменённая или неуспешная операция лимит не расходует. Выйдите и войдите снова — тариф, остаток и история сохранятся.
Частые вопросы
Нужен ли платный аккаунт Figma?
Нет. TildEka работает локально и не использует Figma API, токены или платную подписку.
Чем умная синхронизация отличается от замены?
Она сопоставляет слои по устойчивому ключу, обновляет выбранные категории и сохраняет остальные элементы блока. Первый импорт создаёт связи, а последующие используют их.
Что происходит с изображениями?
В Beta 0.2.3 есть три режима: автоматическая загрузка уникальных WebP на CDN Tilda, создание нативных блоков нужного размера для ручной загрузки и полный пропуск растров.
Поддерживается ли Pixso?
Да. Pixso использует тот же экспортёр и отдельный manifest. Хост определяется автоматически, а пакет совместим с тем же расширением.
Почему кнопка не появляется?
Расширение добавляет кнопку только в редакторе Zero Block. Убедитесь, что оно загружено, обновите вкладку Tilda и откройте редактор блока.
Как сделать слайдер?
Добавьте имена-маркеры [c-slide], [l-#prev], [l-#next], [c-dot], [c-current], [c-total] и [c-scrollbar]. Runtime создастся автоматически при импорте.