Виджет отзывов для сайта на Tilda

Отзывы на страницу сайта на Tilda ставят двумя способами: свёрстанными вручную картинками или виджетом, который сам забирает отзывы из карточки компании в Яндекс.Картах и 2ГИС. Второй способ занимает меньше времени: код вставки состоит из одной строки, а список отзывов обновляется без вашего участия. Ниже порядок установки, место блока на странице и причины, по которым виджет иногда не появляется.

Что нужно, чтобы добавить отзывы на сайт Tilda

Модуль, плагин и доступ к файлам сайта не нужны: блок отзывов в Tilda собирается из тех отзывов, что уже опубликованы в карточке компании. Виджет работает на стороне браузера посетителя: страница запрашивает скрипт с сервера сервиса, скрипт рисует отзывы в отведённом для него месте. Хостинг, шаблон и настройки Tilda трогать не придётся.

Сначала соберите виджет в конструкторе виджета отзывов: вставьте ссылку на карточку компании в Яндекс.Картах или 2ГИС, выберите вид, тему и цвет звёзд и ссылок, и сервис вернёт готовый код. Ссылка нужна та, что стоит в адресной строке открытой карточки: по названию компании сервис её не ищет.

В один виджет можно добавить до пяти карточек, например для двух филиалов. Отзывы соберутся в общий блок.

Пошаговая установка в Tilda

Порядок одинаковый для любого шаблона: на страницу нужно добавить произвольный HTML.

Соберите виджет и скопируйте код вставки. Это одна строка вида <script src="https://seo-paul.ru/widget.js?id=..."></script>.
Откройте нужную страницу в редакторе Tilda. Код ставится на конкретную страницу.
Добавьте блок HTML-код. Он лежит в разделе «Другое» каталога блоков. Внутри блока есть поле для кода.
Вставьте код целиком, одной строкой, без правок и переносов.
Опубликуйте страницу. В режиме редактирования виджет не показывается: скрипт выполняет браузер посетителя, а редактор отдаёт служебную версию страницы.
Откройте страницу по обычному адресу и проверьте, появились ли отзывы там, где стоит блок HTML-код.

Настройки хранятся по номеру виджета, поэтому личный кабинет не нужен. Вернуться к ним можно по адресу /widget?id=... из скопированной строки: настройки откроются заново, и код можно пересобрать.

Куда поставить блок на странице

Место для отзывов выбирайте там, где человек уже понял, что вы предлагаете, и решает, обращаться ли к вам. На практике это блок под ценами или под списком услуг, рядом с формой заявки. Посетитель читает условия, видит подтверждение от других клиентов и заполняет форму.

В самом низу страницы отзывы работают хуже. До подвала доходят не все: часть людей уходит раньше, часть добирается до формы и отправляет заявку, так и не увидев отзывы. Если блок должен работать аргументом при выборе, ставьте его выше формы заявки или сразу под ней.

Код можно поставить на нескольких страницах: каждая получает свою копию, а отзывы подтягиваются одни и те же. Отдельная страница «Отзывы» в меню тоже полезна, но посетители редко ищут её сами.

Как настроить вид под дизайн сайта

Оформление выбирают при сборке виджета: вариантов немного, разбираться в вёрстке не придётся. Тема бывает светлая и тёмная, тёмную берут для страниц на тёмном фоне. Цвет звёзд и ссылок задаёт оттенок звёзд и ссылок, поэтому его подбирают под цвет кнопок на сайте.

Вид блока выбирают по задаче. Список показывает несколько отзывов подряд и подходит для страницы услуги. Карусель занимает меньше места и выручает в узкой колонке. Компактная строка даёт сводную оценку и пару цитат там, где места мало. Отзывов можно показать до пятидесяти, а порог оценки скрывает всё, что ниже выбранного балла.

Отступы вокруг виджета настраиваются средствами самой Tilda: блок встаёт в общую сетку страницы как любой другой. Отдельных настроек полей в виджете нет.

Как проверить, что виджет работает

Результат виден на опубликованной странице. Откройте её адрес в браузере и пролистайте до блока с отзывами: если отзывы появились, виджет на месте.

Затем откройте ту же страницу на телефоне: так видно, как блок смотрится в узкой колонке. На тёмном фоне проверьте, что даты и подписи читаются.

Виджет подгружается, когда до него дошла прокрутка страницы, поэтому страница не ждёт чужие данные при открытии. В самом низу страницы это заметно: блок появляется с задержкой в доли секунды, пока браузер запрашивает отзывы. Данные кэшируются в браузере посетителя на полчаса, поэтому при повторных открытиях блок показывается сразу.

Что ещё тормозит страницы и в каком порядке это исправляют, я разбирал в статье про скорость загрузки сайта.

Если виджета не видно

Четыре причины встречаются чаще остальных, и проверяют их по порядку.

Страница не опубликована. В черновике и в режиме редактирования скрипт не выполняется. Опубликуйте страницу и откройте её по обычному адресу.
В блок попала часть строки кода. Код вставляют целиком: если потерялся тег script или обрезался id, виджету нечего запрашивать.
В карточке нет отзывов с текстом. Оценки без слов виджет не показывает, поэтому блок окажется пустым или коротким. Сколько отзывов прочитано, видно при сборке.
Блок стоит внутри другого блока, который скрыт на этом разрешении экрана. На компьютере отзывы видны, на телефоне нет. Перенесите блок HTML-код на верхний уровень страницы.

Чего виджет не делает

Сервис бесплатный и без регистрации, поэтому у него есть границы. Площадок две: Яндекс.Карты и 2ГИС. Авито и Google Maps не поддерживаются. Подробнее о площадках: виджет отзывов из Яндекс.Карт и виджет отзывов из 2ГИС.

Отзывы обновляются раз в сутки: новый отзыв появится на сайте на следующий день, и сводная оценка обновится тогда же. Если площадка не отвечает, виджет покажет ранее собранные отзывы с датой сбора.

В подвале виджета стоит ссылка на seo-paul.ru, и убрать её нельзя: это единственная плата за бесплатный сервис. Микроразметка отзывов о своей компании не даёт звёзд в результатах поиска Google, поэтому виджет ставят ради доверия посетителей.

С чего начать

Если карточка компании заведена и в ней есть отзывы, установка занимает несколько минут: собрать код, поставить блок, опубликовать страницу. Ссылку берите из адресной строки открытой карточки в Яндекс.Картах или 2ГИС.

Когда сайта ещё нет, порядок другой: сначала структура страниц и содержание, потом внешние скрипты и виджеты. Место под отзывы стоит предусмотреть сразу, вместе со страницей услуг, как я разбирал в статье что нужно для создания сайта.

Собрать виджет бесплатно

Частые вопросы

Куда в Tilda вставлять код виджета?

В блок HTML-код: он лежит в разделе «Другое». Код вставляется целиком, одной строкой, в то место страницы, где должны стоять отзывы.

Нужно ли что-то настраивать в самой Tilda?

Нет. Виджет работает на стороне браузера, доступ к настройкам сайта и модули не нужны.

Виджет не появился на опубликованной странице. Что проверить?

Проверьте, что страница опубликована, а не только сохранена, и что в блок вставлена вся строка с тегом script. В режиме редактирования Tilda виджет не показывается — смотрите на опубликованной странице.

Можно ли настроить вид под дизайн сайта?

Да. Есть светлая и тёмная тема, цвет звёзд и ссылок, вид блока (список, лента, значок) и порог оценки, ниже которого отзывы не показываются.