<?xml version="1.0" encoding="utf-8" standalone="yes"?><rss version="2.0" xmlns:atom="http://www.w3.org/2005/Atom" xmlns:content="http://purl.org/rss/1.0/modules/content/"><channel><title>Fediverse on Natenoms Blog</title><link>https://natenom.de/tags/fediverse/</link><description>Recent content in Fediverse on Natenoms Blog</description><generator>Hugo -- gohugo.io</generator><language>de</language><copyright/><lastBuildDate>Mon, 30 Oct 2023 10:45:01 +0100</lastBuildDate><atom:link href="https://natenom.de/tags/fediverse/index.xml" rel="self" type="application/rss+xml"/><item><title>Anpassungen für "rausgeschafft"</title><link>https://natenom.de/2023/10/anpassungen-fuer-rausgeschafft/</link><pubDate>Mon, 30 Oct 2023 10:45:01 +0100</pubDate><guid>https://natenom.de/2023/10/anpassungen-fuer-rausgeschafft/</guid><description><![CDATA[<p>Erst vor kurzem hatte ich hier die schöne Idee bezüglich des Accounts &ldquo;<a  href="/2023/10/ein-schoener-versuch-mit-pixelfed-rausgeschafft/">rausgeschafft</a>&rdquo; vorgestellt. Und nun ändere ich das auch schon wieder, weil es so für mich nicht gut funktioniert hat.</p>]]></description><content:encoded><![CDATA[<p>Erst vor kurzem hatte ich hier die schöne Idee bezüglich des Accounts &ldquo;<a  href="/2023/10/ein-schoener-versuch-mit-pixelfed-rausgeschafft/">rausgeschafft</a>&rdquo; vorgestellt. Und nun ändere ich das auch schon wieder, weil es so für mich nicht gut funktioniert hat.</p>
<h2 id="keine-gute-app-für-pixelfed" data-numberify>Keine gute App für Pixelfed<a class="anchor ms-1" href="#keine-gute-app-für-pixelfed"></a></h2>
<p>Das Hauptproblem für mich ist das Fehlen einer guten App. Da gibt es zum einen die offizielle Android App für Pixelfed. An die kann man jedoch keine Bilder teilen. So muss ich ein Foto erst einmal an eine App teilen, die die Metadaten entfernt und dann speichern lassen. Dann starte ich die Pixelfed App und wähle das lokale Foto aus. Hinzu kommt, dass die App sich nicht anfühlt wie eine App, sondern eher wie eine einfache Website, denn um neue Dinge anzuzeigen, muss man sie schließen und neu öffnen. So kann man auch nicht verfolgen, ob jemand etwas kommentiert hat usw.</p>
<p>Es gibt aber auch die Möglichkeit, einen Pixelfed-Account mit Fedilab zu nutzen, doch das ist leider noch fehlerhaft. So werden fast alle Beiträge eines Pixelfed-Accounts in Fedilab angepinnt angezeigt. Und das Hochladen von Fotos funktioniert nicht zuverlässig.</p>
<p>Dabei ist mein Wunsch: Foto machen, mit App teilen, die die Metadaten entfernt und weiterteilen mit einer App, die das Foto auf dem Pixelfed-Account veröffentlicht. Fertig. Das geht aktuell leider nicht.</p>

<h2 id="pause-auf-pixelfed-weiter-auf-mastodon" data-numberify>Pause auf Pixelfed, weiter auf Mastodon<a class="anchor ms-1" href="#pause-auf-pixelfed-weiter-auf-mastodon"></a></h2>
<p>Deshalb habe werde ich den Pixelfed-Account erstmal wieder stilllegen und die Idee von &ldquo;rausgeschafft&rdquo; mit dem Mastodon-Account vom kleinen 🐘 Kagube (<a  class='urlextern'  href="https://plushies.social/@ploggifanti">https://plushies.social/@ploggifanti</a>) weiterführen und dann einfach nur das passende Hashtag verwenden. Vorteil: So können auch andere Menschen das Hashtag nutzen, um zu zeigen, dass sie es raus geschafft haben, wenn dies für sie nicht selbstverständlich ist, <a  href="#a_mitmachen">siehe unten</a>.</p>
<p>Wieso nicht auf meinem Mastodon-Account? Weil dort nach 2 Wochen alles automatisch gelöscht wird, solange es nicht angepinnt ist. Beim kleinen 🐘 gibts keine automatische Löschung. Und ich kann das dann mit meinem Account boosten.</p>
<p>Ich habe deshalb auf dem Pixelfed-Account &ldquo;rausgeschafft&rdquo; hinterlegt, dass dieser erst einmal stillgelegt ist und diesen Blogbeitrag hier verlinkt.</p>
 <figure class="image-caption"><a href="2023-10-30-rausgeschafft-pausiert-cover.webp"><picture>
                <source type="image/webp" srcset="/2023/10/anpassungen-fuer-rausgeschafft/2023-10-30-rausgeschafft-pausiert-cover_hu20164f87a067ba5f59919db5764e5901_124200_360x0_resize_q95_h2_catmullrom_2.webp 360w,/2023/10/anpassungen-fuer-rausgeschafft/2023-10-30-rausgeschafft-pausiert-cover_hu20164f87a067ba5f59919db5764e5901_124200_500x0_resize_q95_h2_catmullrom_2.webp 500w,/2023/10/anpassungen-fuer-rausgeschafft/2023-10-30-rausgeschafft-pausiert-cover_hu20164f87a067ba5f59919db5764e5901_124200_816x0_resize_q95_h2_catmullrom_2.webp 816w"
                                          sizes="(max-width: 424px) 360px, (max-width: 596px) 500px, (min-width: 565px) 816px" />
                <img alt="" srcset="/2023/10/anpassungen-fuer-rausgeschafft/2023-10-30-rausgeschafft-pausiert-cover_hu20164f87a067ba5f59919db5764e5901_124200_360x0_resize_q95_h2_catmullrom_2.webp 360w, /2023/10/anpassungen-fuer-rausgeschafft/2023-10-30-rausgeschafft-pausiert-cover_hu20164f87a067ba5f59919db5764e5901_124200_500x0_resize_q95_h2_catmullrom_2.webp 500w, /2023/10/anpassungen-fuer-rausgeschafft/2023-10-30-rausgeschafft-pausiert-cover_hu20164f87a067ba5f59919db5764e5901_124200_816x0_resize_q95_h2_catmullrom_2.webp 816w"
                     sizes="(max-width: 424px) 360px, (max-width: 596px) 500px, (min-width: 565px) 816px"
                     src="/2023/10/anpassungen-fuer-rausgeschafft/2023-10-30-rausgeschafft-pausiert-cover_hu20164f87a067ba5f59919db5764e5901_124200_816x0_resize_q95_h2_catmullrom_2.webp" title="" loading="lazy" width="816" height="806" /></picture></a></figure>

<h2 id="aber-pixelfed-ist-doch-speziell-für-fotos" data-numberify>Aber Pixelfed ist doch speziell für Fotos?<a class="anchor ms-1" href="#aber-pixelfed-ist-doch-speziell-für-fotos"></a></h2>
<p>Ja, aber die Eigenheiten, die es bei Pixelfed gibt und bei Mastodon nicht, die habe ich bisher noch kein einziges Mal gebraucht. Daher reicht mir dafür auch erst einmal Mastodon aus.</p>
<p>Wenn eine der verwendeten Apps besser geworden ist, was ich ab und zu mal testen werde, dann gehts vielleicht wieder zurück zu Pixelfed.</p>

<h2 id="a_mitmachen" data-numberify>Mitmachen bei &ldquo;rausgeschafft&rdquo;<a class="anchor ms-1" href="#a_mitmachen"></a></h2>
<p>Wenn du auch Schwierigkeiten hast, dass du es nicht immer raus schaffst, wenn du es gerade willst/musst/kannst, dann kannst du auch ein schönes Foto posten, wenn es dann doch geklappt hat. Das Hashtag dafür ist <code>#rausgeschafft</code>. Beliebige weitere Hashtags sind natürlich möglich.</p>]]></content:encoded><enclosure url="https://natenom.de/2023/10/anpassungen-fuer-rausgeschafft/2023-10-30-rausgeschafft-pausiert-cover.webp" length="124200" type="image/webp"/></item><item><title>Social Media – welche Netzwerke ich weiterhin bespiele, welche nicht und weshalb</title><link>https://natenom.de/2023/10/social-media-welche-netzwerke-ich-weiterhin-bespiele-welche-nicht-und-weshalb/</link><pubDate>Mon, 23 Oct 2023 15:25:06 +0200</pubDate><guid>https://natenom.de/2023/10/social-media-welche-netzwerke-ich-weiterhin-bespiele-welche-nicht-und-weshalb/</guid><description>&lt;p>Social Media hier, Social Media da, ein kaputtes altes Netzwerk, ein neues (kaputtes) und ein bestehendes kuscheliges. Ein kleiner Überblick über den Ist-Zustand aus meiner Sicht zu BlueSky, Twitter und Mastodon und was für mich daraus folgt.&lt;/p></description><content:encoded><![CDATA[<p>Social Media hier, Social Media da, ein kaputtes altes Netzwerk, ein neues (kaputtes) und ein bestehendes kuscheliges. Ein kleiner Überblick über den Ist-Zustand aus meiner Sicht zu BlueSky, Twitter und Mastodon und was für mich daraus folgt.</p>
<h2 id="twitter" data-numberify>Twitter<a class="anchor ms-1" href="#twitter"></a></h2>
<p>Twitter hatte ich seit langem schon nur noch gelegentlich genutzt. Und wenn, dann hatte ich schon nach kurzer Zeit fast alle Tweets wieder gelöscht. Positive Interaktion hat schon vor Monaten deutlich abgenommen (im Gegensatz zu mir 🤪). Und ich verlinke meinen <a  href="/2023/01/aenderungen-an-meinen-websites/#kein-twitter-mehr">Twitter-Account schon seit Januar 2023 nicht mehr</a> auf meinen Websites.</p>
<p>Trotzdem sind auf Twitter immer noch Menschen, die meisten aus der Fahrradbubble, mit denen ich gerne kommuniziere. Viele von denen wandern derzeit (soweit möglich, da nur via Einladung möglich) nach BlueSky ab, weil es so wie Twitter funktioniert und Mastodon denen nicht zusagt aus Gründen, die ich teilweise nachvollziehen kann (<a  href="#a_mastodon">siehe unten</a>).</p>
<p>Wenn ich in der letzten Zeit etwas bei Twitter schrieb, gibt es nur noch sehr wenig Interaktionen, teilweise reagierten sofort irgendwelche offensichtlichen Bots. Und die Menge an Anfeindungen hat meiner Ansicht nach auch zugenommen.</p>

<h2 id="a_mastodon" data-numberify>Mastodon<a class="anchor ms-1" href="#a_mastodon"></a></h2>
<p>Mastodon benutze ich schon sehr lange. Mein aktueller Account bei <a  class='urlextern'  href="https://social.anoxinon.de">anoxinon.de</a> ist zwar erst von 2020, aber vorher hatte ich schon diverse andere, dann umgezogene Accounts bei anderen Anbietern. Und seit dem großen &ldquo;Umzug&rdquo; von Leuten von Twitter nach Mastodon letztes Jahr ist dort auch wirklich viel los und es ist meist angenehme Kommunikation. Das verändert sich aber gerade etwas, weil auch Menschen so langsam ihren Weg dorthin finden, die nicht an einer freundlichen Kommunikation interessiert sind.</p>
<p>Im Fediverse findet die meiste Interaktion statt, die ich auf Social Media überhaupt habe.</p>
<p>Ein großer Nachteil meiner Ansicht nach besteht bei Mastodon darin, dass ich immer nur das mitbekomme, was in diesem Moment gerade los ist. Wenn ich also nur einmal abends kurz schaue, sehe ich nur, was gerade jetzt los ist, und nicht, was heute morgen los war und für mich interessant sein könnte.</p>
<p>Ich muss sich selbst darum kümmern, interessanten Accounts und Hashtags zu folgen. Wenn das aber zu viele Accounts und Hashtags sind, geht das Interessante trotzdem unter. Fediverse und Mastodon empfinde ich dadurch eher als Plattform für &ldquo;Poweruser&rdquo;, die das oft nebenher zugänglich haben.</p>
<p>Diesbezüglich (und nur diesbezüglich) gefallen mir die anderen beiden &ldquo;Netzwerke&rdquo; besser, denn dort bekomme ich vom Computer all das zugeworfen, das mich interessiert, auch wenn ich mich nur einmal am Tag kurz anmelde. Ich merke das deutlich, dass ich viele interessante Dinge bei Mastodon nur zufällig mal sehe, die mir woanders deutlich präsentiert werden.</p>

<h2 id="bluesky" data-numberify>BlueSky<a class="anchor ms-1" href="#bluesky"></a></h2>
<p>Viele Menschen aus der Twitter-Fahrradbubble, die nie zu Mastodon gefunden haben, wandern aktuell nach BlueSky ab.<sup id="fnref:1"><a href="#fn:1" class="footnote-ref" role="doc-noteref">1</a></sup></p>
<p>Und da ich mit diesen Menschen weiterhin kommunizieren wollte, war ich dankbar, dass mir Su Bittner (<a  class='urlextern'  href="https://twitter.com/bit_ou">Twitter</a>, <a  class='urlextern'  href="https://bsky.app/profile/bitou.bsky.social">BlueSky</a>) einen Invitecode angeboten hat. Danke dafür.</p>
<p>Mein Accountname da drüben ist <code>Natenom</code>, so wie sonst auch überall. Aber ich werde den Account erst einmal nicht auf meinen Websites verlinken.</p>
<p>Und nachdem ich jetzt einige Tage immer wieder bei BlueSky reingeschaut hatte, stört mich besonders, dass es keine Filtermöglichkeiten gibt, was mich gewaltig nervt, habe ich doch sowohl in Twitter als auch in Mastodon eine Menge Wörter stumm gestellt, um meine mentale Gesundheit aufrecht zu erhalten und gewisse Themen gar nicht mitzubekommen.</p>
<p>Alleine die fehlenden Filtermöglichkeiten sind für mich schon Grund genug, BlueSky erst einmal gar nicht mehr zu benutzen, da die negativen Posts stark überwiegen, was vermutlich auch gewollt ist.</p>
<p>Sollte es irgendwann möglich werden, Wörter zu filtern, werde ich mir das ganze noch einmal anschauen. Denn welches der Netzwerke sich vor allem für die Fahrradbubble durchsetzen wird, wird sich erst zeigen, wenn man für die Registrierung auf BlueSky keine Einladung mehr benötigt. Dann wird es spannend werden.</p>
<p>Bis dahin ist mir meine psychische Gesundheit wichtiger als die Kommunikation mit diesem Teil der Bubble auf BlueSky.</p>

<h2 id="was-bleibt--fediverse" data-numberify>Was bleibt – Fediverse<a class="anchor ms-1" href="#was-bleibt--fediverse"></a></h2>
<p>Fazit für mich aus den bisherigen Erfahrungen: Twitter benutze ich weiterhin nicht mehr. Und BlueSky werde ich erst wieder ausprobieren, wenn es Filtermöglichkeiten gibt.</p>
<p>Ich bespiele weiterhin nur das Fediverse mit meinem Account <a  class='urlextern'  href="https://social.anoxinon.de/@natenom">&ldquo;Natenom&rdquo; auf Mastodon</a> und auch der Account des <a  class='urlextern'  href="https://plushies.social/@ploggifanti">kleinen Elefanten 🐘</a> wird weiterhin bespielt, denn mit dem verbinde ich nur sehr positive Dinge, die mir und auch anderen Menschen Freude bereiten.</p>
<p>Dazu gibt es dann noch den relativ neuen <a  class='urlextern'  href="https://pixelfed.social/rausgeschafft">Pixelfed-Account &ldquo;rausgeschafft&rdquo;</a>, wann immer ich es nach draußen geschafft habe.</p>
<p>Wer mich erreichen will, <a  href="/natenom/">schaut hier</a>, auf Nachrichten in den beiden anderen Netzwerke reagiere ich nicht mehr.</p>
<p>Und generell gilt, wie im Foto oben zu sehen: Mehr draußen sein und schaukeln.</p>
<div class="footnotes" role="doc-endnotes">
<hr>
<ol>
<li id="fn:1">
<p>Hier ein <a  class='urlextern'  href="https://www.tagesspiegel.de/meinung/social-media-plattform-bluesky-was-elon-musk-wirklich-wehtut-10561477.html">paar Gründe</a>, weshalb Menschen nach BlueSky gehen und nicht nach Mastodon.&#160;<a href="#fnref:1" class="footnote-backref" role="doc-backlink">&#x21a9;&#xfe0e;</a></p>
</li>
</ol>
</div>]]></content:encoded><enclosure url="https://natenom.de/2023/10/social-media-welche-netzwerke-ich-weiterhin-bespiele-welche-nicht-und-weshalb/mehr-schaukeln-cover-featured.webp" length="1056380" type="image/webp"/></item><item><title>Ein schöner Versuch mit Pixelfed – rausgeschafft</title><link>https://natenom.de/2023/10/ein-schoener-versuch-mit-pixelfed-rausgeschafft/</link><pubDate>Thu, 05 Oct 2023 17:46:14 +0200</pubDate><guid>https://natenom.de/2023/10/ein-schoener-versuch-mit-pixelfed-rausgeschafft/</guid><description>&lt;p>Es gibt Tage, an denen möchte man zwar gerne raus und unterwegs sein, die Natur genießen und all so etwas, doch aus irgendwelchen Gründen ist das nicht schaffbar. So geht es vielen Menschen. Und wenn man es dann trotzdem raus geschafft hat und draußen unterwegs ist, dann weiß man das auch zu schätzen.&lt;/p></description><content:encoded><![CDATA[<p>Es gibt Tage, an denen möchte man zwar gerne raus und unterwegs sein, die Natur genießen und all so etwas, doch aus irgendwelchen Gründen ist das nicht schaffbar. So geht es vielen Menschen. Und wenn man es dann trotzdem raus geschafft hat und draußen unterwegs ist, dann weiß man das auch zu schätzen.</p>
<p>Und genau zu dieser Sache hatte ich schon länger eine schöne Idee, die ich endlich umgesetzt habe.</p>
<p>Denn an solchen Tagen, an denen ich draußen bin, möchte ich gerne schöne Erinnerungen schaffen, für die Tage, an denen ich es nicht raus schaffe. Und noch schöner ist es, wenn sich auch andere Menschen daran erfreuen können, entweder, weil sie das selbe Problem haben oder weil sie einfach nur ab und zu (schöne) Fotos sehen möchten.</p>
<p>Deshalb habe ich einen neuen Pixelfed-Account eingerichtet. Pixelfed ist quasi wie Instagram, nur eben im Fediverse. Der Fokus bei Pixelfed liegt klar auf Fotos. Man kann auf dem von mir gewählten Server bis zu 10 Fotos auf einmal veröffentlichen und hat insgesamt 7 GB Speicherplatz zur Verfügung.</p>
<p>Der Account heißt dieses Mal nicht Natenom, wie sonst immer, sondern <a  class='urlextern'  href="https://pixelfed.social/rausgeschafft">&ldquo;rausgeschafft&rdquo;</a> und in der Beschreibung des Accounts steht:</p>
<blockquote class="shortcode-blockquote">
  <p><p>Fotos ohne Kontext, aber von draußen, wenn wir (der kleine 🐘 und der 🚴) es &ldquo;rausgeschafft&rdquo; haben, was leider nicht selbstverständlich ist.</p>
<p>Wer es selbst mal nicht raus schafft, holt sich hier Vorfreude auf eigene schöne Erlebnisse in der Zukunft.</p>
</p>
  
  
</blockquote>



<h2 id="folgen-für-die-schönen-dinge" data-numberify>Folgen für die schönen Dinge<a class="anchor ms-1" href="#folgen-für-die-schönen-dinge"></a></h2>
<p>Wer also nur die schönen Dinge sehen möchte, die wir so erleben und fotografieren, der kann dem <a  class='urlextern'  href="https://pixelfed.social/rausgeschafft">rausgeschafft-Account im Fediverse folgen</a>. Dies ist auch möglich, wenn man selbst keinen Pixelfed-Account hat, sondern z. B. einen bei Mastodon.</p>
<p>Hier ein Screenshot des Profils, in dem es schon ein paar Fotos der letzten Tage gibt:</p>
 <figure class="image-caption"><a href="2023-10-05-screenshot-profil-rausgeschafft-cover.webp"><picture>
                <source type="image/webp" srcset="/2023/10/ein-schoener-versuch-mit-pixelfed-rausgeschafft/2023-10-05-screenshot-profil-rausgeschafft-cover_hua1148a1945cad3fdc4eab594c8a789e2_135992_360x0_resize_q95_h2_catmullrom_2.webp 360w,/2023/10/ein-schoener-versuch-mit-pixelfed-rausgeschafft/2023-10-05-screenshot-profil-rausgeschafft-cover_hua1148a1945cad3fdc4eab594c8a789e2_135992_500x0_resize_q95_h2_catmullrom_2.webp 500w,/2023/10/ein-schoener-versuch-mit-pixelfed-rausgeschafft/2023-10-05-screenshot-profil-rausgeschafft-cover_hua1148a1945cad3fdc4eab594c8a789e2_135992_816x0_resize_q95_h2_catmullrom_2.webp 816w"
                                          sizes="(max-width: 424px) 360px, (max-width: 596px) 500px, (min-width: 565px) 816px" />
                <img alt="" srcset="/2023/10/ein-schoener-versuch-mit-pixelfed-rausgeschafft/2023-10-05-screenshot-profil-rausgeschafft-cover_hua1148a1945cad3fdc4eab594c8a789e2_135992_360x0_resize_q95_h2_catmullrom_2.webp 360w, /2023/10/ein-schoener-versuch-mit-pixelfed-rausgeschafft/2023-10-05-screenshot-profil-rausgeschafft-cover_hua1148a1945cad3fdc4eab594c8a789e2_135992_500x0_resize_q95_h2_catmullrom_2.webp 500w, /2023/10/ein-schoener-versuch-mit-pixelfed-rausgeschafft/2023-10-05-screenshot-profil-rausgeschafft-cover_hua1148a1945cad3fdc4eab594c8a789e2_135992_816x0_resize_q95_h2_catmullrom_2.webp 816w"
                     sizes="(max-width: 424px) 360px, (max-width: 596px) 500px, (min-width: 565px) 816px"
                     src="/2023/10/ein-schoener-versuch-mit-pixelfed-rausgeschafft/2023-10-05-screenshot-profil-rausgeschafft-cover_hua1148a1945cad3fdc4eab594c8a789e2_135992_816x0_resize_q95_h2_catmullrom_2.webp" title="Screenshot des Profils rausgeschafft mit dem Profilfoto (Eine Sonnenblume) und mehreren Fotos der letzten Tage." loading="lazy" width="816" height="829" /></picture></a><figcaption>Die Profilseite des Accounts &ldquo;rausgeschafft&rdquo;.</figcaption></figure>

<h2 id="regeln" data-numberify>Regeln<a class="anchor ms-1" href="#regeln"></a></h2>
<p>Es gibt nur eine Regel für den Account:</p>
<ul>
<li>Nur schöne Erinnerungen und nur von draußen.</li>
</ul>
<p>Dabei gilt optional zusätzlich:</p>
<ul>
<li>Fotos ohne Kontext oder weitere Infos zu Ort/Zeit/Datum.</li>
<li>Mal Fotos aus Sicht vom kleinen 🐘 und mal aus Sicht vom 🚴.</li>
<li>Entweder aktuelle Fotos oder aus dem Archiv (als wir früher mal draußen waren).</li>
<li>Manchmal werde ich die Posts des Accounts mit den Accounts auf Mastodon boosten.</li>
</ul>

<h2 id="schöne-fotos-für-den-blog" data-numberify>Schöne Fotos für den Blog<a class="anchor ms-1" href="#schöne-fotos-für-den-blog"></a></h2>
<p>Schönste oder wichtige Fotos landen irgendwann in meinem Blog. Ich habe keinen Anspruch auf qualitativ hochwertige Fotos, wichtig ist nur, dass es schöne Erinnerungen sind.</p>

<h2 id="löschen-von-posts" data-numberify>Löschen von Posts<a class="anchor ms-1" href="#löschen-von-posts"></a></h2>
<p>Im Gegensatz zu meinen Accounts bei Mastodon wird bei Pixelfed erst gelöscht, wenn der zur Verfügung stehende Speicherplatz des Accounts zur Neige geht.</p>]]></content:encoded><enclosure url="https://natenom.de/2023/10/ein-schoener-versuch-mit-pixelfed-rausgeschafft/2023-10-05-screenshot-profil-rausgeschafft-cover.webp" length="135992" type="image/webp"/></item><item><title>Kommentarfunktion via Isso für meinen Blog</title><link>https://natenom.de/2023/08/kommentarfunktion-via-isso-fuer-meinen-blog/</link><pubDate>Sat, 12 Aug 2023 20:38:03 +0200</pubDate><guid>https://natenom.de/2023/08/kommentarfunktion-via-isso-fuer-meinen-blog/</guid><description><![CDATA[<p>Dank Isso ist es nun möglich, Kommentare hier im Blog zu schreiben. Zur Installation von Isso schreibe ich hier nichts, da gibt es eine gute Anleitung auf der Projektseite, aber ich schreibe etwas zur Motivation und zur Benutzung.</p>
<p>Vor einiger Zeit hatte ich hier schon einmal die <a  href="/2022/11/kommentare-in-meinem-statischen-blog-via-mastodon/">Möglichkeit erläutert, Kommentare zu schreiben</a>, obwohl das hier eine statische Website ist, die mit Hugo betrieben wird.</p>]]></description><content:encoded><![CDATA[<p>Dank Isso ist es nun möglich, Kommentare hier im Blog zu schreiben. Zur Installation von Isso schreibe ich hier nichts, da gibt es eine gute Anleitung auf der Projektseite, aber ich schreibe etwas zur Motivation und zur Benutzung.</p>
<p>Vor einiger Zeit hatte ich hier schon einmal die <a  href="/2022/11/kommentare-in-meinem-statischen-blog-via-mastodon/">Möglichkeit erläutert, Kommentare zu schreiben</a>, obwohl das hier eine statische Website ist, die mit Hugo betrieben wird.</p>
<h2 id="wozu-überhaupt-kommentare" data-numberify>Wozu überhaupt Kommentare?<a class="anchor ms-1" href="#wozu-überhaupt-kommentare"></a></h2>
<p>Wenn ich einen Blogbeitrag auf Social Media verlinke, bekomme ich dort Rückmeldungen dazu. Diese sind aber nur im Kontext Social Media zu finden und nicht, wenn man Blogbeiträge im Browser liest.</p>

<h2 id="nicht-gut--kommentare-via-fediversemastodon" data-numberify>Nicht gut – Kommentare via Fediverse/Mastodon<a class="anchor ms-1" href="#nicht-gut--kommentare-via-fediversemastodon"></a></h2>
<p>Letztes Jahr hatte ich bereits Kommentare via Mastodon bzw. dem Fediverse ermöglicht, was jedoch ein paar Nachteile hatte. Hauptsächlich war es umständlich, denn ich musste für jeden Blogbeitrag, für den Kommentare möglich sein sollten, einen Toot auf Mastodon erstellen und darin den Blogbeitrag verlinken. Dann im Front Matter (Header des Blogbeitrags) die URL zum Toot eintragen und den Blog neu generieren. Das hatte ich dann auch nur ein paar Mal gemacht.</p>
<p>Weitere Nachteile:</p>
<ul>
<li>Keine Moderation.</li>
<li>Nicht wirklich transparent für Menschen, die im Fediverse kommentieren. Dazu hatte ich mein Setup dann noch etwas komplizierter gestaltet, <a  href="/2022/11/transparenz-fuer-kommentare-im-blog-via-mastodon/">siehe hier</a>.</li>
<li>Dass ich meine Toots immer mal wieder lösche, war nicht gerade hilfreich.</li>
</ul>

<h2 id="besser--kommentare-via-isso" data-numberify>Besser – Kommentare via Isso<a class="anchor ms-1" href="#besser--kommentare-via-isso"></a></h2>
<p>Hingegen gibt es bei Isso, das ich jetzt verwende, einige Vorteile:</p>
<p>Vorteile für Benutzer:</p>
<ul>
<li>Für einen einstellbaren Zeitraum lassen sich bereits gesendete Kommentare vom Absender ändern. Derzeit sind das 5 Minuten.</li>
<li>Wenn die entsprechenden Cookies im Browser des Benutzers noch vorhanden sind, kann er eigene Kommentare wieder gelöscht werden.</li>
<li>Man kann auf andere Kommentare Bezug nehmen und dies ist später auch in der Struktur erkennbar.</li>
<li>Markdown kann verwendet werden.</li>
</ul>
<p>Vorteile für mich als Betreiber:</p>
<ul>
<li>Die Daten liegen auf meinem Server und ich kann sie jederzeit einfach vom Netz nehmen.</li>
<li>Die Daten liegen in einer Sqlite-Datenbank, die man einfach sichern kann.</li>
<li>Die Sqlite-Datenbank kann man direkt bearbeiten, entweder mit <code>sqlite3</code> oder mit <code>litecli</code>.</li>
<li>Es gibt keine Metadaten, die in Blogbeiträgen enthalten sind. D. h. aus Sicht von Hugo muss nur das Script zum Laden/Schreiben von Kommentaren eingebunden werden. Dadurch kann man Kommentare auch nicht über die Suche finden.</li>
<li>Es gibt eine Moderation für Kommentare. Ich kann einen Kommentar vor dem Freischalten bearbeiten.</li>
<li>Isso kann auf einem anderen Server laufen und beherrscht auch Multisite, also das Bereitstellen der Kommentarfunktion für verschiedene Websites.</li>
</ul>
<div class="shortcode-notice hinweis">
    <div class="shortcode-notice-title hinweis">
        Hinweis</div>
    <div class="notice-content"><p>Ein Nachteil ist für mich, dass jetzt wieder eine dynamische Komponente auf dem Server läuft, die für den Betrieb von <code>comments.natenom.de</code> zuständig ist und hinter einem Nginx-Proxy läuft.</p>
<p>Die kann ich aber jederzeit abschalten und es würden keine Probleme daraus entstehen.</p>
</div>
</div>



<h2 id="local-storage-cookies-und-ip-adresse" data-numberify>Local Storage, Cookies und IP-Adresse<a class="anchor ms-1" href="#local-storage-cookies-und-ip-adresse"></a></h2>
<p>Sobald man einen Kommentar abschickt, speichert der Browser für weitere Kommentare den angegebenen Namen, die E-Mail-Adresse und die URL im LocalStorage des Browsers. Diese Daten können später clientseitig vom Script ausgelesen und verwendet werden.</p>
<p>Des weiteren wird für jeden abgesendeten Kommentar ein Cookie gesetzt. Dieses wird auch nur vom JavaScript clientseitig ausgewertet und nur zur Authentifizierung an den Server geschickt, wenn man einen abgesendeten Kommentar ändern oder löschen möchte.</p>
<p>Serverseitig werden vom Benutzer die offensichtlichen Daten des Kommentars gespeichert und zusätzlich auch die IP-Adresse, wobei der letzte Teil auf Null gesetzt wird.</p>
<p>Ich habe für die neue Kommentarfunktion die Datenschutzerklärung im Blog entsprechend angepasst.</p>

<h2 id="an-die-url-des-blogbeitrags-gebunden" data-numberify>An die URL des Blogbeitrags gebunden<a class="anchor ms-1" href="#an-die-url-des-blogbeitrags-gebunden"></a></h2>
<p>Für jeden Kommentar wird die URL des Blogbeitrags (ohne <code>https://natenom.de</code> am Anfang) gespeichert. Wenn man also nachträglich den Slug eines Beitrags ändert, dann werden Kommentare nicht mehr sichtbar sein, wenn man nicht auch in der Datenbank von Isso diese URL in den entsprechenden Kommentaren ändert.</p>

<h2 id="kommentarfunktion-in-einzelnen-beiträgen-deaktivieren" data-numberify>Kommentarfunktion in einzelnen Beiträgen deaktivieren<a class="anchor ms-1" href="#kommentarfunktion-in-einzelnen-beiträgen-deaktivieren"></a></h2>
<p>Dank des Themes, das ich hier im Blog verwende (siehe unten im Footer), kann ich für einzelne Blogbeitrag Kommentare deaktivieren. Dazu füge ich im Front Matter eines Beitrags <code>comment: false</code> ein.</p>
<p>Man kann natürlich trotzdem über die API Kommentare für solche Beiträge abgeben. Aber erstens sind Kommentare im Blog moderiert und zweitens werden sie in solchen Beiträgen gar nicht erst durch den Browser abgerufen/geladen.</p>

<h2 id="recht-auf-vergessen" data-numberify>Recht auf Vergessen<a class="anchor ms-1" href="#recht-auf-vergessen"></a></h2>
<p>Da ich das <a  href="/2022/02/recht-auf-vergessen-kommentare-geloescht/">Recht auf Vergessen</a> gut finde, werde ich noch etwas einrichten, um alle Kommentare zu löschen, die älter sind als x. Wie lange x sein wird, habe ich noch nicht entschieden.</p>

<h2 id="gespannt" data-numberify>Gespannt<a class="anchor ms-1" href="#gespannt"></a></h2>
<p>Da es auch schon in der Vergangenheit, als der Blog noch mit WordPress betrieben wurde, nur selten Kommentare gab, bin ich gespannt, ob jetzt jemand diese Möglichkeit nutzen wird. Und vor allem, ob ich irgendwann von Spam oder sonst etwas genervt sein werde, und Kommentare wieder abschalten werde.</p>
<p>Es kann jedoch im Zweifel etwas dauern, bis ich Kommentare freigebe.</p>

<h2 id="projektseite" data-numberify>Projektseite<a class="anchor ms-1" href="#projektseite"></a></h2>
<p>Hier die <a  class='urlextern'  href="https://isso-comments.de/">Projektseite von Isso</a>.</p>
<p>Speziell die Clientkonfiguation fand ich hilfreich, <a  class='urlextern'  href="https://isso-comments.de/docs/reference/client-config/">siehe hier</a>.</p>]]></content:encoded></item><item><title>Alte Tröts auf Mastodon löschen</title><link>https://natenom.de/2022/11/alte-troets-von-mastodon-loeschen/</link><pubDate>Sun, 20 Nov 2022 17:52:15 +0100</pubDate><guid>https://natenom.de/2022/11/alte-troets-von-mastodon-loeschen/</guid><description>&lt;p>Man kann zwar Mastodon mittlerweile so einstellen, dass alte Tröts automatisch gelöscht werden sollen (&lt;a href="/2022/04/mastodon-kann-selbst-automatisch-loeschen/">siehe hier&lt;/a>), wenn man darüber jedoch etwas mehr Kontrolle haben möchte, benötigt man externe Werkzeuge.&lt;/p></description><content:encoded><![CDATA[<p>Man kann zwar Mastodon mittlerweile so einstellen, dass alte Tröts automatisch gelöscht werden sollen (<a  href="/2022/04/mastodon-kann-selbst-automatisch-loeschen/">siehe hier</a>), wenn man darüber jedoch etwas mehr Kontrolle haben möchte, benötigt man externe Werkzeuge.</p>
<p>So auch für meinen Mastodon-Account. Dort sollen zwar Tröts gelöscht werden, die älter als 3 Monate sind, jedoch nicht, wenn sie das Hashtag <code>#blogcomments</code> beinhalten. Denn das nutze ich, um im Blog <a  href="/2022/11/kommentare-in-meinem-statischen-blog-via-mastodon/">Kommentare zu ermöglichen</a>. Diese speziellen Tröts würde ich dann zukünftig nur manuell nach Belieben löschen.</p>
<p>In der Vergangenheit hatte ich das Tool <a  href="/tags/ephemetoot/">Ephemetoot</a> verwendet, um alte Tröts zu löschen. Als ich das vor ein paar Tagen erneut nutzen wollte, hat es leider nicht mehr funktioniert. Es gab eine Fehlermeldung bei jedem Löschversuch. Das Projekt scheint leider eingeschlafen zu sein.</p>
<p>Also fragte ich im Fediverse nach einer Alternative. &ldquo;D.N:K <a  class='urlextern'  href="https://barcamp.social/@dnkrupinski">@dnkrupinski@barcamp.social</a>&rdquo; wies darauf hin, dass im Github-Repo von Ephemetoot eine Alternative genannt wurde. Das hatte ich beim Querlesen übersehen. Danke für den Hinweis.</p>
<p>Das Tool <a  class='urlextern'  href="https://git.augendre.info/gaugendre/cleantoots">cleantoots</a> habe ich ausprobiert und es funktioniert. Es bietet auch die Möglichkeit, einzustellen, dass Tröts mit bestimmten Hashtags nicht gelöscht werden. Genau das benötige ich.</p>

<h2 id="installation" data-numberify>Installation<a class="anchor ms-1" href="#installation"></a></h2>
<p>Die Installation des Tools ist ganz einfach.</p>
<p>Linux vorausgesetzt:</p>
<div class="highlight"><pre tabindex="0" style="color:#f8f8f2;background-color:#272822;-moz-tab-size:4;-o-tab-size:4;tab-size:4;"><code class="language-bash" data-lang="bash"><span style="display:flex;"><span>pip install cleantoots
</span></span><span style="display:flex;"><span>
</span></span><span style="display:flex;"><span>cleantoots config setup
</span></span><span style="display:flex;"><span>cleantoots config login
</span></span></code></pre></div><p>Dann wird durch das Tool der Browser gestartet und es öffnet sich die Website der Instanz und es wird um Authorisierung gebeten. Den angezeigten Code kopiert man und fügt ihn in die Kommandozeile ein, in der der <code>cleantoots config login</code> noch läuft.</p>
<p>Fertig.</p>

<h2 id="benutzung" data-numberify>Benutzung<a class="anchor ms-1" href="#benutzung"></a></h2>
<p>Von nun an kann man alte Tröts löschen lassen mit:</p>
<div class="highlight"><pre tabindex="0" style="color:#f8f8f2;background-color:#272822;-moz-tab-size:4;-o-tab-size:4;tab-size:4;"><code class="language-bash" data-lang="bash"><span style="display:flex;"><span>cleantoots clean --delete
</span></span></code></pre></div><p>Oder sich mit einem &ldquo;Trockenlauf&rdquo; erst einmal anzeigen lassen, was cleantoots machen würde:</p>
<div class="highlight"><pre tabindex="0" style="color:#f8f8f2;background-color:#272822;-moz-tab-size:4;-o-tab-size:4;tab-size:4;"><code class="language-bash" data-lang="bash"><span style="display:flex;"><span>cleantoots clean
</span></span></code></pre></div><p>Was zu solch einer Ausgabe führen würde:</p>
<pre tabindex="0"><code>…
2022-11-05 00:28:54,871 | cleantoots.commands.clean | INFO | @foobar hier werden lange Links trotzdem verkürzt angezeigt mit … am Ende.
2022-11-05 00:28:54,871 | cleantoots.commands.clean | INFO | boost of toot https://foo.baaar/@foo/123456 protected because creation time 2022-11-01 14:22:49.675000+00:00 is later than limit 2022-08-07T00:28:50.988279+02:00
2022-11-05 00:28:54,872 | cleantoots.commands.clean | INFO | original toot https://social.anoxinon.de/@natenom/109268995231048789 protected because creation time 2022-11-01 14:22:29.308000+00:00 is later than limit 2022-08-07T00:28:50.988485+02:00
…
</code></pre><p>In Zukunft werde ich dieses Script alle x Zeit manuell starten.</p>]]></content:encoded></item><item><title>Mastodon Apps getestet und für Fedilab entschieden</title><link>https://natenom.de/2022/11/mastodon-apps-getestet-und-fuer-fedilab-entschieden/</link><pubDate>Sun, 20 Nov 2022 15:23:04 +0100</pubDate><guid>https://natenom.de/2022/11/mastodon-apps-getestet-und-fuer-fedilab-entschieden/</guid><description><![CDATA[<p>Seit dem 28.10.2022 ist auf Mastodon, bzw. im Fediverse, richtig viel los. Sehr viel mehr, als ich bisher überhaupt erlebt hatte.</p>
<p>Seitdem bin ich eher auf Mastodon unterwegs als auf Twitter und habe mich im Zuge dessen viel mit verschiedenen Apps beschäftigt und Vieles ausprobiert und schreibe hier meine Ergebnisse dazu auf, damit andere Menschen das nicht selbst alles ausprobieren müssen.</p>
<p>Es geht hier nur um Mastodon, das ein Teil des Fediverse ist, und um Apps für dessen Benutzung.</p>]]></description><content:encoded><![CDATA[<p>Seit dem 28.10.2022 ist auf Mastodon, bzw. im Fediverse, richtig viel los. Sehr viel mehr, als ich bisher überhaupt erlebt hatte.</p>
<p>Seitdem bin ich eher auf Mastodon unterwegs als auf Twitter und habe mich im Zuge dessen viel mit verschiedenen Apps beschäftigt und Vieles ausprobiert und schreibe hier meine Ergebnisse dazu auf, damit andere Menschen das nicht selbst alles ausprobieren müssen.</p>
<p>Es geht hier nur um Mastodon, das ein Teil des Fediverse ist, und um Apps für dessen Benutzung.</p>
<div class="shortcode-notice hinweis">
    <div class="shortcode-notice-title hinweis">
        Hinweis</div>
    <div class="notice-content">Blogbeitrag in voller Breite für die Lesbarkeit: Dieser Blogbeitrag enthält eine umfangreiche Tabelle. Um die richtig anzuzeigen, kannst du diesen Beitrag mit einem Klick auf die beiden Pfeile rechts oben beim Blogbeitrag in voller Breite des Browsers anzeigen lassen.</div>
</div>



<h2 id="getestete-apps" data-numberify>Getestete Apps<a class="anchor ms-1" href="#getestete-apps"></a></h2>
<p>Ich habe insgesamt vier Apps für Android und die Web App parallel genutzt und währenddessen verglichen.</p>
<p>Diese Apps habe ich getestet:</p>
<ul>
<li><a  class='urlextern'  href="https://f-droid.org/en/packages/com.keylesspalace.tusky/">Tusky</a></li>
<li>Offizielle <a  class='urlextern'  href="https://play.google.com/store/apps/details?id=org.joinmastodon.android">Mastodon App</a> (gibt es nur bei Google Play)</li>
<li>Web App, also die Website deiner Instanz im Browser (mit der erweiterten Oberfläche). Optional kann man diese auch auf einem Smartphone nutzen und als PWA &ldquo;installieren&rdquo;. Schaltet man dann z. B. in Firefox die &ldquo;Desktop Variante&rdquo; ein, hat man die selbe Oberfläche wie auf dem PC.</li>
<li><a  class='urlextern'  href="https://f-droid.org/en/packages/fr.gouv.etalab.mastodon/">Fedilab</a></li>
<li><a  class='urlextern'  href="https://f-droid.org/en/packages/org.mariotaku.twidere/">Twidere</a></li>
</ul>
<p>(Eine Liste aller existierenden Apps gibt es <a  class='urlextern'  href="https://joinmastodon.org/apps">hier</a>.)</p>

<h2 id="pro-und-kontra-der-apps" data-numberify>Pro und Kontra der Apps<a class="anchor ms-1" href="#pro-und-kontra-der-apps"></a></h2>
<p>Zuerst ein paar Infos zu jeder App und die Vor- und Nachteile der getesteten Apps. Am Ende gibt es eine Vergleichstabelle der Funktionen, die mir wichtig sind.</p>

<h3 id="tusky" data-numberify>Tusky<a class="anchor ms-1" href="#tusky"></a></h3>
<p>Pro:</p>
<ul>
<li>Die UI von Tusky finde ich noch angenehm schön und nicht so überladen wie die von Fedilab.</li>
<li>Im Menü von jedem Toot und Account kann man den Eintrag &ldquo;Mit Account xyz öffnen&rdquo; nutzen, um genau an dieser Stelle z. B. mit einem anderen Account zu antworten, den man auch mit der App benutzt. Das fehlt mir in Fedilab.</li>
</ul>

<h3 id="offizielle-mastodon-app" data-numberify>Offizielle Mastodon App<a class="anchor ms-1" href="#offizielle-mastodon-app"></a></h3>
<p>Pro:</p>
<ul>
<li>Das schönste Benutzerinterface, das ich bisher gesehen habe.</li>
</ul>
<p>Kontra:</p>
<ul>
<li>Die Schriftgröße ist leider nicht einstellbar und sehr groß.</li>
<li>Es wird mit viel Abständen zwischen den Elementen sehr viel Bildschirmplatz verschwendet.</li>
<li>Nur wenig Funktionen.</li>
</ul>
<p>Die offizielle Mastodon App hatte ich als erste deinstalliert. Ich würde sie Menschen empfehlen, die von Twitter kommen und einen leichten Einstieg brauchen oder Mastodon einfach nur benutzen wollen.</p>

<h3 id="web-app" data-numberify>Web App<a class="anchor ms-1" href="#web-app"></a></h3>
<p>Pro:</p>
<ul>
<li>Hier hat man, sofern Instanzbetreiber:in schnell aktualisiert, stets die allerneusten Features von Mastodon.</li>
<li>Die erweiterte Oberfläche ist sehr praktisch, auf kleinen Bildschirmen aber nicht gut nutzbar.</li>
<li>Lässt sich in der einfachen Oberfläche als PWA auf dem Smartphone &ldquo;installieren&rdquo;.</li>
</ul>
<p>Kontra:</p>
<ul>
<li>Auf dem Smartphone hat man nicht genügend Platz für die erweiterte Benutzeroberfläche.</li>
</ul>

<h3 id="fedilab" data-numberify>Fedilab<a class="anchor ms-1" href="#fedilab"></a></h3>
<p>Pro:</p>
<ul>
<li>Die App hat die meisten Funktionen. Und die habe ich schon nach einigen Tagen bei den anderen Apps vermisst.</li>
<li>Die App wird schnell und oft aktualisiert. Bereits einen Tag nach dem 4er-Update für Mastodon gab es schon die Version 3.7.0 von Fedilab, die die neuen Funktionen nutzbar machte.</li>
<li>Man kann jederzeit, auch bei Antworten, mehrere Tröts (als Thread) erstellen, indem man oben rechts auf das Plus-Symbol drückt.</li>
<li>Seit Version 3.8.0 gibt es im Kontexmenü den Eintrag &ldquo;Mit anderem Account öffnen&rdquo; auch in Fedilab. <del>Die fehlende Funktion &ldquo;Mit Account xyz öffnen&rdquo; kann man dadurch ersetzen, dass man in Account A den Link zu einem Beitrag kopiert, dann zu Account B wechselt und die URL dort in die Suche einfügt.</del></li>
<li>In den Einstellungen im Bereich Privatsphäre lässt sich einstellen, dass URLs zu Twitter, Youtube und anderen Diensten innerhalb der Tröts automatisch durch alternative Dienste ersetzt werden.</li>
</ul>
<p>Kontra:</p>
<ul>
<li>Wirkt am Anfang extrem überladen. Doch daran gewöhnt man sich nach ein paar Tagen.</li>
</ul>

<h3 id="twidere" data-numberify>Twidere<a class="anchor ms-1" href="#twidere"></a></h3>
<p>Twidere habe ich nicht als ernste Alternative zu den anderen Apps in Betracht gezogen, sondern hatte sie nur genutzt, weil man damit nur einmal einen Text schreiben und eine Bildbeschreibung hinzufügen muss und diese dann gleichzeitig auf beliebig vielen Konten oder einer Auswahl davon posten kann. Ich hatte damit anfangs sowohl bei Twitter als auch bei Mastodon die Ursprungstweets/-tröts gepostet.</p>
<p>Zum Interagieren zumindest auf Twitter kann ich es nicht empfehlen, da es dort aufgrund der schlechten Twitter-API nur eingeschränkt nutzbar ist. Z. B. sieht meine keine Retweets, Like oder &ldquo;Quoted Retweets&rdquo; von Twitter.</p>
<p>Wie sich die App fürs Fediverse verhält, habe ich jedoch nicht wirklich ausprobiert, habe sie für die Vergleichstabelle unten aber trotzdem hier aufgeführt.</p>

<h2 id="entscheidung-für-fedilab" data-numberify>Entscheidung für Fedilab<a class="anchor ms-1" href="#entscheidung-für-fedilab"></a></h2>
<p>Obwohl Fedilab anfangs total überladen schien und vom UI am hässlichsten war, habe ich mich letztlich immer mehr für diese App entschieden.</p>
<p>Neben den meisten Funktionen hat es auch einen entscheidenden Vorteil gegenüber Tusky und der offiziellen Mastodon App: &ldquo;Bei Abruf neuer Inhalte bleibt man an aktueller Position&rdquo;. Es ist sehr nervig, wenn jedes Mal ganz nach oben gescrollt wird, sobald man neue Tröts abruft (von oben nach unten wischen). Bei Fedilab kann man auch noch am nächsten Tag die App öffnen und dort weiterlesen, wo man am Tag zuvor aufgehört hatte.</p>

<h2 id="vergleichstabelle-einiger-funktionen" data-numberify>Vergleichstabelle einiger Funktionen<a class="anchor ms-1" href="#vergleichstabelle-einiger-funktionen"></a></h2>
<p>Diese Liste beinhaltet nur die Funktionen, die mir wichtig sind.</p>
<table>
<thead>
<tr>
<th>Funktion</th>
<th>Tusky</th>
<th>Mastodon App</th>
<th>Web App</th>
<th>Fedilab</th>
<th>Twidere</th>
</tr>
</thead>
<tbody>
<tr>
<td><strong>Listen</strong></td>
<td>ja</td>
<td>nein</td>
<td>ja</td>
<td>ja</td>
<td>nein</td>
</tr>
<tr>
<td><strong>Timelines (lokal, föderiert, Home)</strong></td>
<td>einzeln</td>
<td>Eine Kombination aus allen?</td>
<td>einzeln</td>
<td>alle</td>
<td>Eine Kombination aus allen?</td>
</tr>
<tr>
<td><strong>Für mehrere Accounts nutzbar</strong></td>
<td>ja</td>
<td>ja</td>
<td>nein</td>
<td>ja</td>
<td>ja</td>
</tr>
<tr>
<td><strong>Entwürfe</strong></td>
<td>ja</td>
<td>nein</td>
<td>nein</td>
<td>ja</td>
<td>ja</td>
</tr>
<tr>
<td><strong>Hashtags folgen</strong></td>
<td>ja</td>
<td>nein</td>
<td>ja</td>
<td>ja</td>
<td>nein</td>
</tr>
<tr>
<td><strong>Scheduled Toots</strong></td>
<td>ja (clientseitig)</td>
<td>nein</td>
<td>nein</td>
<td>ja (clientseitig)</td>
<td>nein</td>
</tr>
<tr>
<td><strong>Bei Abruf neuer Inhalte bleibt man an aktueller Position</strong></td>
<td>ja bei Benachrichtigungen, sonst leider nein <sup id="fnref:1"><a href="#fn:1" class="footnote-ref" role="doc-noteref">1</a></sup></td>
<td>nein</td>
<td>einstellbar (nur, solange Browsertab geöffnet bleibt)</td>
<td>ja</td>
<td>ja</td>
</tr>
<tr>
<td><strong>Schriftgröße einstellbar</strong></td>
<td>ja</td>
<td>nein</td>
<td>nein</td>
<td>ja</td>
<td>?</td>
</tr>
<tr>
<td><strong>Auf mehrere Accounts gleichzeitig tröten</strong></td>
<td>nein</td>
<td>nein</td>
<td>nein</td>
<td>nein</td>
<td>ja</td>
</tr>
<tr>
<td><strong>Filter bearbeiten</strong></td>
<td>ja</td>
<td>nein</td>
<td>ja</td>
<td>ja</td>
<td>nein</td>
</tr>
<tr>
<td><strong>Blockierte/stumm gestellte Konten bearbeiten</strong></td>
<td>ja</td>
<td>nein</td>
<td>ja</td>
<td>ja</td>
<td>ja</td>
</tr>
<tr>
<td><strong>Glocke aktivieren/deaktivieren</strong></td>
<td>ja</td>
<td>nein</td>
<td>ja</td>
<td>ja</td>
<td>nein</td>
</tr>
<tr>
<td><strong>Linkvorschau (Voreinstellung)</strong></td>
<td>ja (deaktiviert)</td>
<td>ja (nicht deaktivierbar)</td>
<td>ja (nicht deaktivierbar)</td>
<td>ja (aktiviert)</td>
<td>nein (?)</td>
</tr>
<tr>
<td><strong>Beiträge nachträglich bearbeiten</strong></td>
<td>?</td>
<td>Nein</td>
<td>Ja</td>
<td>Ja</td>
<td>Nein</td>
</tr>
</tbody>
</table>
<p><em>Die verschiedenen Apps haben sich während des Schreibens teilweise schnell geändert. Falls hier etwas steht, das nicht mehr richtig ist, dann freue ich mich über eine Info dazu.</em></p>
<div class="footnotes" role="doc-endnotes">
<hr>
<ol>
<li id="fn:1">
<p>Issue dazu, das automatisch nach oben Scrollen in Zukunft zu unterbinden. <a  class='urlextern'  href="https://github.com/tuskyapp/Tusky/issues/89">https://github.com/tuskyapp/Tusky/issues/89</a>&#160;<a href="#fnref:1" class="footnote-backref" role="doc-backlink">&#x21a9;&#xfe0e;</a></p>
</li>
</ol>
</div>]]></content:encoded><enclosure url="https://natenom.de/2022/11/mastodon-apps-getestet-und-fuer-fedilab-entschieden/2022-11-20-fedilab-app-cover.png" length="54484" type="image/png"/></item><item><title>Transparenz für Kommentare im Blog via Mastodon</title><link>https://natenom.de/2022/11/transparenz-fuer-kommentare-im-blog-via-mastodon/</link><pubDate>Fri, 04 Nov 2022 15:22:56 +0100</pubDate><guid>https://natenom.de/2022/11/transparenz-fuer-kommentare-im-blog-via-mastodon/</guid><description><![CDATA[<p>Erst vor ein paar Tagen hatte ich hier im Blog ermöglicht, <a  href="/2022/11/kommentare-in-meinem-statischen-blog-via-mastodon/">via Mastodon Kommentare</a> zu schreiben.</p>
<p>Dabei werden hier im Blog alle Antworten auf einen bestimmten Tröt/Toot bei einem Klick auf einen Button von Mastodon nachgeladen.</p>
<p>Es sind alle Tröts sichtbar, die bei Mastodon bzw. im Fediverse auf einen ganz bestimmten, ausgewählten Tröt/Toot als Antwort geschrieben werden.</p>
<p>Sobald ich einen Blogbeitrag fertig und veröffentlicht habe, setze ich einen solchen Tröt ab und binde dann dessen Antworten für die Kommentarfunktion im Blogbeitrag ein.</p>]]></description><content:encoded><![CDATA[<p>Erst vor ein paar Tagen hatte ich hier im Blog ermöglicht, <a  href="/2022/11/kommentare-in-meinem-statischen-blog-via-mastodon/">via Mastodon Kommentare</a> zu schreiben.</p>
<p>Dabei werden hier im Blog alle Antworten auf einen bestimmten Tröt/Toot bei einem Klick auf einen Button von Mastodon nachgeladen.</p>
<p>Es sind alle Tröts sichtbar, die bei Mastodon bzw. im Fediverse auf einen ganz bestimmten, ausgewählten Tröt/Toot als Antwort geschrieben werden.</p>
<p>Sobald ich einen Blogbeitrag fertig und veröffentlicht habe, setze ich einen solchen Tröt ab und binde dann dessen Antworten für die Kommentarfunktion im Blogbeitrag ein.</p>
<h2 id="intransparent" data-numberify>Intransparent<a class="anchor ms-1" href="#intransparent"></a></h2>
<p>Das Problem dabei: Kommentiert man ausgehend vom Blogbeitrag, dann ist klar ersichtlich, dass dabei Mastodon als Quelle dient. Doch Menschen, die nur auf Mastodon bzw. im Fediverse auf meinen Tröt zu einem Blogbeitrag reagieren, können nicht erkennen, dass ihre Antworten im Blog im Kommentarbereich zu sehen sein werden.</p>
<p>Dass das nicht optimal ist, war mir schon klar, als ich das umgesetzt hatte. Ich war jedoch erstm einmal froh, dass es überhaupt so funktioniert hatte und verschob alles weitere auf später.</p>
<p>Heute hat jemand diese Überlegungen auf meine heutige Todo-Liste gestellt, als er mir diesen <a  class='urlextern'  href="https://chaos.social/@larsreineke/109285139842734824">Tröt</a> schickte, der genau das Problem beschreibt. (Danke dafür.)</p>
<p>Der Autor äußert bei einer solchen Vorgehensweise Bedenken bezüglich des Datenschutzes und empfindet es zumindest als unhöflich. Letzerem stimme ich zu.</p>
<p>Wegen Datenschutz sehe ich keine Probleme, bin aber auch nur Laie. Das Fediverse besteht aus vielen verschiedenen Instanzen und sobald man dort etwas öffentlich schreibt, werden die Tröts auf unzählige Instanzen weitergeleitet und weiß letzlich nie, in welchem Kontext die eigenen Beiträge zu sehen sein werden.</p>

<h2 id="transparent" data-numberify>Transparent<a class="anchor ms-1" href="#transparent"></a></h2>
<p>Deshalb werde ich die Kommentarfunktion via Mastodon ab jetzt leicht abgeändert umsetzen.</p>
<p>Es wird weiterhin für Blogbeiträge, die ich im Fediverse teilen möchte, einen eigenen Tröt geben. Als erste Antwort auf diesen Tröt werde ich einen weiteren Tröt schreiben, der erklärt, dass nur die Antworten auf diesen Tröt für die Kommentarfunktion des Blogs herangezogen werden.</p>
<p>Beispiel:</p>
<ul>
<li><strong>Tröt 1</strong>: <code>Meine Fahrradstatistik für Oktober 2022</code>
<ul>
<li><strong>Tröt 2</strong> (als Antwort auf Tröt 1): <code>Wenn du auf diesen Tröt hier antwortest, werden die Antworten im Kommentarbereich des oben verlinkten Blogbeitrags angezeigt. Antworten auf den Ursprungströt (der mit dem Link zum Blogbeitrag) sind nicht im Blog sichtbar. Es kann ein paar Minuten dauern, bis die Kommentarfunktion im Blog aktiviert ist. #blogcomments</code>
<ul>
<li><strong>Tröt 3</strong> (als Antwort auf Tröt 2): <code>abc</code> -&gt; erscheint im Kommentarbereich des Blogs.
<ul>
<li><strong>Tröt 6</strong> (als Antwort auf Tröt 3): <code>bar</code> -&gt; erscheint im Kommentarbereich des Blogs.</li>
</ul>
</li>
<li><strong>Tröt 5</strong> (als Antwort auf Tröt 2): <code>foo</code> -&gt; erscheint im Kommentarbereich des Blogs.</li>
</ul>
</li>
<li><strong>Tröt 4</strong> (als Antwort auf Tröt 1): <code>def</code> -&gt; erscheint nicht im Kommentarbereich des Blogs.</li>
</ul>
</li>
</ul>
<div class="shortcode-notice tipp">
    <div class="shortcode-notice-title tipp">
        Tipp</div>
    <div class="notice-content"><p>Das Hashtag <code>#blogcomments</code> werde ich vorsorglich hinzufügen, da es z. B. mit <a  href="/2021/03/alte-toots-eines-mastodon-accounts-automatisiert-loeschen/">Ephemetoot</a> möglich ist, Tröts mit bestimmten Tags von der Löschung auszuschließen. <a  href="/2022/04/mastodon-kann-selbst-automatisch-loeschen/">Mastodon kann zwar auch selbst alte Tröts löschen</a>, bietet aber nur sehr wenige Möglichkeiten, bestimmte Tröts von der Löschung auszuschließen.</p>
<p>In Zukunft könnte ich statt der in Mastodon eingebauten Funktion wieder Ephemetoot nutzen, um alte Tröts zu löschen und dabei Tröts behalten, die das Tag <code>#blogcomments</code> beinhalten.</p>
</div>
</div>



<h2 id="daten-sind-live-es-gibt-keine-kopien" data-numberify>Daten sind live, es gibt keine Kopien<a class="anchor ms-1" href="#daten-sind-live-es-gibt-keine-kopien"></a></h2>
<p>Die Antworten auf den &ldquo;Kommentar&rdquo;-Tröt werden übrigens nicht in meinen Blog &ldquo;hineinkopiert&rdquo; sondern immer via JavaScript live über den Browser des Besuchers nachgeladen.</p>
<p>Das bedeutet, dass jeder seinen &ldquo;Kommentar&rdquo; auch jederzeit löschen kann.</p>

<h2 id="passt" data-numberify>Passt<a class="anchor ms-1" href="#passt"></a></h2>
<p>Das hier ist der erste Blogbeitrag, bei dem transparent ist, dass Kommentare im Blog landen.</p>]]></content:encoded></item><item><title>Kommentare in meinem statischen Blog via Mastodon</title><link>https://natenom.de/2022/11/kommentare-in-meinem-statischen-blog-via-mastodon/</link><pubDate>Tue, 01 Nov 2022 20:01:42 +0100</pubDate><guid>https://natenom.de/2022/11/kommentare-in-meinem-statischen-blog-via-mastodon/</guid><description><![CDATA[<p>Seit dem Umzug meines Blogs <a  href="/2022/02/umzug-des-blogs-von-wordpress-zu-hugo-teil-1/">von WordPress hin zu einer statischen Website</a> Anfang des Jahres hatte ich ganz leicht, aber wirklich nur ganz bisschen die Kommentarfunktion vermisst. Es gab hier sowieso nur selten Kommentare. Eine Interaktionsmöglichkeit ist aber trotzdem schön.</p>
<p>Deshalb haben wir heute die Möglichkeit im Blog integriert, in dafür freigeschalteten Blogbeiträgen per Mastodon zu kommentieren.</p>]]></description><content:encoded><![CDATA[<p>Seit dem Umzug meines Blogs <a  href="/2022/02/umzug-des-blogs-von-wordpress-zu-hugo-teil-1/">von WordPress hin zu einer statischen Website</a> Anfang des Jahres hatte ich ganz leicht, aber wirklich nur ganz bisschen die Kommentarfunktion vermisst. Es gab hier sowieso nur selten Kommentare. Eine Interaktionsmöglichkeit ist aber trotzdem schön.</p>
<p>Deshalb haben wir heute die Möglichkeit im Blog integriert, in dafür freigeschalteten Blogbeiträgen per Mastodon zu kommentieren.</p>
<p>Vielen Dank an die Menschen, die mir auf <a  class='urlextern'  href="https://social.anoxinon.de/@natenom/109263561189792179">Mastodon auf meine Frage hin</a> antworteten. Darüber konnte ich <a  class='urlextern'  href="https://carlschwan.eu/2020/12/29/adding-comments-to-your-static-blog-with-mastodon/">diesen Blogbeitrag</a> finden, der das Vorgehen für Hugo erklärt.</p>
<div class="shortcode-notice update">
    <div class="shortcode-notice-title update">
        Update</div>
    <div class="notice-content">2022-11-06: Die Einbindung von Kommentaren aus Mastodon erfolgt jetzt transparent, <a  href="/2022/11/transparenz-fuer-kommentare-im-blog-via-mastodon/">siehe hier</a>.</div>
</div>



<h2 id="was-ist-mastodon" data-numberify>Was ist Mastodon?<a class="anchor ms-1" href="#was-ist-mastodon"></a></h2>
<p><a  class='urlextern'  href="https://de.wikipedia.org/wiki/Mastodon_%28Software%29">Mastodon</a> ist ein Teil vom <a  class='urlextern'  href="https://de.wikipedia.org/wiki/Fediverse">Fediverse</a>. Jeder Mensch kann dort einen Account bei einem beliebigen Anbieter einer Instanz erstellen.</p>
<p>Man kann sich das vorstellen wie bei E-Mails. Jeder Mensch hat einen anderen E-Mail-Anbieter und kann trotzdem mit jedem anderen Menschen auf der Welt kommunizieren.</p>

<h2 id="vorab-wie-es-funktioniert" data-numberify>Vorab: Wie es funktioniert<a class="anchor ms-1" href="#vorab-wie-es-funktioniert"></a></h2>

<h3 id="für-menschen-die-kommentieren" data-numberify>Für Menschen, die kommentieren<a class="anchor ms-1" href="#für-menschen-die-kommentieren"></a></h3>
<p>Entweder nach unten scrollen oder rechts auf die Sprechblase (rechts oben im Blogbeitrag) klicken. Dann landet man hier:</p>
<p></p><figure class="image-caption"><picture>
                <source type="image/webp" srcset="/2022/11/kommentare-in-meinem-statischen-blog-via-mastodon/2022-11-01-kommentare-ungeladen_hu94308d496794c6ec792089d0ab8ba6d6_13760_360x0_resize_q95_h2_catmullrom_2.webp 360w,/2022/11/kommentare-in-meinem-statischen-blog-via-mastodon/2022-11-01-kommentare-ungeladen_hu94308d496794c6ec792089d0ab8ba6d6_13760_500x0_resize_q95_h2_catmullrom_2.webp 500w,/2022/11/kommentare-in-meinem-statischen-blog-via-mastodon/2022-11-01-kommentare-ungeladen_hu94308d496794c6ec792089d0ab8ba6d6_13760_816x0_resize_q95_h2_catmullrom_2.webp 816w"
                                          sizes="(max-width: 424px) 360px, (max-width: 596px) 500px, (min-width: 565px) 816px" />
                <img alt="" srcset="/2022/11/kommentare-in-meinem-statischen-blog-via-mastodon/2022-11-01-kommentare-ungeladen_hu94308d496794c6ec792089d0ab8ba6d6_13760_360x0_resize_q95_h2_catmullrom_2.webp 360w, /2022/11/kommentare-in-meinem-statischen-blog-via-mastodon/2022-11-01-kommentare-ungeladen_hu94308d496794c6ec792089d0ab8ba6d6_13760_500x0_resize_q95_h2_catmullrom_2.webp 500w, /2022/11/kommentare-in-meinem-statischen-blog-via-mastodon/2022-11-01-kommentare-ungeladen_hu94308d496794c6ec792089d0ab8ba6d6_13760_816x0_resize_q95_h2_catmullrom_2.webp 816w"
                     sizes="(max-width: 424px) 360px, (max-width: 596px) 500px, (min-width: 565px) 816px"
                     src="/2022/11/kommentare-in-meinem-statischen-blog-via-mastodon/2022-11-01-kommentare-ungeladen_hu94308d496794c6ec792089d0ab8ba6d6_13760_816x0_resize_q95_h2_catmullrom_2.webp" title="" loading="lazy" width="816" height="258" /></picture><figcaption></figcaption></figure><p>
</p>
<p>Dann &ldquo;Kommentare anzeigen (via Mastodon)&rdquo; anklicken:</p>
<p></p><figure class="image-caption"><picture>
                <source type="image/webp" srcset="/2022/11/kommentare-in-meinem-statischen-blog-via-mastodon/2022-11-01-kommentare-geladen_hub77b13ab36b426318ae164eb0f25648e_17800_360x0_resize_q95_h2_catmullrom_2.webp 360w,/2022/11/kommentare-in-meinem-statischen-blog-via-mastodon/2022-11-01-kommentare-geladen_hub77b13ab36b426318ae164eb0f25648e_17800_500x0_resize_q95_h2_catmullrom_2.webp 500w,/2022/11/kommentare-in-meinem-statischen-blog-via-mastodon/2022-11-01-kommentare-geladen_hub77b13ab36b426318ae164eb0f25648e_17800_816x0_resize_q95_h2_catmullrom_2.webp 816w"
                                          sizes="(max-width: 424px) 360px, (max-width: 596px) 500px, (min-width: 565px) 816px" />
                <img alt="" srcset="/2022/11/kommentare-in-meinem-statischen-blog-via-mastodon/2022-11-01-kommentare-geladen_hub77b13ab36b426318ae164eb0f25648e_17800_360x0_resize_q95_h2_catmullrom_2.webp 360w, /2022/11/kommentare-in-meinem-statischen-blog-via-mastodon/2022-11-01-kommentare-geladen_hub77b13ab36b426318ae164eb0f25648e_17800_500x0_resize_q95_h2_catmullrom_2.webp 500w, /2022/11/kommentare-in-meinem-statischen-blog-via-mastodon/2022-11-01-kommentare-geladen_hub77b13ab36b426318ae164eb0f25648e_17800_816x0_resize_q95_h2_catmullrom_2.webp 816w"
                     sizes="(max-width: 424px) 360px, (max-width: 596px) 500px, (min-width: 565px) 816px"
                     src="/2022/11/kommentare-in-meinem-statischen-blog-via-mastodon/2022-11-01-kommentare-geladen_hub77b13ab36b426318ae164eb0f25648e_17800_816x0_resize_q95_h2_catmullrom_2.webp" title="" loading="lazy" width="816" height="310" /></picture><figcaption></figcaption></figure><p>
</p>
<p>Oder einen der oberen Links anklicken, um zu kommentieren oder den Tröt in einem neuen Tab zu öffnen.</p>
<p>Um zu kommentieren, benötigt man entweder einen Mastodon-Account, einen Friendica-Account oder irgend einen anderen Account eines Dienstes des Fediverse.</p>

<h3 id="für-mich-als-betreiber-des-blogs" data-numberify>Für mich als Betreiber des Blogs<a class="anchor ms-1" href="#für-mich-als-betreiber-des-blogs"></a></h3>
<ol>
<li>Blogbeitrag veröffentlichen.</li>
<li>Link zum Blogbeitrag auf Mastodon tröten.</li>
<li>Im veröffentlichen Blogbeitrag im <code>Front Matter</code> einfügen:</li>
</ol>
<div class="highlight"><pre tabindex="0" style="color:#f8f8f2;background-color:#272822;-moz-tab-size:4;-o-tab-size:4;tab-size:4;"><code class="language-yaml" data-lang="yaml"><span style="display:flex;"><span><span style="color:#f92672">comments</span>:
</span></span><span style="display:flex;"><span>  <span style="color:#f92672">host</span>: <span style="color:#ae81ff">social.anoxinon.de</span>
</span></span><span style="display:flex;"><span>  <span style="color:#f92672">username</span>: <span style="color:#ae81ff">natenom</span>
</span></span><span style="display:flex;"><span>  <span style="color:#f92672">id</span>: <span style="color:#ae81ff">123456789</span><span style="color:#ae81ff">…</span>
</span></span></code></pre></div><ol start="4">
<li>Blogbeitrag erneut veröffentlichen mit dem geänderten <code>Front Matter</code>.</li>
</ol>
<p>Die ID ist die lange Zahl am Ende des Links eines Tröts (Toots).</p>
<p>Ich habe bewusst entschieden, den Host immer im Front Matter des Blogbeitrag zu hinterlegen, statt ihn global in der Konfiguration von Hugo zu hinterlegen. Denn es könnte sein, dass ich zukünftig eine andere Instanz verwenden werde und dann sollten bisherige Kommentare weiterhin zugreifbar bleiben.</p>
<p>Der Nachteil dieser Lösung ist, dass es immer etwas dauert (da der Blog neu generiert wird), bis Kommentare im Blog eingebunden werden können, obwohl es bereits einen Tröt auf Mastodon gibt. Das macht aber nichts, da man trotzdem bereits auf Mastodon antworten kann und diese Antworten später auch über den Blog sichtbar sind.</p>
<p><em>(Man könnte auch kurz vor dem Veröffentlichen des Beitrags bereits einen Mastodon-Tröt zum Blogbeitrag schreiben, müsste dann aber das Vorschaubild und den Titel manuell eintragen und würde nur wenig Zeit sparen.)</em></p>

<h2 id="umsetzung-für-meinen-blog" data-numberify>Umsetzung für meinen Blog<a class="anchor ms-1" href="#umsetzung-für-meinen-blog"></a></h2>
<p>Hier die Anleitung, wie wir das mit dem hier verwendeten Theme &ldquo;<a  class='urlextern'  href="https://github.com/razonyang/hugo-theme-bootstrap">Hugo Theme Bootstrap</a>&rdquo; umgesetzt haben.</p>
<p>Wir haben den Quelltext des oben bereits genannten <a  class='urlextern'  href="https://carlschwan.eu/2020/12/29/adding-comments-to-your-static-blog-with-mastodon/">Blogbeitrags</a> an den Blog angepasst.</p>
<div class="shortcode-notice info">
    <div class="shortcode-notice-title info">
        Info</div>
    <div class="notice-content">Vielen Dank an Vri, die dafür gesorgt hat, dass das Ergebnis schön aussieht.</div>
</div>



<h3 id="template" data-numberify>Template<a class="anchor ms-1" href="#template"></a></h3>
<p>Dieser Quelltext kommt in die Datei <code>layouts/partials/post/comments/custom.html</code>:</p>
<div class="shortcode-details">
    <details>
    <summary>Quelltext der Datei</summary>
        <div class="shortcode-details content"><div class="highlight"><pre tabindex="0" style="color:#f8f8f2;background-color:#272822;-moz-tab-size:4;-o-tab-size:4;tab-size:4;"><code class="language-html" data-lang="html"><span style="display:flex;"><span>{{ with .Params.comments }}
</span></span><span style="display:flex;"><span>&lt;<span style="color:#f92672">div</span> <span style="color:#a6e22e">class</span><span style="color:#f92672">=</span><span style="color:#e6db74">&#34;masto-comments datenschutz&#34;</span>&gt;
</span></span><span style="display:flex;"><span>&lt;<span style="color:#f92672">p</span>&gt;&lt;<span style="color:#f92672">a</span> <span style="color:#a6e22e">href</span><span style="color:#f92672">=</span><span style="color:#e6db74">&#34;/ueber/datenschutz/#kommentare&#34;</span>&gt;(Datenschutzinformationen zu Kommentaren via Mastodon)&lt;/<span style="color:#f92672">a</span>&gt;&lt;/<span style="color:#f92672">p</span>&gt;
</span></span><span style="display:flex;"><span>&lt;/<span style="color:#f92672">div</span>&gt;
</span></span><span style="display:flex;"><span>&lt;<span style="color:#f92672">div</span> <span style="color:#a6e22e">id</span><span style="color:#f92672">=</span><span style="color:#e6db74">&#34;mastodon-comments-wrapper&#34;</span>&gt;
</span></span><span style="display:flex;"><span>  &lt;<span style="color:#f92672">div</span> <span style="color:#a6e22e">id</span><span style="color:#f92672">=</span><span style="color:#e6db74">&#34;mastodon-comments-buttons&#34;</span>&gt;
</span></span><span style="display:flex;"><span>    &lt;<span style="color:#f92672">a</span> <span style="color:#a6e22e">class</span><span style="color:#f92672">=</span><span style="color:#e6db74">&#34;btn btn-sm btn-outline-primary&#34;</span> <span style="color:#a6e22e">href</span><span style="color:#f92672">=</span><span style="color:#e6db74">&#34;https://{{ .host }}/interact/{{ .id }}?type=reply&#34;</span> <span style="color:#a6e22e">target</span><span style="color:#f92672">=</span><span style="color:#e6db74">&#34;_blank&#34;</span>&gt;Kommentar schreiben&lt;/<span style="color:#f92672">a</span>&gt;
</span></span><span style="display:flex;"><span>    &lt;<span style="color:#f92672">a</span> <span style="color:#a6e22e">class</span><span style="color:#f92672">=</span><span style="color:#e6db74">&#34;btn btn-sm btn-outline-primary&#34;</span> <span style="color:#a6e22e">href</span><span style="color:#f92672">=</span><span style="color:#e6db74">&#34;https://{{ .host }}/@{{ .username }}/{{ .id }}&#34;</span> <span style="color:#a6e22e">target</span><span style="color:#f92672">=</span><span style="color:#e6db74">&#34;_blank&#34;</span>&gt;Tröt öffnen&lt;/<span style="color:#f92672">a</span>&gt;
</span></span><span style="display:flex;"><span>  &lt;/<span style="color:#f92672">div</span>&gt;
</span></span><span style="display:flex;"><span>  &lt;<span style="color:#f92672">div</span> <span style="color:#a6e22e">id</span><span style="color:#f92672">=</span><span style="color:#e6db74">&#34;mastodon-comments-list&#34;</span>&gt;
</span></span><span style="display:flex;"><span>    &lt;<span style="color:#f92672">button</span> <span style="color:#a6e22e">id</span><span style="color:#f92672">=</span><span style="color:#e6db74">&#34;load-comments&#34;</span> <span style="color:#a6e22e">class</span><span style="color:#f92672">=</span><span style="color:#e6db74">&#34;btn btn-sm btn-primary&#34;</span>&gt;Kommentare anzeigen (via Mastodon)&lt;/<span style="color:#f92672">button</span>&gt;
</span></span><span style="display:flex;"><span>  &lt;/<span style="color:#f92672">div</span>&gt;
</span></span><span style="display:flex;"><span>  &lt;<span style="color:#f92672">noscript</span>&gt;&lt;<span style="color:#f92672">p</span>&gt;Du benötigst JavaScript, um die Kommentare hier anzeigen zu lassen.&lt;/<span style="color:#f92672">p</span>&gt;&lt;/<span style="color:#f92672">noscript</span>&gt;
</span></span><span style="display:flex;"><span>  &lt;<span style="color:#f92672">script</span> <span style="color:#a6e22e">src</span><span style="color:#f92672">=</span><span style="color:#e6db74">&#34;/my_js/purify.min.js&#34;</span>&gt;&lt;/<span style="color:#f92672">script</span>&gt;
</span></span><span style="display:flex;"><span>  &lt;<span style="color:#f92672">script</span>&gt;
</span></span><span style="display:flex;"><span>  document.<span style="color:#a6e22e">getElementById</span>(<span style="color:#e6db74">&#39;load-comments&#39;</span>).<span style="color:#a6e22e">addEventListener</span>(<span style="color:#e6db74">&#39;click&#39;</span>, <span style="color:#a6e22e">loadComment</span>)
</span></span><span style="display:flex;"><span>
</span></span><span style="display:flex;"><span>  <span style="color:#66d9ef">function</span> <span style="color:#a6e22e">escapeHtml</span>(<span style="color:#a6e22e">unsafe</span>) {
</span></span><span style="display:flex;"><span>    <span style="color:#66d9ef">return</span> <span style="color:#a6e22e">unsafe</span>
</span></span><span style="display:flex;"><span>      .<span style="color:#a6e22e">replace</span>(<span style="color:#e6db74">/&amp;/g</span>, <span style="color:#e6db74">&#39;&amp;amp;&#39;</span>)
</span></span><span style="display:flex;"><span>      .<span style="color:#a6e22e">replace</span>(<span style="color:#e6db74">/&lt;/g</span>, <span style="color:#e6db74">&#39;&amp;lt;&#39;</span>)
</span></span><span style="display:flex;"><span>      .<span style="color:#a6e22e">replace</span>(<span style="color:#e6db74">/&gt;/g</span>, <span style="color:#e6db74">&#39;&amp;gt;&#39;</span>)
</span></span><span style="display:flex;"><span>      .<span style="color:#a6e22e">replace</span>(<span style="color:#e6db74">/&#34;/g</span>, <span style="color:#e6db74">&#39;&amp;quot;&#39;</span>)
</span></span><span style="display:flex;"><span>      .<span style="color:#a6e22e">replace</span>(<span style="color:#e6db74">/&#39;/g</span>, <span style="color:#e6db74">&#39;&amp;#039;&#39;</span>);
</span></span><span style="display:flex;"><span>  }
</span></span><span style="display:flex;"><span>
</span></span><span style="display:flex;"><span>  <span style="color:#66d9ef">function</span> <span style="color:#a6e22e">loadComment</span>() {
</span></span><span style="display:flex;"><span>    document.<span style="color:#a6e22e">getElementById</span>(<span style="color:#e6db74">&#39;load-comments&#39;</span>).<span style="color:#a6e22e">innerHTML</span> <span style="color:#f92672">=</span> <span style="color:#e6db74">&#39;Lade …&#39;</span>;
</span></span><span style="display:flex;"><span>    <span style="color:#a6e22e">fetch</span>(<span style="color:#e6db74">&#39;https://{{ .host }}/api/v1/statuses/{{ .id }}/context&#39;</span>)
</span></span><span style="display:flex;"><span>      .<span style="color:#a6e22e">then</span>(<span style="color:#66d9ef">function</span>(<span style="color:#a6e22e">response</span>) {
</span></span><span style="display:flex;"><span>        <span style="color:#66d9ef">return</span> <span style="color:#a6e22e">response</span>.<span style="color:#a6e22e">json</span>();
</span></span><span style="display:flex;"><span>      })
</span></span><span style="display:flex;"><span>      .<span style="color:#a6e22e">then</span>(<span style="color:#66d9ef">function</span>(<span style="color:#a6e22e">data</span>) {
</span></span><span style="display:flex;"><span>      <span style="color:#66d9ef">if</span>(<span style="color:#a6e22e">data</span>[<span style="color:#e6db74">&#39;descendants&#39;</span>] <span style="color:#f92672">&amp;&amp;</span>
</span></span><span style="display:flex;"><span>        Array.<span style="color:#a6e22e">isArray</span>(<span style="color:#a6e22e">data</span>[<span style="color:#e6db74">&#39;descendants&#39;</span>]) <span style="color:#f92672">&amp;&amp;</span> 
</span></span><span style="display:flex;"><span>        <span style="color:#a6e22e">data</span>[<span style="color:#e6db74">&#39;descendants&#39;</span>].<span style="color:#a6e22e">length</span> <span style="color:#f92672">&gt;</span> <span style="color:#ae81ff">0</span>) {
</span></span><span style="display:flex;"><span>        document.<span style="color:#a6e22e">getElementById</span>(<span style="color:#e6db74">&#39;mastodon-comments-list&#39;</span>).<span style="color:#a6e22e">innerHTML</span> <span style="color:#f92672">=</span> <span style="color:#e6db74">&#34;&#34;</span>;
</span></span><span style="display:flex;"><span>        <span style="color:#a6e22e">data</span>[<span style="color:#e6db74">&#39;descendants&#39;</span>].<span style="color:#a6e22e">forEach</span>(<span style="color:#66d9ef">function</span>(<span style="color:#a6e22e">reply</span>) {
</span></span><span style="display:flex;"><span>          <span style="color:#a6e22e">reply</span>.<span style="color:#a6e22e">account</span>.<span style="color:#a6e22e">display_name</span> <span style="color:#f92672">=</span> <span style="color:#a6e22e">escapeHtml</span>(<span style="color:#a6e22e">reply</span>.<span style="color:#a6e22e">account</span>.<span style="color:#a6e22e">display_name</span>);
</span></span><span style="display:flex;"><span>          <span style="color:#a6e22e">reply</span>.<span style="color:#a6e22e">account</span>.<span style="color:#a6e22e">emojis</span>.<span style="color:#a6e22e">forEach</span>(<span style="color:#a6e22e">emoji</span> =&gt; {
</span></span><span style="display:flex;"><span>          <span style="color:#a6e22e">reply</span>.<span style="color:#a6e22e">account</span>.<span style="color:#a6e22e">display_name</span> <span style="color:#f92672">=</span> <span style="color:#a6e22e">reply</span>.<span style="color:#a6e22e">account</span>.<span style="color:#a6e22e">display_name</span>.<span style="color:#a6e22e">replace</span>(<span style="color:#e6db74">`:</span><span style="color:#e6db74">${</span><span style="color:#a6e22e">emoji</span>.<span style="color:#a6e22e">shortcode</span><span style="color:#e6db74">}</span><span style="color:#e6db74">:`</span>,
</span></span><span style="display:flex;"><span>            <span style="color:#e6db74">`&lt;img src=&#34;</span><span style="color:#e6db74">${</span><span style="color:#a6e22e">escapeHtml</span>(<span style="color:#a6e22e">emoji</span>.<span style="color:#a6e22e">static_url</span>)<span style="color:#e6db74">}</span><span style="color:#e6db74">&#34; alt=&#34;Emoji </span><span style="color:#e6db74">${</span><span style="color:#a6e22e">emoji</span>.<span style="color:#a6e22e">shortcode</span><span style="color:#e6db74">}</span><span style="color:#e6db74">&#34; height=&#34;20&#34; width=&#34;20&#34; /&gt;`</span>);
</span></span><span style="display:flex;"><span>          });
</span></span><span style="display:flex;"><span>          <span style="color:#a6e22e">replyCreationDate</span> <span style="color:#f92672">=</span> <span style="color:#66d9ef">new</span> Date(<span style="color:#a6e22e">reply</span>.<span style="color:#a6e22e">created_at</span>).<span style="color:#a6e22e">toLocaleDateString</span>(<span style="color:#66d9ef">undefined</span>, { <span style="color:#a6e22e">day</span><span style="color:#f92672">:</span> <span style="color:#e6db74">&#39;numeric&#39;</span>, <span style="color:#a6e22e">month</span><span style="color:#f92672">:</span> <span style="color:#e6db74">&#39;short&#39;</span>, <span style="color:#a6e22e">hour</span><span style="color:#f92672">:</span> <span style="color:#e6db74">&#39;numeric&#39;</span>, <span style="color:#a6e22e">minute</span><span style="color:#f92672">:</span> <span style="color:#e6db74">&#39;numeric&#39;</span> });
</span></span><span style="display:flex;"><span>          <span style="color:#a6e22e">replyCreationDateLong</span> <span style="color:#f92672">=</span> <span style="color:#66d9ef">new</span> Date(<span style="color:#a6e22e">reply</span>.<span style="color:#a6e22e">created_at</span>).<span style="color:#a6e22e">toLocaleDateString</span>(<span style="color:#66d9ef">undefined</span>, { <span style="color:#a6e22e">day</span><span style="color:#f92672">:</span> <span style="color:#e6db74">&#39;numeric&#39;</span>, <span style="color:#a6e22e">month</span><span style="color:#f92672">:</span> <span style="color:#e6db74">&#39;long&#39;</span>, <span style="color:#a6e22e">year</span><span style="color:#f92672">:</span> <span style="color:#e6db74">&#39;numeric&#39;</span>, <span style="color:#a6e22e">hour</span><span style="color:#f92672">:</span> <span style="color:#e6db74">&#39;numeric&#39;</span>, <span style="color:#a6e22e">minute</span><span style="color:#f92672">:</span> <span style="color:#e6db74">&#39;numeric&#39;</span> });
</span></span><span style="display:flex;"><span>          <span style="color:#a6e22e">mastodonComment</span> <span style="color:#f92672">=</span>
</span></span><span style="display:flex;"><span>          <span style="color:#e6db74">`&lt;div class=&#34;mastodon-comment&#34;&gt;
</span></span></span><span style="display:flex;"><span><span style="color:#e6db74">            &lt;div class=&#34;avatar&#34;&gt;
</span></span></span><span style="display:flex;"><span><span style="color:#e6db74">              &lt;img src=&#34;</span><span style="color:#e6db74">${</span><span style="color:#a6e22e">escapeHtml</span>(<span style="color:#a6e22e">reply</span>.<span style="color:#a6e22e">account</span>.<span style="color:#a6e22e">avatar_static</span>)<span style="color:#e6db74">}</span><span style="color:#e6db74">&#34; alt=&#34;&#34;&gt;
</span></span></span><span style="display:flex;"><span><span style="color:#e6db74">            &lt;/div&gt;
</span></span></span><span style="display:flex;"><span><span style="color:#e6db74">            &lt;div class=&#34;content&#34;&gt;
</span></span></span><span style="display:flex;"><span><span style="color:#e6db74">              &lt;div class=&#34;author-wrapper&#34;&gt;
</span></span></span><span style="display:flex;"><span><span style="color:#e6db74">                &lt;a class=&#34;author&#34; href=&#34;</span><span style="color:#e6db74">${</span><span style="color:#a6e22e">reply</span>.<span style="color:#a6e22e">account</span>.<span style="color:#a6e22e">url</span><span style="color:#e6db74">}</span><span style="color:#e6db74">&#34; rel=&#34;nofollow&#34;&gt;
</span></span></span><span style="display:flex;"><span><span style="color:#e6db74">                  &lt;span class=&#34;author-name&#34;&gt;</span><span style="color:#e6db74">${</span><span style="color:#a6e22e">reply</span>.<span style="color:#a6e22e">account</span>.<span style="color:#a6e22e">display_name</span><span style="color:#e6db74">}</span><span style="color:#e6db74">&lt;/span&gt;
</span></span></span><span style="display:flex;"><span><span style="color:#e6db74">                  &lt;span class=&#34;author-handle&#34;&gt;</span><span style="color:#e6db74">${</span><span style="color:#a6e22e">escapeHtml</span>(<span style="color:#a6e22e">reply</span>.<span style="color:#a6e22e">account</span>.<span style="color:#a6e22e">acct</span>)<span style="color:#e6db74">}</span><span style="color:#e6db74">&lt;/span&gt;
</span></span></span><span style="display:flex;"><span><span style="color:#e6db74">                &lt;/a&gt;
</span></span></span><span style="display:flex;"><span><span style="color:#e6db74">                &lt;a class=&#34;date&#34; href=&#34;</span><span style="color:#e6db74">${</span><span style="color:#a6e22e">reply</span>.<span style="color:#a6e22e">uri</span><span style="color:#e6db74">}</span><span style="color:#e6db74">&#34; rel=&#34;nofollow&#34; title=&#34;</span><span style="color:#e6db74">${</span><span style="color:#a6e22e">replyCreationDateLong</span><span style="color:#e6db74">}</span><span style="color:#e6db74">&#34;&gt;
</span></span></span><span style="display:flex;"><span><span style="color:#e6db74">                  </span><span style="color:#e6db74">${</span><span style="color:#a6e22e">replyCreationDate</span><span style="color:#e6db74">}</span><span style="color:#e6db74">
</span></span></span><span style="display:flex;"><span><span style="color:#e6db74">                &lt;/a&gt;
</span></span></span><span style="display:flex;"><span><span style="color:#e6db74">              &lt;/div&gt;
</span></span></span><span style="display:flex;"><span><span style="color:#e6db74">              &lt;div class=&#34;mastodon-comment-content&#34;&gt;</span><span style="color:#e6db74">${</span><span style="color:#a6e22e">reply</span>.<span style="color:#a6e22e">content</span><span style="color:#e6db74">}</span><span style="color:#e6db74">&lt;/div&gt; 
</span></span></span><span style="display:flex;"><span><span style="color:#e6db74">            &lt;/div&gt;
</span></span></span><span style="display:flex;"><span><span style="color:#e6db74">          &lt;/div&gt;`</span>;
</span></span><span style="display:flex;"><span>          document.<span style="color:#a6e22e">getElementById</span>(<span style="color:#e6db74">&#39;mastodon-comments-list&#39;</span>).<span style="color:#a6e22e">appendChild</span>(<span style="color:#a6e22e">DOMPurify</span>.<span style="color:#a6e22e">sanitize</span>(<span style="color:#a6e22e">mastodonComment</span>, {<span style="color:#e6db74">&#39;RETURN_DOM_FRAGMENT&#39;</span><span style="color:#f92672">:</span> <span style="color:#66d9ef">true</span>}));
</span></span><span style="display:flex;"><span>        });
</span></span><span style="display:flex;"><span>      } <span style="color:#66d9ef">else</span> {
</span></span><span style="display:flex;"><span>          document.<span style="color:#a6e22e">getElementById</span>(<span style="color:#e6db74">&#39;mastodon-comments-list&#39;</span>).<span style="color:#a6e22e">innerHTML</span> <span style="color:#f92672">=</span> <span style="color:#e6db74">&#34;&lt;p&gt;Keine Kommentare gefunden&lt;/p&gt;&#34;</span>;
</span></span><span style="display:flex;"><span>      }
</span></span><span style="display:flex;"><span>    });
</span></span><span style="display:flex;"><span>  };
</span></span><span style="display:flex;"><span>  &lt;/<span style="color:#f92672">script</span>&gt;
</span></span><span style="display:flex;"><span>&lt;/<span style="color:#f92672">div</span>&gt;
</span></span><span style="display:flex;"><span>{{ else }}
</span></span><span style="display:flex;"><span>&lt;<span style="color:#f92672">p</span> <span style="color:#a6e22e">class</span><span style="color:#f92672">=</span><span style="color:#e6db74">&#34;mastodon-comments nocomment&#34;</span>&gt;Kommentare sind für diesen Blogbeitrag (noch) nicht aktiviert. Nach der Veröffentlichung eines Blogbeitrags dauert das in der Regel noch ein paar Minuten.&lt;/<span style="color:#f92672">p</span>&gt;
</span></span><span style="display:flex;"><span>{{ end }}
</span></span><span style="display:flex;"><span>&lt;<span style="color:#f92672">p</span>&gt;&lt;<span style="color:#f92672">details</span> <span style="color:#a6e22e">class</span><span style="color:#f92672">=</span><span style="color:#e6db74">&#34;mastodon-comments email&#34;</span>&gt;
</span></span><span style="display:flex;"><span>  &lt;<span style="color:#f92672">summary</span> <span style="color:#a6e22e">class</span><span style="color:#f92672">=</span><span style="color:#e6db74">&#34;mastodon-comments email-summary&#34;</span>&gt;Alternative: Anmerkung per E-Mail&lt;/<span style="color:#f92672">summary</span>&gt;
</span></span><span style="display:flex;"><span>  &lt;<span style="color:#f92672">div</span> <span style="color:#a6e22e">class</span><span style="color:#f92672">=</span><span style="color:#e6db74">&#34;mastodon-comments emailcontent&#34;</span>&gt;
</span></span><span style="display:flex;"><span>    &lt;<span style="color:#f92672">p</span>&gt;Du kannst mir Anmerkungen zum Blogbeitrag per E-Mail schicken, &lt;<span style="color:#f92672">a</span> <span style="color:#a6e22e">href</span><span style="color:#f92672">=</span><span style="color:#e6db74">&#39;mailto:user@tld.org?subject=Anmerkung zum Blog&amp;body=Hallo Natenom. Zum Blogbeitrag &#34;{{ $.Page.Permalink }}&#34; habe ich eine Anmerkung:&#39;</span>&gt;wenn du hier klickst&lt;/<span style="color:#f92672">a</span>&gt;. Der Inhalt davon bleibt privat und wird nicht hier im Kommentarbereich veröffentlicht.&lt;/<span style="color:#f92672">p</span>&gt;
</span></span><span style="display:flex;"><span>  &lt;/<span style="color:#f92672">div</span>&gt;
</span></span><span style="display:flex;"><span>&lt;/<span style="color:#f92672">details</span>&gt;&lt;/<span style="color:#f92672">p</span>&gt;
</span></span></code></pre></div></div>
    </details>
</div>

<div class="shortcode-notice info">
    <div class="shortcode-notice-title info">
        Info</div>
    <div class="notice-content">Der Inhalt des <a  class='urlextern'  href="https://carlschwan.eu/2020/12/29/adding-comments-to-your-static-blog-with-mastodon/">Blogbeitrags</a>, von dem ich den oberen Quelltext entnommen habe, ist lizensiert unter Creative Commons BY-SA 4.0. Daher gehe ich davon aus, dass auch der dort gelistete Quelltext unter diese Lizenz fällt. Sollte dem nicht so sein, so bitte ich um eine Nachricht. Entsprechend steht der hier angepasste Quelltext unter der selben Lizenz zur Verfügung.</div>
</div>



<h3 id="css" data-numberify>CSS<a class="anchor ms-1" href="#css"></a></h3>
<p>Das SCSS kommt in die Datei <code>assets/main/scss/_custom.scss</code>:</p>
<div class="shortcode-details">
    <details>
    <summary>CSS für die Kommentarfunktion</summary>
        <div class="shortcode-details content"><div class="highlight"><pre tabindex="0" style="color:#f8f8f2;background-color:#272822;-moz-tab-size:4;-o-tab-size:4;tab-size:4;"><code class="language-scss" data-lang="scss"><span style="display:flex;"><span><span style="color:#75715e">/* Für Kommentar, die von Mastodon geladen werden. :) */</span>
</span></span><span style="display:flex;"><span>#mastodon-comments-wrapper {
</span></span><span style="display:flex;"><span>	#mastodon-comments-buttons {
</span></span><span style="display:flex;"><span>		<span style="color:#a6e22e">margin-bottom</span><span style="color:#f92672">:</span> <span style="color:#ae81ff">0</span><span style="color:#ae81ff">.5</span><span style="color:#66d9ef">em</span>;
</span></span><span style="display:flex;"><span>	}
</span></span><span style="display:flex;"><span>	#mastodon-comments-list {
</span></span><span style="display:flex;"><span>		<span style="color:#f92672">button</span>#load-comments {
</span></span><span style="display:flex;"><span>			<span style="color:#a6e22e">border</span><span style="color:#f92672">:</span> <span style="color:#ae81ff">0</span>;
</span></span><span style="display:flex;"><span>			<span style="color:#a6e22e">border-radius</span><span style="color:#f92672">:</span> <span style="color:#a6e22e">var</span>(<span style="color:#f92672">--</span><span style="color:#e6db74">#{</span>$prefix<span style="color:#e6db74">}</span>border-radius);
</span></span><span style="display:flex;"><span>			<span style="color:#a6e22e">background-color</span><span style="color:#f92672">:</span> <span style="color:#a6e22e">var</span>(<span style="color:#f92672">--</span><span style="color:#e6db74">#{</span>$prefix<span style="color:#e6db74">}</span>btn-border-color);
</span></span><span style="display:flex;"><span>			<span style="color:#a6e22e">margin</span><span style="color:#f92672">:</span> <span style="color:#ae81ff">0</span> auto;
</span></span><span style="display:flex;"><span>		}
</span></span><span style="display:flex;"><span>		<span style="color:#a6e22e">.mastodon-comment</span> {
</span></span><span style="display:flex;"><span>			<span style="color:#a6e22e">display</span><span style="color:#f92672">:</span> grid;
</span></span><span style="display:flex;"><span>			<span style="color:#a6e22e">grid-gap</span><span style="color:#f92672">:</span> <span style="color:#ae81ff">1</span><span style="color:#66d9ef">em</span>;
</span></span><span style="display:flex;"><span>			<span style="color:#a6e22e">grid-template-columns</span><span style="color:#f92672">:</span> auto <span style="color:#ae81ff">1</span><span style="color:#66d9ef">fr</span>;
</span></span><span style="display:flex;"><span>			<span style="color:#a6e22e">.avatar</span> <span style="color:#f92672">img</span> {
</span></span><span style="display:flex;"><span>				<span style="color:#a6e22e">border-radius</span><span style="color:#f92672">:</span> <span style="color:#a6e22e">var</span>(<span style="color:#f92672">--</span><span style="color:#e6db74">#{</span>$prefix<span style="color:#e6db74">}</span>border-radius);
</span></span><span style="display:flex;"><span>				<span style="color:#a6e22e">position</span><span style="color:#f92672">:</span> relative;
</span></span><span style="display:flex;"><span>				<span style="color:#a6e22e">top</span><span style="color:#f92672">:</span> <span style="color:#ae81ff">6</span><span style="color:#66d9ef">px</span>;
</span></span><span style="display:flex;"><span>				<span style="color:#a6e22e">width</span><span style="color:#f92672">:</span> <span style="color:#ae81ff">48</span><span style="color:#66d9ef">px</span>;
</span></span><span style="display:flex;"><span>			}
</span></span><span style="display:flex;"><span>			<span style="color:#a6e22e">.content</span> {
</span></span><span style="display:flex;"><span>				<span style="color:#a6e22e">.author-wrapper</span> {
</span></span><span style="display:flex;"><span>					<span style="color:#a6e22e">.author</span> {
</span></span><span style="display:flex;"><span>						<span style="color:#a6e22e">.author-name</span> {
</span></span><span style="display:flex;"><span>							<span style="color:#a6e22e">font-weight</span><span style="color:#f92672">:</span> bold;
</span></span><span style="display:flex;"><span>						}
</span></span><span style="display:flex;"><span>						<span style="color:#66d9ef">&amp;</span><span style="color:#a6e22e">:hover</span> {
</span></span><span style="display:flex;"><span>							<span style="color:#a6e22e">color</span><span style="color:#f92672">:</span> <span style="color:#a6e22e">var</span>(<span style="color:#f92672">--</span>hbs-link-color);
</span></span><span style="display:flex;"><span>							<span style="color:#a6e22e">text-decoration</span><span style="color:#f92672">:</span> none;
</span></span><span style="display:flex;"><span>							<span style="color:#a6e22e">.author-name</span> {
</span></span><span style="display:flex;"><span>								<span style="color:#a6e22e">color</span><span style="color:#f92672">:</span> <span style="color:#a6e22e">var</span>(<span style="color:#f92672">--</span>hbs-link-hover-color);
</span></span><span style="display:flex;"><span>								<span style="color:#a6e22e">text-decoration</span><span style="color:#f92672">:</span> underline;
</span></span><span style="display:flex;"><span>							}
</span></span><span style="display:flex;"><span>						}
</span></span><span style="display:flex;"><span>					}
</span></span><span style="display:flex;"><span>					<span style="color:#a6e22e">.date</span> {
</span></span><span style="display:flex;"><span>						<span style="color:#a6e22e">float</span><span style="color:#f92672">:</span> right;
</span></span><span style="display:flex;"><span>					}
</span></span><span style="display:flex;"><span>				}
</span></span><span style="display:flex;"><span>			}
</span></span><span style="display:flex;"><span>		}
</span></span><span style="display:flex;"><span>	}
</span></span><span style="display:flex;"><span>}
</span></span></code></pre></div></div>
    </details>
</div>


<h3 id="javascript" data-numberify>JavaScript<a class="anchor ms-1" href="#javascript"></a></h3>
<p>Es wird die Bibliothek <a  class='urlextern'  href="https://github.com/cure53/DOMPurify">DomPurify</a> benötigt. Die steht unter einer freien <a  class='urlextern'  href="https://github.com/cure53/DOMPurify/blob/main/LICENSE">Lizenz</a> zur Verfügung und kann somit verwendet werden.</p>
<p>Die Datei habe ich heruntergeladen und nach <code>static/my_js/purify.min.js</code> abgelegt.</p>

<h3 id="header-auf-dem-webserver" data-numberify>Header (auf dem Webserver)<a class="anchor ms-1" href="#header-auf-dem-webserver"></a></h3>
<p>Auf meinem Server sind die Header für den Blog relativ streng eingestellt.</p>
<p>Damit JavaScript Daten von extern laden darf, musste der Header in der Nginx-Konfiguration von:</p>
<div class="highlight"><pre tabindex="0" style="color:#f8f8f2;background-color:#272822;-moz-tab-size:4;-o-tab-size:4;tab-size:4;"><code class="language-nginx" data-lang="nginx"><span style="display:flex;"><span><span style="color:#66d9ef">Eadd_header</span> <span style="color:#e6db74">Content-Security-Policy</span> <span style="color:#e6db74">&#34;default-src</span> <span style="color:#e6db74">&#39;none&#39;</span>; <span style="color:#66d9ef">font-src</span> <span style="color:#e6db74">&#39;self&#39;</span>; <span style="color:#66d9ef">connect-src</span> <span style="color:#e6db74">&#39;self&#39;</span>; <span style="color:#66d9ef">form-action</span> <span style="color:#e6db74">&#39;self&#39;</span>; <span style="color:#66d9ef">img-src</span> <span style="color:#e6db74">&#39;self&#39;</span> <span style="color:#e6db74">data:</span> <span style="color:#e6db74">https://*.natenom.com</span> <span style="color:#e6db74">https://*.natenom.de</span>; <span style="color:#66d9ef">media-src</span> <span style="color:#e6db74">https://*.natenom.com</span> <span style="color:#e6db74">https://*.natenom.de</span>; <span style="color:#66d9ef">script-src</span> <span style="color:#e6db74">&#39;self&#39;</span> <span style="color:#e6db74">&#39;unsafe-inline&#39;</span>; <span style="color:#66d9ef">style-src</span> <span style="color:#e6db74">&#39;self&#39;</span> <span style="color:#e6db74">&#39;unsafe-inline&#39;</span>; <span style="color:#66d9ef">frame-ancestors</span> <span style="color:#e6db74">&#39;none&#39;</span>;<span style="color:#66d9ef">&#34;</span>;
</span></span></code></pre></div><p>geändert werden nach:</p>
<div class="highlight"><pre tabindex="0" style="color:#f8f8f2;background-color:#272822;-moz-tab-size:4;-o-tab-size:4;tab-size:4;"><code class="language-nginx" data-lang="nginx"><span style="display:flex;"><span><span style="color:#66d9ef">Eadd_header</span> <span style="color:#e6db74">Content-Security-Policy</span> <span style="color:#e6db74">&#34;default-src</span> <span style="color:#e6db74">&#39;none&#39;</span>; <span style="color:#66d9ef">font-src</span> <span style="color:#e6db74">&#39;self&#39;</span>; <span style="color:#66d9ef">connect-src</span> <span style="color:#e6db74">&#39;self&#39;</span> <span style="color:#e6db74">https://social.anoxinon.de</span>; <span style="color:#66d9ef">form-action</span> <span style="color:#e6db74">&#39;self&#39;</span>; <span style="color:#66d9ef">img-src</span> <span style="color:#e6db74">&#39;self&#39;</span> <span style="color:#e6db74">https://social.anoxinon.de</span> <span style="color:#e6db74">data:</span> <span style="color:#e6db74">https://*.natenom.com</span> <span style="color:#e6db74">https://*.natenom.de</span>; <span style="color:#66d9ef">media-src</span> <span style="color:#e6db74">https://*.natenom.com</span> <span style="color:#e6db74">https://*.natenom.de</span>; <span style="color:#66d9ef">script-src</span> <span style="color:#e6db74">&#39;self&#39;</span> <span style="color:#e6db74">&#39;unsafe-inline&#39;</span>; <span style="color:#66d9ef">style-src</span> <span style="color:#e6db74">&#39;self&#39;</span> <span style="color:#e6db74">&#39;unsafe-inline&#39;</span>; <span style="color:#66d9ef">frame-ancestors</span> <span style="color:#e6db74">&#39;none&#39;</span>;<span style="color:#66d9ef">&#34;</span>;
</span></span></code></pre></div><p>Sowohl im Bereich <code>connect-src</code> als auch bei <code>img-src</code> musste die Domain der Mastodon-Instanz eingetragen werden.</p>

<h3 id="datenschutz" data-numberify>Datenschutz<a class="anchor ms-1" href="#datenschutz"></a></h3>
<p>Die Informationen zum Datenschutz wurden um den Bereich &ldquo;Kommentare&rdquo; erweitert, <a  href="/ueber/datenschutz/#kommentare">siehe hier</a>.</p>

<h2 id="was-noch-fehlt" data-numberify>Was noch fehlt<a class="anchor ms-1" href="#was-noch-fehlt"></a></h2>

<h3 id="tröts-für-kommentarfunktion-nicht-automatisch-löschen-lassen" data-numberify>Tröts für Kommentarfunktion nicht automatisch löschen lassen<a class="anchor ms-1" href="#tröts-für-kommentarfunktion-nicht-automatisch-löschen-lassen"></a></h3>
<p>Meine Mastodon-Tröts werden bei mir derzeit nach einem Monat automatisch gelöscht. Kommentare würden so nach dieser Zeit nicht mehr angezeigt werden.</p>
<p>Es ist jedoch in Mastodon einstellbar, dass bestimmte Tröts nicht gelöscht werden, z. B. solche, die man zu den Lesezeichen hinzugefügt hat. Dadurch könnte ich die Lesezeichen-Funktion aber nicht mehr für andere Inhalte benutzen.</p>
<p>Eine Alternative wäre, die Automatisch-Löschen-Funktion von Mastodon nicht mehr zu verwenden und stattdessen ein externes Script (<a  href="/2021/03/alte-toots-eines-mastodon-accounts-automatisiert-loeschen/">siehe hier</a>). Dieses Tool könnte man so konfigurieren, dass es keine Toots löscht, die ein bestimmtes Hashtag beinhalten.</p>

<h3 id="eingerückt" data-numberify>Eingerückt<a class="anchor ms-1" href="#eingerückt"></a></h3>
<p>Es wäre schön, wenn auch auf der Seite erkennbar wäre, auf welchen Mastodon-Tröt genau jemand geantwortet hat. Die Reihenfolge passt zwar schon, aber die Einrückungen fehlen noch.</p>]]></content:encoded></item><item><title>Auswirkungen der Dezentralität von Mastodon und Fediverse – Traffic und Last für Webserver</title><link>https://natenom.de/2022/05/auswirkungen-von-dezentralitaet-mastodon-fediverse-traffic-und-last-fuer-webserver/</link><pubDate>Tue, 03 May 2022 12:28:47 +0200</pubDate><guid>https://natenom.de/2022/05/auswirkungen-von-dezentralitaet-mastodon-fediverse-traffic-und-last-fuer-webserver/</guid><description><![CDATA[<p>Wenn man z. B. auf Twitter einen Blogbeitrag teilt, dann prüft der Twitter-Bot, ob es Meta-Angaben wie <code>twitter:image</code> und <code>twitter:description</code> im HTML-Quelltext des Blogbeitrags gibt, um anhand dieser Information das genannte Coverbild vom Server abzurufen und auf der eigenen Plattform mit Vorschaubild und Textauszug darzustellen.</p>
<p><a  class='urlextern'  href="https://developer.twitter.com/en/docs/twitter-for-websites/cards/overview/abouts-cards">Twitter Cards</a> nennt sich dieser Standard. Daneben gibt es noch den Standard &ldquo;<a  class='urlextern'  href="https://ogp.me/">Open Graph</a>&rdquo; (<code>og:image</code> und <code>og:description</code>), den Facebook verwendet, aber auch Mastodon und Friendica.</p>]]></description><content:encoded><![CDATA[<p>Wenn man z. B. auf Twitter einen Blogbeitrag teilt, dann prüft der Twitter-Bot, ob es Meta-Angaben wie <code>twitter:image</code> und <code>twitter:description</code> im HTML-Quelltext des Blogbeitrags gibt, um anhand dieser Information das genannte Coverbild vom Server abzurufen und auf der eigenen Plattform mit Vorschaubild und Textauszug darzustellen.</p>
<p><a  class='urlextern'  href="https://developer.twitter.com/en/docs/twitter-for-websites/cards/overview/abouts-cards">Twitter Cards</a> nennt sich dieser Standard. Daneben gibt es noch den Standard &ldquo;<a  class='urlextern'  href="https://ogp.me/">Open Graph</a>&rdquo; (<code>og:image</code> und <code>og:description</code>), den Facebook verwendet, aber auch Mastodon und Friendica.</p>
<p>Im Fall von Facebook und Twitter holt sich deren Bot das einmalig vom Webserver ab, auf dem der Blog ausgeliefert wird.</p>
<p>Und was passiert in einem Netzwerk aus hunderten und möglicherweise tausenden von Instanzen? Richtig, jede Instanz macht das selbe wie Twitter und Facebook.</p>

<h2 id="last-für-den-webserver" data-numberify>Last für den Webserver<a class="anchor ms-1" href="#last-für-den-webserver"></a></h2>
<p>Nachdem ich heute einen Blogbeitrag auf Mastodon verlinkt hatte, habe ich danach die Logs des Webservers ausgewertet mit dem Befehl:</p>
<pre><code>cat blog.log | cut -d'&quot;' -f 6 | grep -E -i &quot;friendica|mastodon&quot; | grep -v Bot | sort | uniq
</code></pre>
<p>Ergebnis:</p>
<pre><code>[…]
http.rb/5.0.4 (Mastodon/3.5.1; +https://floss.social/)
[…]
http.rb/5.0.4 (Mastodon/3.5.1; +https://freiburg.social/)
http.rb/5.0.4 (Mastodon/3.5.1; +https://graz.social/)
http.rb/5.0.4 (Mastodon/3.5.1; +https://hannover.social/)
[…]
http.rb/5.0.4 (Mastodon/3.5.1; +https://hessen.social/)
[…]
</code></pre>
<p>Insgesamt waren es 110 verschiedene Instanzen. Das bedeutet, dass 110 mal der Quelltext des Blogbeitrags und das Coverbild heruntergeladen wurden. Man sollte daher gut wählen, wie groß das Coverbild ist.</p>

<h2 id="skaliert-nicht-gut" data-numberify>Skaliert nicht gut<a class="anchor ms-1" href="#skaliert-nicht-gut"></a></h2>
<p>Ich habe einen relativ kleinen Account auf Mastodon mit um 680 Followern. Was aber, wenn jemand viele Tausend oder gar Millionen Follower hat, die auf tausenden verschiedenen Instanzen sind? Das skaliert dann vermutlich irgendwann nicht mehr sehr gut.</p>
<p>Angenommen, ein Coverbild wäre 1 MB groß und es würden 3000 Instanzen abrufen, dann hätte man nur für das Verlinken eines Blogbeitrags schon 3 GB Traffic verursacht. Dazu kommt, dass die Bots der Instanzen ziemlich zur selben Zeit alles abrufen. Ich habe das live im Log des Webservers verfolgt und das ballert da ordentlich durch.</p>

<h2 id="lösung" data-numberify>Lösung?<a class="anchor ms-1" href="#lösung"></a></h2>
<p>Eine Idee von jemandem auf Mastodon war, dass die Mastodon Instanz, auf dem man den Blogbeitrag zuerst teilt, selbst eine Vorschau und den Text dazu erstellt und die anderen Instanzen das dort abholen. Das würde die Last aber nur vom Webserver weg und hin zu der Instanz des Benutzers verschieben. Besser wäre es, wenn man das auf verschiedene Server verteilen könnte.</p>]]></content:encoded></item><item><title>Mastodon kann (alte) Toots/Boosts/Favoriten selbst löschen (ohne Zusatztools)</title><link>https://natenom.de/2022/04/mastodon-kann-selbst-automatisch-loeschen/</link><pubDate>Fri, 29 Apr 2022 10:09:36 +0200</pubDate><guid>https://natenom.de/2022/04/mastodon-kann-selbst-automatisch-loeschen/</guid><description><![CDATA[<p>Letztes Jahr <a  href="/2021/03/alte-toots-eines-mastodon-accounts-automatisiert-loeschen/">hatte ich beschrieben</a>, wie man mit dem Tool <code>ephemetoot</code> automatisch alte Toots/Boosts/Likes in Mastodon löschen lassen kann.</p>
<p>Vor wenigen Tagen habe ich erfahren <sup id="fnref:1"><a href="#fn:1" class="footnote-ref" role="doc-noteref">1</a></sup>, dass das mittlerweile gar nicht mehr nötig ist, denn man kann das Löschen auch direkt im Interface von Mastodon konfigurieren.</p>]]></description><content:encoded><![CDATA[<p>Letztes Jahr <a  href="/2021/03/alte-toots-eines-mastodon-accounts-automatisiert-loeschen/">hatte ich beschrieben</a>, wie man mit dem Tool <code>ephemetoot</code> automatisch alte Toots/Boosts/Likes in Mastodon löschen lassen kann.</p>
<p>Vor wenigen Tagen habe ich erfahren <sup id="fnref:1"><a href="#fn:1" class="footnote-ref" role="doc-noteref">1</a></sup>, dass das mittlerweile gar nicht mehr nötig ist, denn man kann das Löschen auch direkt im Interface von Mastodon konfigurieren.</p>
<p>Die Konfiguration dazu finden sich in <code>Einstellungen -&gt; Automatische Löschung</code>.</p>
<p>Verfügbar sind:</p>
<ul>
<li>Altersgrenze</li>
<li>Ausnahmen:
<ul>
<li>Angeheftete Beiträge behalten (Löscht keine deiner angehefteten Beiträge)</li>
<li>Direktnachrichten behalten (Löscht keine deiner Direktnachrichten)</li>
<li>Behalte die von dir favorisierten Beiträge (Löscht nicht deine eigenen Beiträge, wenn du sie favorisiert hast)</li>
<li>Als Lesezeichen markierte Beiträge behalten (Löscht nicht deine eigenen Beiträge, wenn du sie als Lesezeichen markiert hast)</li>
<li>Umfragen behalten (Löscht keine deiner Umfragen)</li>
<li>Beiträge mit Medienanhängen behalten (Löscht keine Ihrer Beiträge mit Medienanhängen)</li>
</ul>
</li>
<li>Ausnahmen basierend auf Interaktionen:
<ul>
<li>Behalte Beiträge, die öfter favorisiert wurden als (Löscht keine deiner Beiträge, die mehr als diese Anzahl an Favoriten erhalten haben. Leer lassen, um Beiträge zu löschen, unabhängig von ihrer Anzahl an Favoriten)</li>
<li>Behalte Beiträge, die öfter geteilt wurden als (Löscht keine deiner Beiträge, die mehr als diese Anzahl geteilt wurden. Lasse leer, um Beiträge zu löschen, unabhängig von ihrer Anzahl an Boosts)</li>
</ul>
</li>
</ul>
<p>Eine Wichtige Information gibt es zum Löschen auch noch: &ldquo;Da das Löschen von Beiträgen eine kostspielige Operation ist, geschieht dies langsam im Laufe der Zeit, wenn der Server sonst nicht beschäftigt ist. Aus diesem Grund können deine Beiträge gelöscht werden, eine Weile nachdem sie die Altersgrenze erreicht haben.&rdquo;</p>
<p>Und so habe ich es eingestellt:</p>
<p></p><figure class="image-caption"><picture>
                <source type="image/webp" srcset="/2022/04/mastodon-kann-selbst-automatisch-loeschen/2022-04-29-mastodon-automatische-loeschung-cover_hu18837ba79dfe056e4310dad14e690c57_137211_360x0_resize_q95_h2_catmullrom_3.webp 360w,/2022/04/mastodon-kann-selbst-automatisch-loeschen/2022-04-29-mastodon-automatische-loeschung-cover_hu18837ba79dfe056e4310dad14e690c57_137211_500x0_resize_q95_h2_catmullrom_3.webp 500w,/2022/04/mastodon-kann-selbst-automatisch-loeschen/2022-04-29-mastodon-automatische-loeschung-cover_hu18837ba79dfe056e4310dad14e690c57_137211_816x0_resize_q95_h2_catmullrom_3.webp 816w"
                                          sizes="(max-width: 424px) 360px, (max-width: 596px) 500px, (min-width: 565px) 816px" />
                <img alt="Screenshot der Einstellungsmöglichkeiten für das automatische Löschen von Toots/Boosts/Likes im Mastodon Konto" srcset="/2022/04/mastodon-kann-selbst-automatisch-loeschen/2022-04-29-mastodon-automatische-loeschung-cover_hu18837ba79dfe056e4310dad14e690c57_137211_360x0_resize_q95_h2_catmullrom_3.webp 360w, /2022/04/mastodon-kann-selbst-automatisch-loeschen/2022-04-29-mastodon-automatische-loeschung-cover_hu18837ba79dfe056e4310dad14e690c57_137211_500x0_resize_q95_h2_catmullrom_3.webp 500w, /2022/04/mastodon-kann-selbst-automatisch-loeschen/2022-04-29-mastodon-automatische-loeschung-cover_hu18837ba79dfe056e4310dad14e690c57_137211_816x0_resize_q95_h2_catmullrom_3.webp 816w"
                     sizes="(max-width: 424px) 360px, (max-width: 596px) 500px, (min-width: 565px) 816px"
                     src="/2022/04/mastodon-kann-selbst-automatisch-loeschen/2022-04-29-mastodon-automatische-loeschung-cover_hu18837ba79dfe056e4310dad14e690c57_137211_816x0_resize_q95_h2_catmullrom_3.webp" title="" loading="lazy" width="816" height="712" /></picture><figcaption></figcaption></figure><p>
</p>
<div class="footnotes" role="doc-endnotes">
<hr>
<ol>
<li id="fn:1">
<p>Ich würde gerne erwähnen, wer mir das geschrieben hat, leider ist die Suche bei Mastodon nicht hilfreich. Melden, wenn bekannt. Danke.&#160;<a href="#fnref:1" class="footnote-backref" role="doc-backlink">&#x21a9;&#xfe0e;</a></p>
</li>
</ol>
</div>]]></content:encoded><enclosure url="https://natenom.de/2022/04/mastodon-kann-selbst-automatisch-loeschen/2022-04-29-mastodon-automatische-loeschung-cover.png" length="137211" type="image/png"/></item><item><title>PeerTube statt YouTube</title><link>https://natenom.de/2022/03/peertube-statt-youtube/</link><pubDate>Sun, 06 Mar 2022 18:36:59 +0100</pubDate><guid>https://natenom.de/2022/03/peertube-statt-youtube/</guid><description><![CDATA[<p>Ich habe endlich meinen Youtube-Account gelöscht, den ich nie wirklich genutzt hatte. Es waren lediglich 4 Videos aus meiner Beitragsreihe &ldquo;<a  href="/tags/raaadweeeg/">Raaadweeeg</a>&rdquo; drauf, in der ich für bestimmte Strecken von A nach B die gute Infrastruktur &ldquo;Landstraße&rdquo; mit der schlechten Infrastruktur &ldquo;Waldweg, Feldweg, usw.&rdquo; vergleiche.</p>]]></description><content:encoded><![CDATA[<p>Ich habe endlich meinen Youtube-Account gelöscht, den ich nie wirklich genutzt hatte. Es waren lediglich 4 Videos aus meiner Beitragsreihe &ldquo;<a  href="/tags/raaadweeeg/">Raaadweeeg</a>&rdquo; drauf, in der ich für bestimmte Strecken von A nach B die gute Infrastruktur &ldquo;Landstraße&rdquo; mit der schlechten Infrastruktur &ldquo;Waldweg, Feldweg, usw.&rdquo; vergleiche.</p>
<p>Mit den wenigen Videos bin ich jetzt zu einer PeerTube-Instanz gewechselt.</p>
<p>Mal sehen, ob ich das in Zukunft mehr nutzen werde.</p>

<h2 id="peertube-instanz-finden" data-numberify>PeerTube-Instanz finden<a class="anchor ms-1" href="#peertube-instanz-finden"></a></h2>
<p>Auf dieser Webseite kann man eine passende PeerTube-Instanz anhand bestimmter Kriterien finden: <a  class='urlextern'  href="https://joinpeertube.org/instances">joinpeertube.org/instances</a>. Ich habe mich für <a  class='urlextern'  href="https://tube.tchncs.de/">tube.tchncs.de</a> entschieden.</p>
<div class="shortcode-notice hinweis">
    <div class="shortcode-notice-title hinweis">
        Hinweis</div>
    <div class="notice-content"><p>Während Anbieter wie YouTube ihr Angebot dadurch finanzieren, dass ihr das Produkt seid und euch mit Werbung volldröhnen, sind Betreiber von PeerTube-Instanzen oder auch anderen Fediverse-Diensten oftmals darauf angewiesen, dass die Benutzer die Kosten tragen.</p>
<p>Schaut daher bitte auch mal bei der verwendeten Instanz eurer Dienste nach, ob ihr die Betreiber finanziell unterstützen könnt.</p>
</div>
</div>

<h2 id="vorteile-gegenüber-selbsthosten" data-numberify>Vorteile gegenüber Selbsthosten<a class="anchor ms-1" href="#vorteile-gegenüber-selbsthosten"></a></h2>
<p>Ich hatte in der Vergangenheit schon überlegt, die Videos selbst zu hosten, es aber aus mehreren Gründen nicht getan. Hier die beiden Hauptgründe, die für PeerTube sprechen:</p>
<ul>
<li>Es gibt Untertitel. Man kann zum Video pro Sprache eine <code>.srt</code>-Datei hochladen. Im Gegensatz zu YouTube muss man diese jedoch mit einem beliebigen Tool offline erstellen. Bei YouTube geht das online im Video-Editor. Hier muss ich mich noch mal länger mit beschäftigen und ein passendes Tool finden.</li>
<li>Traffic. Wenn sich z. B. 50 Menschen ein Video mit 1 GB anschauen und das mehrfach, dann kann es bei einem kleinen Webserver schon zu Schwierigkeiten kommen. Lieber nutze ich PeerTube und beteilige mich an den Kosten der PeerTube-Instanz (siehe oben).</li>
</ul>

<h2 id="profil-und-kanäle" data-numberify>Profil und Kanäle<a class="anchor ms-1" href="#profil-und-kanäle"></a></h2>
<p>Die Videos der Reihe &ldquo;Raaadweeeg&rdquo; findet man jetzt gelistet auf &ldquo;<a  class='urlextern'  href="https://tube.tchncs.de/c/raaadweeeg">tube.tchncs.de/c/raaadweeeg</a>&rdquo;. Bisher waren sie immer ungelistet auf YouTube.</p>
<p>Vielleicht werde ich auch mal das eine oder andere Video in &ldquo;<a  class='urlextern'  href="https://tube.tchncs.de/c/nomcycling/">nomcycling</a>&rdquo; hochladen :)</p>
<p>Mein <a  class='urlextern'  href="https://tube.tchncs.de/a/natenom/">Profil ist hier</a> zu finden.</p>
<p></p><figure class="image-caption"><a href="/2022/03/peertube-statt-youtube/2022-03-06-screenshot-browser-peertube-natenom-cover.png"><picture>
                <source type="image/webp" srcset="/2022/03/peertube-statt-youtube/2022-03-06-screenshot-browser-peertube-natenom-cover_hu4718e683c062c0e6f2693c939b0c1d61_242542_360x0_resize_q95_h2_catmullrom_3.webp 360w,/2022/03/peertube-statt-youtube/2022-03-06-screenshot-browser-peertube-natenom-cover_hu4718e683c062c0e6f2693c939b0c1d61_242542_500x0_resize_q95_h2_catmullrom_3.webp 500w,/2022/03/peertube-statt-youtube/2022-03-06-screenshot-browser-peertube-natenom-cover_hu4718e683c062c0e6f2693c939b0c1d61_242542_816x0_resize_q95_h2_catmullrom_3.webp 816w"
                                          sizes="(max-width: 424px) 360px, (max-width: 596px) 500px, (min-width: 565px) 816px" />
                <img alt="Screenshot eines Browsers, in dessen Fenster mein PeerTube-Profil zu sehen ist." srcset="/2022/03/peertube-statt-youtube/2022-03-06-screenshot-browser-peertube-natenom-cover_hu4718e683c062c0e6f2693c939b0c1d61_242542_360x0_resize_q95_h2_catmullrom_3.webp 360w, /2022/03/peertube-statt-youtube/2022-03-06-screenshot-browser-peertube-natenom-cover_hu4718e683c062c0e6f2693c939b0c1d61_242542_500x0_resize_q95_h2_catmullrom_3.webp 500w, /2022/03/peertube-statt-youtube/2022-03-06-screenshot-browser-peertube-natenom-cover_hu4718e683c062c0e6f2693c939b0c1d61_242542_816x0_resize_q95_h2_catmullrom_3.webp 816w"
                     sizes="(max-width: 424px) 360px, (max-width: 596px) 500px, (min-width: 565px) 816px"
                     src="/2022/03/peertube-statt-youtube/2022-03-06-screenshot-browser-peertube-natenom-cover_hu4718e683c062c0e6f2693c939b0c1d61_242542_816x0_resize_q95_h2_catmullrom_3.webp" title="Mein Profil bei PeerTube." loading="lazy" width="816" height="706" /></picture></a><figcaption>Mein Profil bei PeerTube.</figcaption></figure><p>
</p>]]></content:encoded><enclosure url="https://natenom.de/2022/03/peertube-statt-youtube/2022-03-06-screenshot-browser-peertube-natenom-cover.png" length="242542" type="image/png"/></item><item><title>Radiosendung über freie Alternativen für Twitter, Facebook, Instagram, usw.</title><link>https://natenom.de/2022/01/radiosendung-ueber-freie-alternativen-fuer-twitter-facebook-instagram-usw/</link><pubDate>Tue, 04 Jan 2022 09:07:07 +0000</pubDate><guid>https://natenom.de/2022/01/radiosendung-ueber-freie-alternativen-fuer-twitter-facebook-instagram-usw/</guid><description>Link zur Sendung</description><content:encoded>&lt;p>&lt;a class='urlextern' href="https://www.deutschlandfunk.de/souveraene-alternativen-neue-plattformen-statt-twitter-facebook-und-co-dlf-7523e5dc-100.html">Link zur Sendung&lt;/a>&lt;/p></content:encoded></item><item><title>Alte Toots eines Mastodon-Accounts automatisiert löschen</title><link>https://natenom.de/2021/03/alte-toots-eines-mastodon-accounts-automatisiert-loeschen/</link><pubDate>Wed, 24 Mar 2021 02:34:37 +0000</pubDate><guid>https://natenom.de/2021/03/alte-toots-eines-mastodon-accounts-automatisiert-loeschen/</guid><description><![CDATA[<div class="shortcode-notice update">
    <div class="shortcode-notice-title update">
        Update</div>
    <div class="notice-content">29.04.2022: Mittlerweile kann man direkt in Mastodon einstellen, dass bestimmte (alte) Dinge gelöscht werden, <a  href="/2022/04/mastodon-kann-selbst-automatisch-loeschen/">siehe hier</a>.</div>
</div>


<div class="shortcode-notice update">
    <div class="shortcode-notice-title update">
        Update</div>
    <div class="notice-content">04.05.2021: Ich habe das jetzt ins Wiki verschoben, <a  href="https://wiki.natenom.de/docs/sammelsurium/ephemetoot">siehe hier</a>.</div>
</div>


<p>Ich sehe Mastodon oder Twitter als Werkzeuge für Kommunikation aktueller Themen, nicht als Ort eines Archivs von allem, das man in den letzten Jahren geschrieben hat. Daher lösche ich unregelmäßig alte Toots auf Mastodon und auch Tweets auf Twitter. Anfangs machte ich das manuell und mittlerweile mit schönen Werkzeugen.</p>
<p>Hier geht es um das Tool <a  class='urlextern'  href="https://github.com/hughrun/ephemetoot/">Ephemetoot</a>, das in der Lage ist, alte Toots eines Mastodonaccounts zu löschen.</p>]]></description><content:encoded><![CDATA[<div class="shortcode-notice update">
    <div class="shortcode-notice-title update">
        Update</div>
    <div class="notice-content">29.04.2022: Mittlerweile kann man direkt in Mastodon einstellen, dass bestimmte (alte) Dinge gelöscht werden, <a  href="/2022/04/mastodon-kann-selbst-automatisch-loeschen/">siehe hier</a>.</div>
</div>


<div class="shortcode-notice update">
    <div class="shortcode-notice-title update">
        Update</div>
    <div class="notice-content">04.05.2021: Ich habe das jetzt ins Wiki verschoben, <a  href="https://wiki.natenom.de/docs/sammelsurium/ephemetoot">siehe hier</a>.</div>
</div>


<p>Ich sehe Mastodon oder Twitter als Werkzeuge für Kommunikation aktueller Themen, nicht als Ort eines Archivs von allem, das man in den letzten Jahren geschrieben hat. Daher lösche ich unregelmäßig alte Toots auf Mastodon und auch Tweets auf Twitter. Anfangs machte ich das manuell und mittlerweile mit schönen Werkzeugen.</p>
<p>Hier geht es um das Tool <a  class='urlextern'  href="https://github.com/hughrun/ephemetoot/">Ephemetoot</a>, das in der Lage ist, alte Toots eines Mastodonaccounts zu löschen.</p>
<h2 id="token-für-mastodon" data-numberify>Token für Mastodon<a class="anchor ms-1" href="#token-für-mastodon"></a></h2>
<p>Damit Ephemetoot mit einem Account arbeiten kann, benötigt es einen &ldquo;Zugangstoken&rdquo; bzw. &ldquo;Access token&rdquo;. Den erstellt man in den Einstellungen auf Mastodon, im Bereich &ldquo;Entwicklung&rdquo;.</p>
<p>Dort fügt man einen neue &ldquo;Anwendung&rdquo; hinzu. Es reicht aus, einen Namen einzugeben und die Voreinstellungen unverändert zu lassen. Man kann aber auch die Möglichkeiten einschränken. Ephemetoot muss lesen und schreiben können.</p>

<h2 id="virtualenv" data-numberify>Virtualenv<a class="anchor ms-1" href="#virtualenv"></a></h2>
<p>Mit Virtualenv erstellt man eine Umgebung für Ephemetoot:</p>
<pre><code>virtualenv -p /usr/bin/python3 ephemetoot
</code></pre>
<p>Im aktuellen Verzeichnis wird damit ein Verzeichnis &ldquo;ephemetoot&rdquo; erstellt.</p>
<pre><code>cd ephemetoot
source bin/activate
pip install ephemetoot
</code></pre>
<p>Jetzt startet man das Tool und lässt eine Konfiguration erstellen.</p>
<pre><code>ephemetoot --init
</code></pre>
<p>Dabei werden Accountname, Token und weitere Dinge abgefragt, die dann in die Konfigurationsdatei config.yaml geschrieben werden. Man kann die Konfigurationsdatei aber auch manuell erstellen und diesen Befehl überspringen.</p>
<p>Bei mir sieht die Konfigurationsdatei dann so aus:</p>
<div class="highlight"><pre tabindex="0" style="color:#f8f8f2;background-color:#272822;-moz-tab-size:4;-o-tab-size:4;tab-size:4;"><code class="language-yaml" data-lang="yaml"><span style="display:flex;"><span>  <span style="color:#f92672">access_token</span>: <span style="color:#ae81ff">blabpluijd123</span>
</span></span><span style="display:flex;"><span>  <span style="color:#f92672">username</span>: <span style="color:#ae81ff">meinbenutzername</span>
</span></span><span style="display:flex;"><span>  <span style="color:#f92672">base_url</span>: <span style="color:#ae81ff">meinserver.tld</span>
</span></span><span style="display:flex;"><span>  <span style="color:#f92672">days_to_keep</span>: <span style="color:#ae81ff">30</span>
</span></span><span style="display:flex;"><span>  <span style="color:#f92672">keep_pinned</span>: <span style="color:#66d9ef">true</span>
</span></span><span style="display:flex;"><span>  <span style="color:#f92672">archive</span>: <span style="color:#ae81ff">archive</span>
</span></span><span style="display:flex;"><span>  <span style="color:#f92672">hashtags_to_keep</span>:
</span></span><span style="display:flex;"><span>    - <span style="color:#ae81ff">müllsammeln</span>
</span></span><span style="display:flex;"><span>    - <span style="color:#ae81ff">ontour</span>
</span></span><span style="display:flex;"><span>    - <span style="color:#ae81ff">natenomontour</span>
</span></span><span style="display:flex;"><span>    - <span style="color:#ae81ff">plogging</span>
</span></span><span style="display:flex;"><span>    - <span style="color:#ae81ff">openbikesensor</span>
</span></span></code></pre></div><p>Dabei werden nur Toots gelöscht, die älter als 30 Tage oder nicht angepinnt sind oder die keines der genannten Hashtags enthalten. Gelöschte Toots landen als Backup (ohne angefügte Medien) im Unterverzeichnis archive.</p>

<h2 id="laufen-lassen" data-numberify>Laufen lassen<a class="anchor ms-1" href="#laufen-lassen"></a></h2>
<p>Ohne Angabe von Parametern startet man das Tool. Hier die Ausgabe für meinen Account. Löschvorgänge sind stark limitiert, man muss das Tool also eine Weile laufen lassen oder nach Ablauf der Fristen immer wieder manuell starten.</p>
<div class="highlight"><pre tabindex="0" style="color:#f8f8f2;background-color:#272822;-moz-tab-size:4;-o-tab-size:4;tab-size:4;"><code class="language-bash" data-lang="bash"><span style="display:flex;"><span>ephemetoot                    
</span></span><span style="display:flex;"><span><span style="color:#f92672">=============</span> EPHEMETOOT v3.1.0 <span style="color:#f92672">================</span>
</span></span><span style="display:flex;"><span>Running at Tue <span style="color:#ae81ff">23</span> Mar <span style="color:#ae81ff">2021</span> 16:02:31 +0000
</span></span><span style="display:flex;"><span><span style="color:#f92672">================================================</span>
</span></span><span style="display:flex;"><span>
</span></span><span style="display:flex;"><span>Fetching account details <span style="color:#66d9ef">for</span> @account@server
</span></span><span style="display:flex;"><span>Checking <span style="color:#ae81ff">336</span> toots
</span></span><span style="display:flex;"><span>
</span></span><span style="display:flex;"><span><span style="color:#75715e"># skipping toot with hashtag - 105141110016028168</span>
</span></span><span style="display:flex;"><span><span style="color:#75715e"># skipping toot with hashtag - 105141096555743892</span>
</span></span><span style="display:flex;"><span>❌ deleting toot <span style="color:#ae81ff">105141072564203642</span> tooted <span style="color:#ae81ff">02</span> Nov <span style="color:#ae81ff">2020</span>
</span></span><span style="display:flex;"><span><span style="color:#75715e"># skipping toot with hashtag - 105140264929870540</span>
</span></span><span style="display:flex;"><span><span style="color:#f92672">[</span>...<span style="color:#f92672">]</span>
</span></span><span style="display:flex;"><span>❌ deleting toot <span style="color:#ae81ff">105140255682219175</span> tooted <span style="color:#ae81ff">02</span> Nov <span style="color:#ae81ff">2020</span>
</span></span><span style="display:flex;"><span>❌ deleting toot <span style="color:#ae81ff">105125588146258105</span> tooted <span style="color:#ae81ff">30</span> Oct <span style="color:#ae81ff">2020</span>
</span></span><span style="display:flex;"><span>❌ deleting toot <span style="color:#ae81ff">105124704483125356</span> tooted <span style="color:#ae81ff">30</span> Oct <span style="color:#ae81ff">2020</span>
</span></span><span style="display:flex;"><span>❌ deleting toot <span style="color:#ae81ff">105124291721722596</span> tooted <span style="color:#ae81ff">30</span> Oct <span style="color:#ae81ff">2020</span>
</span></span><span style="display:flex;"><span>❌ deleting toot <span style="color:#ae81ff">105124268645450132</span> tooted <span style="color:#ae81ff">30</span> Oct <span style="color:#ae81ff">2020</span>
</span></span><span style="display:flex;"><span>❌ deleting toot <span style="color:#ae81ff">105124058673704582</span> tooted <span style="color:#ae81ff">30</span> Oct <span style="color:#ae81ff">2020</span>
</span></span><span style="display:flex;"><span>
</span></span><span style="display:flex;"><span>Rate limit reached at Tue <span style="color:#ae81ff">23</span> Mar <span style="color:#ae81ff">2021</span> 17:31:12 +0000 -
</span></span><span style="display:flex;"><span>next reset due in <span style="color:#ae81ff">29</span> minutes.
</span></span><span style="display:flex;"><span>
</span></span><span style="display:flex;"><span>❌ deleting toot <span style="color:#ae81ff">105123687719372689</span> tooted <span style="color:#ae81ff">30</span> Oct <span style="color:#ae81ff">2020</span>
</span></span><span style="display:flex;"><span>❌ deleting toot <span style="color:#ae81ff">105123674095282130</span> tooted <span style="color:#ae81ff">30</span> Oct <span style="color:#ae81ff">2020</span>
</span></span><span style="display:flex;"><span>❌ deleting toot <span style="color:#ae81ff">105123670006473110</span> tooted <span style="color:#ae81ff">30</span> Oct <span style="color:#ae81ff">2020</span>
</span></span><span style="display:flex;"><span>❌ deleting toot <span style="color:#ae81ff">105077514503516341</span> tooted <span style="color:#ae81ff">22</span> Oct <span style="color:#ae81ff">2020</span>
</span></span><span style="display:flex;"><span><span style="color:#75715e"># skipping toot with hashtag - 105077420693727860</span>
</span></span><span style="display:flex;"><span>❌ deleting toot <span style="color:#ae81ff">105066209174447095</span> tooted <span style="color:#ae81ff">20</span> Oct <span style="color:#ae81ff">2020</span>
</span></span><span style="display:flex;"><span>❌ deleting toot <span style="color:#ae81ff">105062844118829383</span> tooted <span style="color:#ae81ff">19</span> Oct <span style="color:#ae81ff">2020</span>
</span></span><span style="display:flex;"><span>👎 unboosting toot <span style="color:#ae81ff">105044942015133379</span> boosted <span style="color:#ae81ff">16</span> Oct <span style="color:#ae81ff">2020</span>
</span></span><span style="display:flex;"><span><span style="color:#f92672">[</span>...<span style="color:#f92672">]</span>
</span></span><span style="display:flex;"><span>---------------------------------------
</span></span><span style="display:flex;"><span>🥳 <span style="color:#f92672">==</span>&gt; 🧼 <span style="color:#f92672">==</span>&gt; 😇 User cleanup complete!
</span></span><span style="display:flex;"><span>---------------------------------------
</span></span></code></pre></div>
<h2 id="fertig" data-numberify>Fertig<a class="anchor ms-1" href="#fertig"></a></h2>
<p>Dieses Tool kann man jetzt alle x Zeit laufen lassen und alte Toots löschen :)</p>]]></content:encoded></item></channel></rss>