Никогда не понимал зачем этому сайту комментарии: всё опубликованное — большой технический дневник, который будто бы не нуждается в обратной связи. А те читатели у которых всё-таки возникают вопросы, легко находят мои контакты.
Но недавно я наткнулся на целый корпус комментариев к моему старому сайту и разрыдался. Интернет-магазин, который непродолжительное время работал почти 15 лет назад и где я продавал свои железки, каменты очень сильно оживляли.
А раз так, то давайте попробуем снова.
Из чего это можно сделать в 2024
Напоминаю, у нас на руках полностью статичный сайт без базы данных, который сгенерировал Jekyll. Почти любая система комментирования выглядит здесь неуместным оверкиллом.
Чарли объясняет как можно хранить комментарии внутри компилируемого .txt на бесплатном инстансе AWS Lambda. В зависимостях только Rust и Go.
Не скрою: я уже поверхностно анализировал возможность добавить на сайт каменты ещё где-то в 2018 году. Инструментарий с тех пор почти не изменился. Существующие решения, условно можно разделить на 4 категории:
- Генерация каментов в статику. Они хранятся прямо в репозитории в виде JSON или отдельных .md и рендерятся Джекиллом. Хороший пример Staticman. Очевидный минус: нужно пересобирать и деплоить сайт каждый раз когда кто-то оставит камент.
- Готовые проприетарные системы типа DISQUS. Embed со стороннего сайта со всеми необходимыми фичами. Очень легко интегрировать и поддерживать. К сожалению все такие системы либо показывают рекламу, либо тянут трекеры, либо продают пользовательские данные. DISQUS имеет все вышеперечисленные недостатки враз не смотря на то, что был неплохим сервисом в конце нулевых.
- Готовые открытые системы getting started которых начинается с фраз типа «Установите PHP и MongoDB…». Поддерживать такие штуки я не готов.
- Самописные велосипеды где в качестве базы данных используется условный Google Spreadsheet, а основной код это
.jsна 40 строк. Тут совсем нет фич: антиспама, уведомлений, ответов и пр. Это всё даже не прототипы, а просто proof of concept. Ну вот, например.
Однако, в этот раз я нашёл что-то новенькое.
Теперь везде могу писать «Если знаете какие-то ещё интересные решения — напишите в каменты», лол.
Giscus
1 Проект в значительной степени копирует другой похожий продукт: Utterances, который хранит каменты внутри GitHub Issues.
Giscus — это система комментирования, которая использует GitHub Discussions для хранения каментов, а рендерит их под постами через embed1.
Проект полностью открытый. На столько, что вы можете хостить его самостоятельно. Нет трекеров, тормозов, рекламы. Ещё:
- Привычный интерфейс Гитхаба для комментариев со всеми фичами типа реакций, ответов, маркдауна, вставки картинок и пр.
- Лёгкая интеграция.
- Благодаря тому, что это часть Дискуссий будут работать имеил уведомления, модерация и менеджмент.
При этом необходимость иметь учётку на Гитхабе чтобы оставить камент я записываю в плюсы — для интернет-срачей лучше иметь хоть какой-то порог входа.
Из минусов я пока увидел только необходимость для коментаторов разрешать боту Giscus оставлять комментарии в Дискуссии от их имени.
Добавляем Giscus в Jekyll
Сначала нужно создать открытый репозиторий на GitHub, разрешить в его настройках Дискуссии и дать к нему доступ GitHub-приложению Giscus.
В _config.yml своего сайта я добавил такой ключ:
giscus: true
Он нужен, чтобы каменты можно было включать и отключать глобально для всего сайта. Например, вам они вряд ли понадобятся когда вы будете предпросматривать сайт локально во время написания контента.
Ещё я добавил файл comments.html в папку _includes с примерно таким содержанием:
{% if site.giscus == true %}
<script src="https://giscus.app/client.js"
data-repo="Atarity/snnkvcom-discussions"
data-repo-id="R_kgngHUIGZw"
data-category="General"
data-category-id="DIC_kw4HU6ghe84ChYA6"
data-mapping="og:title"
data-strict="1"
data-reactions-enabled="0"
data-emit-metadata="0"
data-input-position="bottom"
data-theme="light"
data-lang="ru"
data-loading="lazy"
crossorigin="anonymous"
async>
</script>
{% endif %}
Сгенерировать такой блок с настройками можно на главной странице giscuss.app.
Дальше я просто добавляю liquid тэг {% include comments.html %} в любом месте .md файлов с контентом, где хочу видеть каменты. Как только кто-то оставит первый комментарий к заметке, в Дискуссиях на GitHub появится новый топик со ссылкой на страницу и всеми каментами к ней.
Обязательно прочитайте о расширенных настройках. Это поможет ограничить список доменов где ваши каменты будут открываться. Для этого понадобится закоммитить файл giscus.json в репозиторий с Дискуссиями.
Я потратил пару часов на вёрстку потому что не сразу понял в каком месте страницы лучше всего рендерить блок с комментариями, но на деле всё заработало с полпинка. Как обычно: какое-то время понаблюдаю за тем, сколько проблем такая система будет доставлять. Сейчас кажется, что даже уехать с неё будет не сложно.
⚠️ Каменты в режиме эксперимента. Нужна регистрация на GitHub и необходимо дать разрешение боту Giscus. Если это неприемлемо, можно комментировать прямо на GitHub.