@giscusgiscus

giscus

Система комментариев на основе GitHub Discussions.
Позволяет посетителям оставлять свои реакции и комментарии на сайте с помощью GitHub! Разработка была сильно вдохновлена системой комментариев utterances.

Note:
giscus находится в фазе активной разработки. GitHub так же активно развивает Discussions и его API. Поэтому некоторые возможности giscus могут ломаться или меняться со временем.

Принцип работы

После загрузки giscus GitHub Discussions search API используется для поиска обсуждений, связанных с текущей страницей на основе выбранного типа связи (URL, pathname, <title> и прочее).
Если обсуждение не было найдено, то бот giscus автоматически создаст новое обсуждение, как только кто-нибудь впервые оставит комментарий или реакцию.

Чтобы добавить новый комментарий пользователи должны авторизовать giscus app для опубликования комментариев от их имени с помощью GitHub OAuth.
Кроме того, посетители могут оставлять комментарии напрямую в GitHub Discussion. Вы можете модерировать эти комментарии через GitHub.

Конфигурация

Язык

Выберите язык интерфейса. Не нашли нужный? Добавьте свою локализацию.

Репозиторий

Выберите репозиторий для подключения giscus. Требования к репозиторию:

  1. Репозиторий является общедоступным, иначе посетители не смогут видеть обсуждение.
  2. Приложение giscus установлено, иначе посетители не смогут оставлять реакции и комментарии.
  3. Опция Discussions включена в настройках репозитория.

Общедоступный GitHub репозиторий, куда будут подключены обсуждения.

Страница сайта ↔️ Обсуждения

Выберите тип связи между страницей сайта и обсуждениями.

giscus загрузит обсуждение, где название содержит путь страницы из URL.

giscus загрузит обсуждение, где название содержит URL страницы.

giscus загрузит обсуждение, где название содержит <title> HTML тэг страницы.

giscus загрузит обсуждение, где название содержит <meta property="og:title"> HTML тэг страницы.

giscus загрузит обсуждение, где название содержит определенное слово.

giscus загрузит обсуждение по его номеру. Эта опция не поддерживает автоматическое создание обсуждений.

Избегайте несоответствий из-за метода нечеткого поиска GitHub, когда есть несколько обсуждений с похожими заголовками. Подробности указаны в документации.

Категории обсуждений

Выберите категорию, где будут создаваться новые обсуждения. Рекомендуется использовать категорию Announcements, там новые обсуждения могут быть созданы только модераторами и самим giscus.

При поиске подходящего обсуждения giscus будет искать только в указанной категории.

Опции

Выберите, какие опции должны быть включены.

Отображать реакции к главному сообщению вверху комментариев.

Периодически посылать метаданные обсуждения в родительский объект (страница сайта). Для демонстрации включите эту опцию и откройте консоль браузера на странице сайта. Подробности указаны в документации.

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

Загрузка комментариев будет отложена до тех пор, пока пользователь не прокрутит страницу до контейнера комментариев. Это делается путем добавления loading="lazy" к элементу <iframe>.

Тема оформления

Выберите тему оформления, соответствующую вашему сайту. Не можете выбрать нужную? Создайте новую тему.

Включить giscus

Добавьте тэг <script> в шаблон вашего сайта, где бы вы хотели видеть комментарии. Если существует элемент с классом giscus, то комментарии будут размещены вместо него.

Вы не настроили свой репозиторий и/или категорию. Значения этих полей не будут отображаться, пока вы их не заполните.
<script src="https://giscus.app/client.js"
        data-repo="[ВВЕДИТЕ REPO]"
        data-repo-id="[ВВЕДИТЕ REPO ID]"
        data-category="[ВВЕДИТЕ CATEGORY NAME]"
        data-category-id="[ВВЕДИТЕ CATEGORY ID]"
        data-mapping="pathname"
        data-strict="0"
        data-reactions-enabled="1"
        data-emit-metadata="0"
        data-input-position="bottom"
        data-theme="preferred_color_scheme"
        data-lang="ru"
        crossorigin="anonymous"
        async>
</script>

Вы можете настроить расположение контейнера с помощью .giscus и .giscus-frame селекторов на странице сайта.

Если вы используете giscus, пожалуйста, поставьте 🌟 giscus на GitHub и добавьте giscus тэг в ваш репозиторий! 🎉

Расширенные настройки

В giscus доступны расширенные настройки, например, фильтрация по window.origin.

Для использования giscus с React, Vue, или Svelte обратитесь к библиотеке компонентов giscus.

Миграция

Если вы ранее использовали другие системы, использующие GitHub Issues (например, utterances, gitalk), вы можете сконвертировать запросы в обсуждения.
После конвертации убедитесь в соответствии между названиями обсуждений и страницами сайта, тогда giscus автоматически найдет и отобразит эти обсуждения.

Сайты, использующие giscus

Сотрудничество

Подробности: CONTRIBUTING.md

Попробовать 👇👇👇

Powered by Vercel