Тильда отзывы выводит через штатный блок из категории «Отзывы»: фото, имя, текст, звёздный рейтинг, вёрстка занимает пять минут в редакторе. Проблема вылезает, когда у клиента уже сотня отзывов на Яндекс Картах и 2ГИС, и он ждёт, что они появятся на сайте сами, без ручного копирования. За разбором таких задач ко мне приходят регулярно: то нужно подтянуть отзывы с карт в существующий блок, то собрать собственную карусель, потому что стандартный слайдер Тильды не вписывается в дизайн и не умеет фильтровать отзывы по оценке.
По теме статьи
Готовое решение
Массовое изменение цен в каталоге Tilda
Скрипт поднимает или снижает цены товаров и вариантов в каталоге Tilda на заданный процент. Сначала показывает таблицу «было / станет», меняет только после подтверждения.
от1 000 ₽
Кастомный скрипт
Когда стандартных блоков не хватает
Доработка сайтов на Тильде: скрипты для корзины, промокоды, зоны доставки, интеграции с CRM и Telegram. Простой скрипт от 3 000
от3 000 ₽
Штатный блок отзывов в Тильде: что умеет T‑блок
Блоки из категории «Отзывы» в панели Тильды рассчитаны на ручное наполнение: заводите карточку, вставляете фото и текст, выбираете рейтинг звёздами, настраиваете сетку или горизонтальный слайдер. У части блоков есть настройка, которая ограничивает число карточек в ленте и включает прокрутку по клику или свайпу. Из плюсов - это часть штатного редактора, работает без единой строчки кода и правится любым менеджером клиента без обращения к разработчику.
Из минусов - данные не связаны ни с одной внешней площадкой. Если клиент получил пять новых отзывов на Яндекс Картах, их переносят в Тильду вручную: копируют текст, оценку, иногда имя автора. Для сайта с одним-двумя отзывами в месяц это не проблема, для салона или клиники с потоком в 20-30 отзывов в месяц это уже рутина, которую хочется снять с администратора. Ещё момент - у штатного блока нет микроразметки отзывов, которая помогает поисковику показать звёздный рейтинг прямо в выдаче рядом со сниппетом сайта.
Отзывы с Яндекс Карт и 2ГИС на сайте Tilda
Код виджета отзывов берут не в кабинете Яндекс Бизнеса, а в карточке организации на Яндекс Картах: открыть карточку, нажать кнопку в правом верхнем углу страницы, выбрать «Поделиться» и скопировать код из поля «Виджет с отзывами», рядом есть кнопка «Предпросмотр». Подтверждать права на карточку для этого не требуется. Виджет работает корректно при ширине от 300 px до 760 px, рекомендуемая высота не меньше 500 px, а тему и размер выбирают уже у другого материала: в кабинете Яндекс Бизнеса, в разделе «О компании» - «Промоматериалы», отдают бейдж с рейтингом организации, без самих отзывов. У бейджа выбирается светлая или тёмная тема, а размер неизменный: 150 пикселей в ширину и 50 в высоту. Готовый код вставляется в Тильду через блок «HTML-код» из категории «Другое» в панели добавления блоков. Обновление происходит на стороне Яндекса - при каждой загрузке страницы виджет тянет актуальные данные, руками ничего переносить не нужно.
У 2ГИС в кабинете партнёра есть похожий раздел с кодом для встраивания рейтинга и отзывов на внешний сайт, доступ к нему тоже открывается после подтверждения организации. Логика та же: копируете сниппет, вставляете в нужный блок Тильды, а дизайн виджета при этом задаёт сама площадка - шрифты, отступы и цвета внутри iframe через настройки Тильды не переопределить, максимум можно ограничить ширину контейнера в CSS сайта.
Из практики: такие виджеты лучше ставить ниже первого экрана, а не в шапку сайта. Iframe подгружается отдельным запросом, и на мобильном интернете это иногда даёт заметную задержку первой отрисовки страницы. Если виджет стоит прямо под первым блоком, страница на медленном мобильном интернете может ощутимо тормозить именно из-за него.
Бесплатный материал
🎁 Полезный скрипт в подарок
Подпишитесь на Telegram - пришлю готовый скрипт по этой теме.
Без спама. Отписка в 1 клик.
Виджеты Google-отзывов и агрегаторов
С Google Business Profile ситуация другая: официального конструктора виджета для встраивания отзывов на сторонний сайт там нет, поэтому обычно берут стороннюю прослойку - сервис-агрегатор, который синхронизируется с карточкой организации через открытые данные и отдаёт готовый код для вставки, либо делают собственный запрос к публичным данным карточки и рисуют вывод самостоятельно.
Во втором случае ключ доступа к API нельзя оставлять в открытом JS-коде на странице - его увидит любой в исходном коде и сможет расходовать чужую квоту запросов. Правильная схема - небольшой PHP-скрипт на хостинге сайта, который сам обращается к внешнему сервису, кэширует ответ на несколько часов и отдаёт браузеру уже готовый JSON без ключа внутри.
Такой прокси-сценарий удобен, если нужно объединить отзывы сразу с нескольких площадок в одной ленте, например Яндекс Карты, 2ГИС и Google под общим дизайном сайта. Отдельные виджеты каждой площадки в таком сценарии не подходят: у каждого свой стиль оформления, и рядом друг с другом они смотрятся как три разных сайта.
Своя карусель отзывов вместо стандартного блока
Свою карусель собираю, когда нужен полный контроль над дизайном, отзывы приходят из нескольких источников сразу или заказчику важно показывать только отзывы от четырёх звёзд и выше. Тильда - конструктор без серверной части для выполнения кода, поэтому обновление данных выношу в отдельный контур: небольшой PHP-скрипт на обычном хостинге сайта собирает свежие отзывы в JSON-файл, а карусель на странице делает запрос к этому файлу при загрузке.
Если отзывы нужно забирать по расписанию сразу с нескольких площадок, сценарий сборки собираю в n8n (автоматизация в n8n: от 25 000 ₽) - там же добавляю уведомление в Telegram, когда прилетает отзыв с низкой оценкой, чтобы менеджер реагировал сразу, а не находил его через неделю в общей ленте.
В JSON-файл обычно кладу только имя, оценку и текст - точную фамилию, телефон или ссылку на профиль автора из исходной карточки не тащу, для карусели на сайте они не нужны.
Разметка и стили
Каркас карусели - три вложенных блока: обёртка, лента с карточками и кнопки переключения. Ширину карточки и расстояние между ними задаю в CSS процентами, чтобы на мобильном экране помещался один отзыв, а не три. Аватары авторов гружу с атрибутом ленивой загрузки - для ленты из десяти-пятнадцати карточек это заметно ускоряет первую отрисовку.
<div class="reviews-slider">
<div class="reviews-slider__track">
<div class="reviews-slider__item">Отзыв 1</div>
<div class="reviews-slider__item">Отзыв 2</div>
<div class="reviews-slider__item">Отзыв 3</div>
</div>
<button class="reviews-slider__prev" aria-label="Назад"></button>
<button class="reviews-slider__next" aria-label="Вперёд"></button>
</div>Логика переключения слайдов
Логика на чистом JavaScript без сторонних библиотек: считаем индекс активного слайда и сдвигаем ленту через translateX. Для свайпов на телефоне добавляю обработчики touchstart и touchend со сравнением координат по оси X, отдельная библиотека для трёх-пяти строк такой логики только увеличит вес страницы. Автопрокрутку через таймер ставлю с паузой при наведении курсора или касании - иначе пользователь не успевает дочитать длинный отзыв до автоматической смены слайда.
const track = document.querySelector('.reviews-slider__track');
const items = document.querySelectorAll('.reviews-slider__item');
let index = 0;
function goTo(i) {
index = (i + items.length) % items.length;
track.style.transform = `translateX(-${index * 100}%)`;
}
document.querySelector('.reviews-slider__next').addEventListener('click', () => goTo(index + 1));
document.querySelector('.reviews-slider__prev').addEventListener('click', () => goTo(index - 1));
Модерация и SEO-разметка отзывов на Tilda
Если отзывы собираются автоматически, добавляю простую модерацию: новые записи из JSON сначала попадают в отдельный файл на проверку, на сайт публикуются только те, что менеджер отметил галочкой. Без этого шага случайный резкий комментарий или отзыв не по адресу вылезет на витрину раньше, чем кто-то его заметит.
Отдельно добавляю микроразметку schema.org с типом Review и AggregateRating прямо в вёрстку карусели - это не обязательное требование, но именно она даёт шанс на звёздный рейтинг в поисковой выдаче рядом со сниппетом сайта. У штатного T‑блока Тильды такой разметки нет, поэтому её приходится добавлять вручную в блок с HTML-кодом.
Сколько стоит доработка блока отзывов
Цена зависит от объёма работы, а не от того, стоит блок на лендинге или в интернет-магазине - переверстка чужого макета и сборка карусели с нуля по трудозатратам разные задачи независимо от типа сайта. На итоговую цену влияет число источников данных (одна площадка или сразу три), нужна ли модерация перед публикацией и требуется ли уведомление в Telegram при новом отзыве.
| Вариант | Обновление отзывов | Кастомизация дизайна |
|---|---|---|
| Штатный T‑блок Тильды | Вручную, руками в редакторе | Ограничена настройками блока |
| Виджет с Яндекс Карт или 2ГИС | Автоматически, тянется с площадки | Минимальная, дизайн задаёт площадка |
| Своя карусель на JS | Автоматически или по расписанию через n8n | Полная, под дизайн сайта |
По расценкам это выглядит так:
- Перестилизовать штатный T‑блок под шрифты и цвета сайта, добавить звёздный рейтинг - кастомный скрипт для Tilda (простая доработка): от 3 000 ₽.
- Встроить готовый виджет с Яндекс Карт или 2ГИС и адаптировать под мобильные экраны - тоже простая доработка, от 3 000 ₽.
- Собрать свою карусель с нуля, подключить сбор данных с нескольких площадок и уведомления в Telegram - это уже комплексная интеграция для Tilda, от 40 000 ₽.
Если помимо блока отзывов нужен весь сайт с нуля, беру это отдельной услугой - разработка сайта на Тильде.
Условия и возможности Тильды меняются, поэтому перед запуском я уточняю их у самого сервиса.
Частые вопросы
Можно ли вывести отзывы с Яндекс Карт на Тильде бесплатно?
Сам виджет из личного кабинета Яндекс Бизнеса бесплатный, компания не берёт денег за код для встраивания. Платите только за работу по вставке и адаптации под дизайн сайта, если делаете это не своими силами - как кастомную доработку блока Тильды такую задачу обычно оценивают от 3 000 ₽.
Замедлит ли виджет отзывов загрузку сайта на Tilda?
Iframe-виджет с карты подгружается отдельным запросом и может дать заметную задержку на мобильном, особенно если поставить его в верхней части страницы. Обычно выношу такие блоки ниже первого экрана и подключаю отложенную загрузку при прокрутке, чтобы виджет не мешал загрузке основного контента.
Как часто обновляются отзывы, подтянутые с карт?
Официальный iframe-виджет отдаёт актуальные данные при каждой загрузке страницы, здесь обновление в реальном времени. У своей карусели с промежуточным JSON-файлом частота зависит от расписания сценария в n8n, обычно ставлю проверку раз в сутки - для большинства ниш этого достаточно, чаще имеет смысл только для мест с очень активным потоком отзывов.
Что делать, если площадка не даёт кода виджета для отзывов?
Собираю данные отдельным скриптом и вывожу их через свою карусель - вариант описан в разделе про собственную карусель выше. Для площадок без готового виджета и без публичного API это единственный рабочий путь, кроме ручного переноса отзывов в штатный блок Тильды.