Добавить комментарии на сайты Shopify
FastComments доступен в Магазине приложений Shopify. Установите приложение и добавьте блоки FastComments на любую запись блога, страницу товара или настраиваемую страницу через редактор темы Shopify. Редактирование кода не требуется.
Когда вы устанавливаете приложение, Shopify создаёт ваш аккаунт FastComments, привязывает домен магазина и автоматически подключает биллинг. Вам не нужно регистрироваться на fastcomments.com отдельно.
Страницы этого руководства описывают каждый блок FastComments, который предоставляет приложение, как работает единый вход (single sign-on) для ваших клиентов Shopify и как импортировать существующие комментарии Shopify перед переключением.
Установить приложение FastComments 
Установка из Shopify App Store
- Откройте страницу FastComments в Shopify App Store.
- Нажмите Add app и выберите план, который хотите в процессе установки.
- После завершения установки Shopify перенаправит вас обратно в административную панель FastComments внутри Shopify.
На этом установка завершена. Ничего не нужно вставлять в файлы темы.
Что настраивается для вас
Установка выполняет всё, что вы в противном случае делали бы вручную:
- Для вашего магазина создаётся tenant FastComments и связывается с доменом магазина.
- URL вашего магазина добавляется в список разрешённых доменов tenant'а, чтобы комментарии загружались без ошибки домена.
- Записывается shop metafield
fastcomments.tenant_id, чтобы каждый блок знал, какой tenant использовать для рендеринга. - Единый вход (SSO) для клиентов Shopify включён по умолчанию.
- Оплата проходит через Shopify Managed Pricing. Списания отображаются в вашем обычном счёте Shopify. Обновить тариф, понизить или отменить можно в Settings > Apps and sales channels > FastComments в админке Shopify.
Если ваш магазин уже был клиентом FastComments до установки приложения, установка повторно использует существующий tenant вместо создания нового.
Встроенная админ-панель
Когда вы открываете приложение FastComments из админки Shopify, вы попадаете на дашборд с плитками—одним кликом переходящими в полнофункциональную бэкенд-панель FastComments:
- Dashboard: настройки аккаунта, использование и сведения о подписке.
- Moderation Queue: одобрять, отклонять и отвечать на комментарии по всему магазину.
- Customize: настраивать цвета виджета, шрифты, правила модерации и конфигурацию.
- Ratings & Reviews Helper: настроить рейтинги в виде звёзд и вопросы отзывов, если вы хотите использовать блок Reviews Summary.
Каждая плитка открывает FastComments по одноразовой ссылке для входа, поэтому вам не нужен отдельный логин.
Далее: добавьте блоки в ваш магазин
Откройте редактор темы Shopify (Online Store > Themes > Customize), откройте шаблон, в который вы хотите добавить комментарии или отзывы, и нажмите Add block. Блоки FastComments появятся в разделе Apps. Остальная часть этого руководства рассматривает каждый из них.
Добавить комментарии к записям блога и продуктам
Блок FastComments — это основной виджет комментариев. Добавьте его в шаблоны записей блога, шаблоны товаров или на любую другую страницу, где вам нужна ветка обсуждения или живой чат.
Добавление блока
- Откройте редактор темы Shopify (Online Store > Themes > Customize).
- Выберите шаблон, на котором нужны комментарии: Blog post, Product или любой другой шаблон страницы или секции.
- В секции, где должны появиться комментарии, нажмите Add block.
- В разделе Apps выберите FastComments.
- Нажмите Save.
Блок появляется сразу. Вводить Tenant ID не нужно; тенант вашего магазина подключается автоматически при установке приложения.
Настройки
| Настройка | Что делает | По умолчанию |
|---|---|---|
| Tenant ID (необязательно) | Позволяет переопределить, к какому тенанту FastComments привязан блок. Оставьте пустым, чтобы использовать автоматически настроенный тенант магазина. Ручной Tenant ID можно найти на fastcomments.com/auth/my-account/api-secret. | (пусто) |
| SSO | Автоматически авторизует посетителя под его аккаунтом клиента Shopify перед комментированием. См. Auto-Login Shopify Customers. | Вкл |
| Стиль комментирования | Threaded для вложенных ответов и голосования или Streaming для ленты чата в реальном времени. | Threaded |
| Custom URL ID | Переопределяет автоматически определённый идентификатор страницы. Используйте, если хотите, чтобы два URL использовали одну ветку комментариев. | (автоопределение) |
Как выбирается идентификатор страницы
Каждая ветка комментариев привязана к URL ID. Блок выбирает его автоматически:
- Шаблон записи блога:
shopify-article-{article.id}— стабилен при изменении слага и заголовка. - Шаблон товара:
shopify-product-{product.id}— стабилен при изменении слага и заголовка. - Другие шаблоны: путь запроса.
Если задан Custom URL ID, используется это значение. Используйте одинаковый Custom URL ID в нескольких блоках (например, на локализованной версии страницы товара), чтобы использовать одну ветку комментариев.
Threaded и Streaming
Threaded — режим по умолчанию. Посетители отвечают друг другу, голосуют, и инструменты модерации работают как ожидается. Лучше всего подходит для записей блога и отзывов о товарах.
Streaming убирает ветвление и показывает новые комментарии в реальном времени по мере их публикации, как в чате. Лучше всего подходит для запусков продуктов, прямых трансляций и страниц сообществ.
Несколько блоков на одной странице
Блок можно добавить на один шаблон несколько раз. Например, «Reviews Summary» вверху страницы товара и блок FastComments внизу. Блоки используют один URL ID, поэтому сводка отражает комментарии ниже.
Советы
- Блок скрывает себя в предпросмотре редактора темы с жёлтым уведомлением, если не может найти тенант. Если это появляется в вашем рабочем магазине, переустановите приложение FastComments.
- На странице товара блок FastComments также выполняет роль виджета отзывов о товаре. Используйте его вместе с FastComments - Reviews Summary для сводки со звёздным рейтингом вверху страницы.
Добавить значок количества комментариев
The FastComments - Счётчик комментариев блок отображает небольшой счётчик комментариев для отдельной страницы. Используйте его в списках публикаций блога, карточках товаров или в любом шаблоне, который ссылается на страницу с комментариями, чтобы посетители могли увидеть, насколько активна каждая тема, прежде чем переходить по ссылке.
Добавление блока
- Откройте редактор тем Shopify.
- Откройте шаблон, в котором вы хотите, чтобы отображался счётчик. Например, шаблон Блог (список публикаций) или секция с перечнем товаров.
- Нажмите Добавить блок в секции, которая рендерит каждый элемент.
- В разделе Приложения выберите FastComments - Счётчик комментариев.
- Нажмите Сохранить.
Параметры
| Setting | What it does | Default |
|---|---|---|
| Tenant ID (optional) | Указывает, к какому tenant FastComments будет обращаться счётчик. Оставьте пустым, чтобы использовать tenant, автоматически настроенный для магазина. | (пусто) |
| Custom URL ID | Переопределяет идентификатор страницы, по которому выполняется поиск счётчика. Используйте это, когда счётчик находится на другой странице, чем блок FastComments, за которым он отслеживает. | (определяется автоматически) |
Как счётчик сопоставляет ветку комментариев
Блок Счётчик комментариев использует ту же логику автодетекции, что и блок FastComments:
- Blog post template:
shopify-article-{article.id} - Product template:
shopify-product-{product.id} - Other templates: the request path
Если вы задали Custom URL ID в блоке FastComments на странице, установите тот же Custom URL ID в блоке Счётчика комментариев, чтобы они указывали на одну и ту же ветку.
Советы
- Значения счётчиков для всех элементов на странице запрашиваются одним запросом, поэтому добавление блока к каждому элементу в длинном списке не создаёт дополнительных сетевых обращений.
- Один блок Счётчик комментариев на статью или товар в списке — ожидаемый сценарий использования; блок можно добавить столько раз, сколько необходимо.
Добавить ленту последних комментариев
Блок FastComments - Recent Comments показывает самые последние комментарии со всего вашего магазина. Используйте его, чтобы отображать свежую активность в боковой панели, подвале или на главной странице.
Добавление блока
- Откройте редактор темы Shopify.
- Откройте шаблон, в который хотите добавить ленту. Хорошо подойдут боковая секция, главная страница или индекс блога.
- Нажмите Add block в секции, где он должен находиться.
- В разделе Apps выберите FastComments - Recent Comments.
- Нажмите Save.
Настройки
| Настройка | Что делает | По умолчанию |
|---|---|---|
| Tenant ID (необязательно) | Переопределяет, из какого тенанта FastComments лента читает комментарии. Оставьте пустым, чтобы использовать автоматически настроенный тенант магазина. | (пусто) |
| Number of comments | Сколько последних комментариев показывать. Диапазон от 1 до 50. | 5 |
Советы
- Каждый комментарий ссылается на страницу, где он был оставлен, поэтому блок также служит подсказкой «о чём сейчас говорят» для навигации.
- Лента действует на весь магазин. Чтобы показать последние комментарии для отдельной страницы, используйте вместо этого блок FastComments на этой странице.
Добавить ленту последних обсуждений
Блок FastComments - Recent Discussions выводит список страниц вашего магазина с самой недавней активностью комментариев — по одной записи на страницу. Используйте его, когда хотите, чтобы посетители находили активные обсуждения, а не отдельные комментарии.
Добавление блока
- Откройте редактор темы Shopify.
- Откройте шаблон, в который вы хотите добавить ленту — например, боковую панель, подвал, индекс блога или секцию главной страницы.
- Нажмите Add block в секции, которая должна его содержать.
- В разделе Apps выберите FastComments - Recent Discussions.
- Нажмите Save.
Настройки
| Настройка | Что делает | По умолчанию |
|---|---|---|
| Tenant ID (необязательно) | Переопределяет, из какого тенанта FastComments лента читает данные. Оставьте пустым, чтобы использовать автоматически настроенный тенант магазина. | (пусто) |
| Number of comments | Сколько недавних обсуждений показывать. Диапазон от 1 до 50. | 20 |
Recent Discussions и Recent Comments
Оба блока используют одни и те же данные, но показывают их по-разному:
- Recent Comments: плоский список последних отдельных комментариев. Лучше всего подходит для «что только что сказали».
- Recent Discussions: одна запись на страницу, упорядоченная по последней активности. Лучше всего подходит для «какие обсуждения активны прямо сейчас».
Можно использовать оба блока в одном магазине. Например, Recent Comments в боковой панели блога, а Recent Discussions на главной странице.
Добавить список топ-страниц
Блок FastComments - Top Pages отображает страницы вашего магазина с наибольшей общей активностью комментариев. Используйте его, чтобы выделить ваши самые обсуждаемые записи или товары.
Добавить блок
- Откройте редактор темы Shopify.
- Откройте шаблон, в котором вы хотите разместить список, например боковая панель, футер или секцию индекса блога.
- Нажмите Добавить блок в секции, которая должна его содержать.
- В разделе Приложения выберите FastComments - Top Pages.
- Нажмите Сохранить.
Настройки
| Параметр | Что делает | По умолчанию |
|---|---|---|
| Tenant ID (optional) | Переопределяет, из какого FastComments tenant будет считываться список. Оставьте пустым, чтобы использовать автоматически настроенный для магазина tenant. | (пусто) |
Top Pages vs Recent Discussions
- Top Pages ранжирует по общему вовлечению, поэтому одни и те же записи обычно остаются вверху некоторое время. Подходит для боковой панели «популярные записи».
- Recent Discussions ранжирует по самой недавней активности, поэтому список часто обновляется. Подходит для панели «что сейчас в тренде».
Добавить сводку отзывов
The FastComments - Сводка отзывов блок показывает агрегированный рейтинг в звездах и разбивку отзывов по странице. Сочетайте его с блоком FastComments в шаблонах товаров для стандартного макета отзывов: сводка вверху, форма отзыва и сами отзывы — ниже.
Предварительное условие: настройте Ratings & Reviews
Блок Сводка отзывов отображает вопросы рейтинга, которые вы настроили для вашего магазина. Настройте их в первую очередь:
- Откройте приложение FastComments в админке Shopify.
- Нажмите плитку Ratings & Reviews Helper (или откройте Ratings & Reviews Helper напрямую).
- Добавьте вопросы, на которые должен ответить каждый рецензент (общая оценка в звездах, «как подошёл размер», и т.д.).
Без настроенных вопросов блоку сводки нечего агрегировать.
Добавление блока
- Откройте редактор темы Shopify.
- Откройте шаблон Product (или шаблон страницы, где вы хотите разместить сводку).
- Нажмите Add block в верхней части секции страницы, выше места, где будет блок FastComments.
- В разделе Apps выберите FastComments - Reviews Summary.
- Добавьте блок FastComments ниже на той же странице, если вы ещё этого не сделали, чтобы посетители могли оставлять отзывы.
- Нажмите Save.
Настройки
| Setting | What it does | Default |
|---|---|---|
| Tenant ID (optional) | Переопределяет tenant FastComments, из которого читается сводка. Оставьте пустым, чтобы использовать автоматически настроенный tenant магазина. | (пусто) |
| Custom URL ID | Переопределяет идентификатор страницы, по которому агрегируется сводка. Используйте это, когда сводка находится на другой странице, чем блок FastComments, который она отражает. | (автообнаруживается) |
Как сводка соотносится с отзывами
Блок Сводка отзывов использует ту же логику автообнаружения, что и блок FastComments:
- Product template:
shopify-product-{product.id} - Blog post template:
shopify-article-{article.id} - Other templates: путь запроса
Для обычной страницы товара сводка и цепочка комментариев автоматически имеют один и тот же URL ID, без необходимости дополнительной настройки.
Советы
- Сводка только для чтения. Чтобы собирать отзывы, на той же странице должен быть блок FastComments.
- Если вы измените вопросы рейтинга в Ratings & Reviews Helper после сбора отзывов, сводка пересчитает данные в соответствии с новым набором вопросов.
Автоматический вход для клиентов Shopify
The FastComments block поддерживает единый вход (SSO), поэтому ваши покупатели Shopify могут комментировать от своего имени без создания отдельной учетной записи FastComments.
Как это работает
Когда посетитель, вошедший в ваш магазин, открывает страницу с блоком FastComments:
- Блок обнаруживает объект Shopify
customer. - Он отправляет имя и адрес электронной почты клиента в FastComments через подписанный запрос прокси-приложения.
- FastComments создаёт или сопоставляет пользователя с ключом
shopify-{customerId}, поэтому один и тот же покупатель всегда сопоставляется с тем же пользователем FastComments между сессиями и при повторной установке. - Имя посетителя отображается в их комментариях. Им не предлагается входить в систему снова.
Если посетитель не вошёл в магазин, блок переходит к анонимному комментированию (или к процедуре входа FastComments, в зависимости от конфигурации виджета).
Отключение SSO
SSO включён по умолчанию для каждого блока FastComments. Чтобы отключить его для конкретного блока:
- Откройте редактор темы Shopify.
- Откройте шаблон, который содержит блок, и щёлкните по блоку, чтобы выбрать его.
- Снимите флажок SSO.
- Нажмите Сохранить.
Отключите SSO, если вы хотите, чтобы комментаторы могли выбрать отдельную личность для обсуждения. Например, внутренняя страница сообщества, где сотрудники комментируют под другим отображаемым именем.
Что получает FastComments
Отправляемый для каждого клиента SSO-пэйлоад содержит:
- Идентификатор пользователя, полученный из ID клиента Shopify (
shopify-{customerId}). - Электронную почту клиента (используется для идентификации пользователя; не отображается публично).
- Отображаемое имя клиента (используется как имя автора комментария).
Не отправляются данные о заказах, оплате или адресах. Пэйлоад подписывается на стороне сервера; браузер клиента никогда не видит учётных данных.
Ссылки входа и выхода
Когда SSO включён, ссылки виджета комментариев для входа и выхода указывают на /account/login и /account/logout — стандартные маршруты аккаунта клиента Shopify. Ничего дополнительно настраивать не нужно. Ссылки работают для любого магазина с включёнными учетными записями клиентов.
Импортировать существующие комментарии
Если у вас уже есть комментарии в записях блога Shopify и вы хотите их сохранить, импортируйте их в FastComments до того, как отключите встроенную систему комментариев Shopify.
Импорт должен выполняться, пока встроенные комментарии Shopify всё ещё активны и видимы. После их отключения FastComments больше не сможет их прочитать.
Как начать импорт
- Убедитесь, что приложение FastComments установлено в вашем магазине.
- Пока оставьте встроенные комментарии Shopify включёнными.
- Откройте тикет в службу поддержки и укажите, какие блоги нужно импортировать.
Импорт выполняется менее чем за день.
После того как существующие комментарии будут импортированы в FastComments, добавьте блок FastComments в шаблон записи блога и удалите или отключите встроенные комментарии Shopify. Смотрите Добавление комментариев к записям блога и товарам.
Если вам не нужно сохранять существующие комментарии, вы можете пропустить эту страницу.
Настройка
Цвета, шрифты, правила модерации, разрешённый HTML и анонимное комментирование — всё это можно настроить в соответствии с фирменным стилем вашего магазина.
Откройте приложение FastComments в админке Shopify и нажмите плитку Customize, чтобы открыть экран настройки виджета. Для входа используется одноразовая ссылка, поэтому отдельная авторизация не требуется.
Для полного списка опций настройки см. Руководство по настройке и конфигурации.
Ошибки домена
Если вы установили FastComments из Shopify App Store, домен вашего магазина автоматически добавляется в список авторизованных доменов арендатора, и ошибка домена не должна появляться. Эта страница применима, если вы прошли путь ручной установки, или если ваша витрина обслуживается на пользовательском домене, который не был зарегистрирован в Shopify на момент установки приложения.
Вы можете получить ошибку авторизации, которая выглядит так:
Это означает, что FastComments не распознаёт домен, на котором загружается виджет, как авторизованный для вашего арендатора.
Чтобы исправить это, добавьте домен в вашу учётную запись FastComments: Настроить домены.
Ручная установка (расширенная)
Если вы не можете установить приложение из Shopify App Store, вы всё равно можете добавить FastComments, отредактировав свою тему. Этот способ полезен, когда вы хотите подключить уже принадлежащий вам тенант FastComments или когда вы встраиваете комментарии на витрину Shopify, где использование приложения невозможно.
Установка через приложение — это поддерживаемый способ для большинства магазинов. Используйте этот способ только в том случае, если приложение вам не подходит.
Шаг 1: Отключите встроенные комментарии Shopify
В админ-панели Shopify перейдите в Blog posts > Manage blogs, откройте каждый блог и в правой панели выберите Comments are disabled. Сохраните.
Это предотвратит отображение встроенных комментариев Shopify вместе с FastComments.
Шаг 2: Откройте шаблон темы блога
В админ-панели Shopify:
- Перейдите в Online Store > Themes.
- Под текущей темой нажмите Actions > Edit code.
- В файловом браузере слева откройте Sections и нажмите
main-article.liquid.
Это шаблон, который Shopify использует для отображения отдельной статьи блога.
Шаг 3: Вставьте сниппет FastComments
Прокрутите примерно до 100-й строки файла main-article.liquid, сразу после закрывающего </div> тела статьи. Вставьте следующий сниппет:
Замените "demo" на ваш собственный Tenant ID со страницы fastcomments.com/auth/my-account/api-secret. Нажмите Save.
Шаг 4: Авторизуйте домен вашего магазина
Откройте запись в блоге на вашем рабочем магазине. Если вместо виджета комментариев вы видите ошибку авторизации, FastComments должен знать, что вашему магазину разрешено использовать этот тенант. См. Ошибки домена.
Добавление FastComments на другие страницы
Тот же сниппет работает на любом шаблоне Liquid, включая страницы товаров, пользовательские страницы и главную страницу. Вставьте его там, где вы хотите видеть комментарии, и при необходимости измените urlId, чтобы получить стабильный идентификатор для каждой страницы (например, urlId: "{{ product.id }}" в шаблоне товара).
Добавить опросы в ваш магазин Shopify
Как только FastComments будет установлен в вашем магазине Shopify, вы также сможете проводить живые опросы прямо в комментариях. Включите Enable Polls в настройках настройки виджета, и кнопка опроса появится на панели инструментов комментариев. Опросы поддерживают от 2 до 10 вариантов, результаты обновляются в реальном времени для всех на странице, и вы выбираете, кто может создавать опросы и требуется ли вход в систему для голосования. Больше ничего устанавливать в Shopify не нужно.
Попробовать демо живых опросов или прочитать Документацию по опросам, чтобы настроить их.