Как добавить кнопки в карточку товара Tilda при импорте из Excel
При создании интернет-магазина на Tilda многие сталкиваются с проблемой: нужно разместить в карточке товара 3 кнопки со ссылками на внешние площадки (Wildberries, Ozon, Яндекс.Маркет), но стандартные шаблоны не позволяют это сделать, а при импорте из Excel ссылки в описании становятся некликабельными. В этой статье мы разберём, как решить задачу автоматически, без ручного редактирования каждой карточки.
Почему ссылки из Excel не работают в Tilda
При импорте товаров через CSV или XLSX файл Tilda воспринимает содержимое поля «Описание» как обычный текст. Даже если вы вставите HTML-код ссылки (например, <a href="https://...">Купить на WB</a>), платформа экранирует его и показывает как строку. Это сделано для безопасности, но мешает автоматическому созданию кликабельных элементов.
Способ 1: Использовать Zero Block в шаблоне карточки
Самый надёжный вариант - изменить шаблон карточки товара (TPL) и добавить в него Zero Block с тремя кнопками. В настройках каждой кнопки укажите переменную, например, [wb_link], [ozon_link], [yam_link]. Затем в Excel-файле создайте одноимённые столбцы и заполните их полными URL-адресами. При импорте Tilda подставит ссылки в кнопки автоматически.
- Плюсы: полный контроль дизайна, ссылки всегда кликабельны.
- Минусы: нужно один раз настроить шаблон (требует навыков работы с Zero Block).
Способ 2: Использовать HTML-блок в описании
Если вы не хотите менять TPL, можно вставить HTML-код прямо в поле «Описание» Excel-файла. Для этого в каждой ячейке пропишите:
<div style="display:flex; gap:10px;">
<a href="https://www.wildberries.ru/catalog/..." target="_blank" style="padding:10px 20px; background:#6f38c5; color:#fff; border-radius:5px; text-decoration:none;">Wildberries</a>
<a href="https://www.ozon.ru/product/..." target="_blank" style="padding:10px 20px; background:#005bff; color:#fff; border-radius:5px; text-decoration:none;">Ozon</a>
<a href="https://market.yandex.ru/product/..." target="_blank" style="padding:10px 20px; background:#fc3f1d; color:#fff; border-radius:5px; text-decoration:none;">Яндекс.Маркет</a>
</div>Однако Tilda может «съесть» часть HTML при импорте. Чтобы этого избежать, используйте плагин THTML или специальный скрипт, который заменяет текст на HTML после загрузки страницы. Этот метод требует доработки и подходит, если вы готовы тестировать.
Способ 3: Автоматизация через API Tilda
Для опытных пользователей: напишите скрипт на Python или JavaScript, который через Tilda API обновляет поле «Описание» у каждого товара, вставляя готовый HTML-код с кнопками. Это полностью автоматизирует процесс и гарантирует, что ссылки будут рабочими. Примерный алгоритм:
- Получите список товаров через
GET /v1/getproductslist. - Для каждого товара сформируйте HTML с кнопками, используя данные из вашей базы.
- Отправьте обновление через
POST /v1/updateproduct.
Что делать, если товаров очень много (1000+)
Для массового импорта лучше всего комбинировать Способ 1 (шаблон с Zero Block) и Способ 3 (API). Создайте шаблон с переменными для ссылок, а затем через API или Excel-импорт заполните эти переменные. Это самый быстрый и надёжный путь, который не потребует ручной правки каждой карточки.
Заключение
Добавить кликабельные кнопки в карточку товара Tilda при импорте из Excel реально. Выберите подходящий метод: настройка шаблона с Zero Block - для новичков, HTML в описании - для тех, кто готов экспериментировать, API - для автоматизации на потоке. Главное - заранее продумать структуру данных в Excel и правильно назвать столбцы.