Краткий ответ
360° на Tilda: publish в Studio (имя = SKU, Active) → embed widget.js в T123 или Zero Block → data-key + data-sku. Ленивая загрузка и модалка. Тест на опубликованной странице, не в preview.
Интерактивный 360° обзор помогает покупателю «потрогать» вещь через экран. На Tilda стандартные галереи листают только плоские фото — но можно добавить вращающийся спин, не переезжая на другую платформу.
Разберём, как сделать это аккуратно через Spinnify — даже если вы никогда не писали код.
3 шага к интеграции: от фото до сайта
Вся работа строится вокруг embed-кода, который добавляется в блоки Tilda.
1. Подготовка в Spinnify Studio
Прежде чем идти в Tilda:
- Зарегистрируйтесь в Spinnify Studio.
- Загрузите серию фото (24–36 кадров) и создайте продукт.
- Важно: имя продукта = артикул (SKU) товара в каталоге Tilda.
- Опубликуйте продукт в статус Active.
2. Добавление кода на Tilda
Два способа вставить интерактивный обзор:
Способ А: через блок T123 (самый простой). В карточке товара нажмите «Добавить блок» → T123 (HTML-код). Скопируйте код из раздела Embed в Spinnify, вставьте в T123 → «Сохранить».
Способ Б: через Zero Block (для дизайнеров). Добавьте элемент HTML, вставьте тот же код из Spinnify — можно двигать кнопку по экрану и настраивать отступы.
3. Настройка связи
Код выглядит примерно так: <script src="..." data-key="ВАШ_КЛЮЧ" data-sku="АРТИКУЛ"></script>
- data-key — ваш уникальный ключ (не меняйте).
- data-sku — связь с товаром: укажите артикул из настроек магазина Tilda. Система подгрузит нужный спин.
Почему это работает быстро?
Многие боятся, что сторонние скрипты замедлят сайт. С Spinnify на Tilda иначе:
- Ленивая загрузка: браузер не качает тяжёлые фото, пока пользователь не нажмёт кнопку.
- Изоляция: обзор открывается в модальном окне и не нагружает основной код сайта.
- Облако: фото сжимаются в WebP и грузятся через быстрый CDN.
Чек-лист: что делать, если кнопка не появилась?
- Опубликована ли страница Tilda? Работайте на «живой» ссылке — в preview Tilda часто блокирует внешние скрипты.
- Совпадают ли имена? Продукт в Studio и артикул в Tilda — до знака (пробелы и дефисы важны, регистр — нет).
- Опубликован ли продукт в Studio? Черновик — кнопки не будет.
- Уникален ли ключ? Проверьте data-key из личного кабинета Spinnify.
- Один скрипт на блок: не вставляйте код дважды в одну секцию.
Можно ли настроить вид кнопки?
Да. В настройках Spinnify Studio можно выбрать:
- Где будет кнопка — справа, слева или по центру.
- Цвета и подпись под бренд на Tilda.
- Формат: круглый «плавающий» значок или узкая вкладка для минималистичного дизайна.
Интеграция готова. Лендинг на Tilda стал витриной, где каждый товар можно рассмотреть в деталях.
Съёмка спинов: DIY на смартфон. Shopify: гайд интеграции. Полный гайд Spinnify.
