Ich beschäftige mich seit einigen Wochen mit meiner Homepage und probiere aus, wie man ein Flat File CMS für ein Blog nutzen kann.
Dabei bin ich immer wieder auf Unzulänglichkeiten der Systeme gestoßen. So bietet z.B. Bludit zwar einige Plugins für eine Kommentarfunktion an, aber ich habe keins der Plugins zum Laufen bekommen. Entweder wurde der Kommentarbereich nicht angezeigt, oder die Webseite wurde nicht mehr geladen. Ähnliches gilt übrigens für die Plugins von Grav. Hier wurden nur die Kommentarbereiche unter den Blogposts einfach nicht angezeigt. Und selbst wenn man dies hinbekommen hat, wurden die Kommentare nicht im Admin-Bereich angezeigt.
Alles ziemlich unbefriedigend.
Nach einigem Suchen, habe ich nun aber eine für mich sinnige Lösung gefunden.
utterances bietet eine Möglichkeit, die Funktion der GitHub issues als Kommentarfunktion in Blog einzubinden.
Da ich aktuell Grav nutze, möchte ich euch kurz erklären, wie man utterances schnell und unkompliziert dafür nutzen kann.
GitHub vorbereiten
Wenn ihr schon einen Account bei GitHub habt, dann legt ihr einfach ein neues Repository an und schaltet dieses auf "Public" und aktiviert in den Settings das "Issue" Feature.
Über utterances installiert ihr im gerade angelegten GitHub Repository die App "utterances".
Im gerade angelegten Repository unter "Settings" wechselt ihr links in "GitHub Apps" und klickt rechts bei "utterances" auf "Configure".
Nun landet ihr auf der Website von utterances. Dort tragt ihr im Bereich "configuration" das eben angelegte Repository im Format "owner/repo" ein. Enter o.ä. ist hinterher nicht notwendig.
Im Bereich "Blog Post Issue Mapping" könnt ihr einstellen, wie die Issues in GitHub aussehen betitelt werden sollen, wenn Kommentare erstellt werden.
Den Bereich "Issue Label" könnt ihr ignorieren.
Im Bereich "Theme" könnt ihr das Design des Kommentarfeldes im Blog festlegen.
Nun wird im Bereich "Enable Utterances" das zu nutzende Script angezeigt, welches im Nachgang im Blog hinterlegt werden muss. Das sieht dann, ohne konfiguriertes Repo, so aus:
<script src="https://utteranc.es/client.js"
repo="[ENTER REPO HERE]"
issue-term="pathname"
theme="github-light"
crossorigin="anonymous"
async>
</script>utterances Script einbinden
Dieses Script muss in Grav nun in den für das Blog zuständige Quelldateien hinterlegt werden. Das ist aber recht einfach, wenn man erst mal die Dateistruktur von Grav verstanden hat.
In der Regel sollte die anzupassende Datei unter USER/THEMES/Themename/TEMPLATES/ liegen und heißt item.html.twig.
Dort führt ihr unterhalb des eigentlichen Quelltextes den eben erzeugten Script-Block ein. Sollte dann hinterher ungefähr so aussehen:
{% embed 'partials/base.html.twig' %}
{% block content %}
{% if config.plugins.breadcrumbs.enabled %}
{% include 'partials/breadcrumbs.html.twig' %}
{% endif %}
<div class="blog-content-item grid pure-g-r">
<div id="item" class="block pure-u-2-3">
{% include 'partials/blog_item.html.twig' with {'blog':page.parent, 'truncate':false} %}
</div>
<div id="sidebar" class="block size-1-3 pure-u-1-3">
{% include 'partials/sidebar.html.twig' with {'blog':page.parent}%}
{{dump(page.parent)}}
</div>
</div>
<script src="https://utteranc.es/client.js"
repo="[ENTER REPO HERE]"
issue-term="pathname"
theme="github-light"
crossorigin="anonymous"
async>
</script>
{% endblock %}
{% endembed %}Nach dem Speichern wird euch nun in eurem Blog unter jedem Beitrag ein Kommentarfeld angezeigt. Auf Grund der notwendigen Anmeldung bei GitHub um Kommentare zu schreiben, haltet ihr auch gleich noch Spam in Grenzen.
Alles in allem eine gute und einfache Lösung ein Kommentarsystem zu implementieren.
Wenn ihr kein Grav nutzt, dann müsst ihr in der Doku des jeweils genutzten Systems schauen, wo genau ihr das Script einpflegen müsst. Das sollte bei jedem gut dokumentierten CMS schnell rauszufinden zu sein.