Hubzilla und das Grid - Wo lässt sich Hubzilla eigentlich einordnen?
Im Zusammenhang mit Hubzilla liest man immer wieder vom "Grid".
Was ist damit denn gemeint? ...
Was ist damit denn gemeint? ...
View article
View summary
Im Zusammenhang mit Hubzilla liest man immer wieder vom "Grid".
Was ist damit denn gemeint?
Ganz einfach: Als Grid wird das gesamte Netzwerk von Servern bezeichnet, welche untereinander mit dem Kommunikationsprotokoll Nomad/Zot6 kommunizieren. Das ist vergleichbar mit der Bezeichnung "Fediverse", welches für das Netzwerk aller Server steht, die mit dem Kommunikationsprotokoll ActivityPub kommunizieren.
Erzeugt man also einen Kanal auf einem Hubzilla-Hub, so ist man in diesem Moment Teil des Grid. Die Kommunikation und vor allem die Interaktionsmöglichkeiten im Grid sind groß und umfassender, als die im Fediverse. Erst wenn man in seinem Hubzilla-Kanal das ActiviyPub Protokoll aktiviert, ist der Kanal auch Teil des Fediverse. Während die Urfassung von Hubzilla, damals noch unter dem Namen red bzw. Redmatrix, mit dem Protokoll Zot im Juli 2012 veröffentlicht wurde, hielt das Protokoll ActivityPub erst am 18.07.2017 Einzug in Hubzilla (am 03.09.2017 zog Mastodon, welches am 16.03.2026 released wurde, mit ActivityPub nach).
Dass Hubzilla so lange ohne und derzeit noch ohne generell aktiviertes ActivityPub daherkommt, hat historische Gründe und liegt im Zweck der Software begründet.
Es wurde und wird als
Hubzilla – Community-Server
bezeichnet und wurde ursprünglich mit
Groupware neu gedacht und neu erfunden. Verbinden und verknüpfen Sie dezentrale Web-Communities.
beschrieben.
Und weiter...
Was sind Hubz?
Hubz sind unabhängige, universell einsetzbare Websites, die nicht nur mit ihren Mitgliedern und Besuchern verbunden sind, sondern auch untereinander, um persönliche Nachrichten und andere Informationen auszutauschen.
Dadurch können Hub-Mitglieder auf jedem Hub alles sicher und privat mit jedem auf jedem Hub – überall – teilen oder, wenn gewünscht, Inhalte öffentlich mit jedem im Internet teilen.
Hubzilla ist die Server-Software, die dies ermöglicht. Es handelt sich um eine ausgeklügelte und einzigartige Kombination aus einem Open-Source-Content-Management-System und einem dezentralen Identitäts-, Kommunikations- und Berechtigungs-Framework sowie einer Protokollsuite, die unter Verwendung gängiger Webserver-Technologie (PHP/MySQL/Apache und beliebte Varianten) erstellt wurde. Das Endergebnis ist ein Maß an Systemintegration, Datenschutzkontrolle und Kommunikationsfunktionen, das Sie weder in einem Content-Management-System noch in einem dezentralen Kommunikationsnetzwerk für möglich gehalten hätten. Es bringt auch ein neues Maß an Zusammenarbeit und Datenschutz ins Web und führt das Konzept des persönlichen „Single Sign-On” für Webdienste im gesamten Internet ein.
Schließlich noch...
Hubzilla-Hubs sind
- dezentralisiert
- von Natur aus sozial
- optional mit anderen Hubs vernetzt
- datenschutzfähig (Datenschutzausnahmen gelten im gesamten Internet für jede registrierte Identität auf jedem kompatiblen Hub)
Mögliche Website-Anwendungen sind
- dezentrale Social-Networking-Knoten
- persönlicher Cloud-Speicher
- Datei-Dropboxen
- Verwaltung der Kommunikation und Aktivitäten von Organisationen
- Zusammenarbeit und gemeinschaftliche Entscheidungsfindung
- Websites für kleine Unternehmen
- Öffentliche und private Medien-/Dateibibliotheken
- Blogs
- Veranstaltungswerbung
- Feed-Aggregation und -Wiederveröffentlichung
- Foren
- Dating-Websites
- So ziemlich alles, was Sie auf einem traditionellen Blog oder einer Community-Website tun können, aber besser tun könnten, wenn Sie es einfach mit anderen Websites verbinden oder Dinge privat über Website-Grenzen hinweg teilen könnten.
Quelle: hubzilla-1.12
Sehr viel Zitat – sorry... aber damit erklärt sich, als was Hubzilla ursprünglich gedacht war und auch immer noch gedacht ist. Es handelt sich letztlich um eine Content Management Software (CMS), die auch Social Networkig (Macro- und Microblogging inklusive) erlaubt. Bis zum Einzug von ActivityPub war die Föderation auf das Grid (also alle Hubzilla-Hubs) und auf alle Server, welche das Diaspora Federation Protokoll sprachen (also alle Diaspora-Pods), beschränkt. Als sich dann ActivityPub als das verbindende Protokoll aller anderen Dienste herauskristallisierte, wurde Hubzilla um eben diese Protkoll erweitert. Es kann aber auch, wenn man AP nicht benötigt, weiterhin nur mit Nomad/Zot6 genutzt werden.
Ich bewerbe Hubzilla ja meistens als Fediverse-Software mit ganz besonderen Eigenschaften. Und das hat auch einen Grund. Oder mindestens zwei. Einmal ist Hubzilla wirklich hervorragend für die Teilnahme am Fediverse geeignet und wartet mit vielen Features auf, die andere Dienste nicht bieten. Und zweitens kann Hubzilla nur erfolgreich werden, wenn es von mehr und mehr Nutzern verwendet wird. Ja, und das sind erstmal Menschen, die ins Fediverse wollen oder mehr im Fediverse machen wollen.
Die andere und eigentliche Zielgruppe, nämlich diejenigen, die ein CMS benötigen, sind nicht so leicht zu erreichen und für Hubzilla zu begeistern. Man kann es durchaus auch anstatt WordPress oder Ghost verwenden und hat dabei noch den Vorteil, dass die Hubs im Grid schon miteinander verbunden sind und interagieren können (was bei WordPress- und Ghost-Servern untereinander nicht möglich ist). Die Anbindung an das Fediverse kann dann aber (wie es ja bei WordPress und Ghost auch der Fall ist) zugeschaltet werden. Damit wird aus Hubzilla ein echtes Fediverse CMS, also ein Social-Networking CMS.
Es ist an der Zeit, Hubzilla als CMS bekannter zu machen und Ein- bzw. Umsteigern die Nutzung zu erklären und zu erleichtern.
Hubzilla gestalten
Fortsetzung zu Individuelle Anpassungen mit dem PDL-Editor (Einsteiger)
Eine Digitaluhr im simplen Text-Format in die Seitenleiste schieben und umständlich ein Hubzilla-Menü zu bauen... das ist jetzt nicht die "Hohe Schule" der Hubzilla-Gestaltung. Und auch nicht besonders schick und modern...
Eine Digitaluhr im simplen Text-Format in die Seitenleiste schieben und umständlich ein Hubzilla-Menü zu bauen... das ist jetzt nicht die "Hohe Schule" der Hubzilla-Gestaltung. Und auch nicht besonders schick und modern...
View article
View summary
Fortsetzung zu Individuelle Anpassungen mit dem PDL-Editor (Einsteiger)
Eine Digitaluhr im simplen Text-Format in die Seitenleiste schieben und umständlich ein Hubzilla-Menü zu bauen... das ist jetzt nicht die "Hohe Schule" der Hubzilla-Gestaltung. Und auch nicht besonders schick und modern. Die Beispiele aus dem Artikel sollten nur dem grundlegenden Verständnis der Seitengestaltung bei Hubzilla dienen.
Das Thema ist auch kaum vollumfassend abzuhandeln. In diese Artikel hier gehe ich auch nur beispielhaft auf die Möglichkeiten ein und ich kann vielleicht Anstöße zu neuen Ideen geben, wie sich Nutzer ihr eigenes Hubzilla zusammenbauen können, ohne mit Admin-Rechten irgendetwas zu installieren.
Im ersten Teil habe ich ja gezeigt, wie man mit der App "Webseiten" ein Menü erstellt und dieses im PDL-Editor in die Seitenleiste packen kann... etwas umständlich und so eigentlich auch nicht vorgesehen.
Die Optik eines solchen Menüs ist ohnehin nicht sonderlich ansprechend und tut damit auch nichts gegen den Vorwurf, Hubzilla würde mit seinem Standard-Theme "Redbasic" doch recht altbacken aussehen.
Sinnvoller und auch so vorgesehen ist die Gestaltung mit selbst erstellten Blöcken. Nutzt man ein moderneres Theme, so passt sich die Optik auch halbwegs an das Theme an. So richtig schick wird es aber erst, wenn man auf ein modernes Framework zurückgreift.
Voraussetzung für all die Dinge, die ich hier einmal vorführen möchte, sind die installierten Apps "PDL-Editor" und "Webseiten" und die Freigabe für Code für den Kanal, den man aufpeppen möchte.
Sofern man nicht selbst der Administrator ist, muss man für den letzten Punkt den Hub-Administrator kontaktieren und ihn bitten, Code für den eigenen Kanal zuzulassen. Für den Admin ist das nur ein einfacher Klick. Am besten schreibt man dem Admin bei der Bitte um Freischaltung auch gleich, wofür man das benötigt.
Sind diese Voraussetzungen geschaffen, die Apps also installiert und der Code erlaubt, kann es auch gleich losgehen.
Die meisten Themes für Hubzilla bieten entweder ein Subset oder teilweise zumindest das Basis-Stylesheet von Bootstrap. Möchte man aber die Fähigkeiten von Bootstrap umfassend für die Gestaltung nutzen, ist es sinnvoll, das Framework auch original einzubinden.
Das funktioniert mit dem Inhaltstyp "HTML" auch völlig problemlos. Man muss nur führend im Block (gilt natürlich auch für Webseiten, wenn man sie so erstellen möchte) Bootstrap einbinden:
Damit bringt man dann allerdings eine Fremdquelle mit ein. Nun ist Bootstrap nicht extrem groß (aktuell 8,3 MB), weshalb es sich anbietet, es einfach in der eigenen Hubzilla-Cloud vorzuhalten. Dazu legt man sich am besten im Wurzelverzeichnis der eigenen Cloud ein Verzeichnis
Eingebunden wird es dann mit
Auch dieses Framework muss man am Beginn eines Blocks einbinden:
Oder man lädt w3.css herunter, packt es z.B. in ein Verzeichnis
ein.
Blöcke werden von der App "Webseiten" zur Verfügung gestellt. Sie dienen dazu, wiederholt benutzbare Inhalte aufzunehmen, welche man dann über den Blocknamen in Webseiten, Webseiten-Layouts oder aber auch in die Seitenlayouts von Hubzilla einbinden kann.
Der Vorteil ist, dass selbst erstellte Blöcke im ITEM-Bereich des PDL-Editors zur Verfügung stehen und per Drag-and-Drop an die passende Stelle geschoben werden können.
Ein Block kann so ziemlich "alles" beinhalten. Und man kann ihn mit verschiedenen Inhaltstypen erstellen.
Es stehen die Inhaltstypen
zur Auswahl.
bbCode erlaubt zwar keine Einbindung eines Web-Frameworks, dafür bietet es spezielle Auszeichnungen für hubzilla-spezifische Dinge.
HTML ist der universellste Inhaltstyp, sofern man sich mit HTML auskennt. Mit einem HTML-Block kann man auch die erwähnten Frameworks nutzen und tolle Effekte und Funktionen einsetzen.
Markdown eignet sich für formatierte Texte, ist also eher etwas für Beitrags-Inhalte und weniger für Blöcke, die man z.B. in die Seitenleiste einer Ansicht packt. Verwenden kann man es aber schon dafür.
(Plain) Text, also reiner, unformatierter Text, ist die einfachste Variante, gibt aber für unsere Zwecke nichts her.
Die Comanche-Layout Auszeichnungssprache ist für den Einsatz für die Dinge, welche hier behandelt werden auch nicht sinnvoll.
PHP hingegen kann man durchaus nutzen, wenn man dynamische Inhalte erzeugen möchte. Setzt allerdings das Verständnis und die Fähigkeit zum Programmieren voraus.
Ich werde jetzt hier fast ausschließlich Blöcke im HTML-Format einsetzen, weil damit die größte Flexibilität gegeben ist.
Und jetzt fange ich einmal mit einem konkreten Beispiel an: Eine Navigationsleiste, die ich ganz oben im Inhaltsbereich der Kanalansicht einbauen möchte. Ich möchte damit Besuchern meiner Kanalseite eine einfache Navigation zu wesentlichen Bereichen meines Kanals ermöglichen. So sollen sie mit einem Klick, ohne länger zu suchen, auf meine Artikelseite, zu meinen Karten, zu meinem Wiki, meiner Galerie und zu meinem öffentlichen Kalender gelangen können. Damit es auch noch wirklich schick aussieht, gibt es als ersten Navigationspunkt eine Logo-Grafik des Hubs, die bei Anklicken zur Hub-Beschreibung führt.
Zunächst habe ich mir für den "Home-Button" eine passende Grafik gebaut, die transparenten Hintergrund hat und zur Schriftgröße der weiteren Buttons passt (100 x 24 Pixel):
Die Navigationsleiste realisiere ich in diesem Fall mit W3.CSS. Außerdem mach ich es noch ein wenig bunt, indem ich die Hover-Farbe für die Buttons auf verschiedene Standard-Farben des Frameworks festlege.
Den Block erstelle ich mit dem Block-Editor der App "Webseiten". Als Namen habe ich "wnavbar" festgelegt. Als Inhaltstyp
Anschließend muss der Block im PDL-Editor noch an die oberste Stelle des Inhaltsbereichs im MODUL "channel" geschoben und die Änderungen mit Klick auf den Button "APPLY" übernommen werden.
Nicht schlecht für den Anfang, oder?
Im ersten Einführungsteil hatte ich ja ein Menü zu Artikeln von mir als Beispiel gebastelt. Allerdings nicht als Block, sondern als Hubzilla-Menü, welches man nur umständlich mit dem PDL-Editor einbauen kann:
Im Endeffekt ist ein natives Hubzilla-Menü nichts anderes als eine Liste von Links. Und eine Link-Liste kann man auch ohne die Menü-Funktion erstellen.
Für diese Beispiel jetzt, erstelle ich wiederum ein Menü zu einigen (drei) Artikeln meines Kanals. Allerdings als Link-Liste.
Der HTML-Code für den entsprechenden Block sieht dann z.B. so aus:
Hier einfach als einzelne Links untereinander mit dem
Sieht so aus:
Oder vielleicht besser als unsortierte Liste?
Sieht schon etwas besser aus:
In die Kanalseite eingebaut (und mit einem Titel versehen):
Nett! Aber... Nett ist die kleine Schwester von Scheiße! 😉😂
Also packen wir mal ein wenig Schnick und Schnack vom W3.CSS Framework dazu:
Und schon sieht es fetziger aus, oder?
Nun möchte ich noch in der Seitenleiste ein Element haben, welches die Kontaktmöglichkeit mittels Delta Chat anzeigt. Dafür möchte ich den QR-Code meines Delta Chat Accounts verwenden.
Nun könnte man einfach ein Bild, nämlich den QR-Code dort hinpacken. Und das sogar mit bbCode, weil's einfacher ist.
Dann sieht das halt so aus:
Nicht sehr ansprechend... und es frisst Platz, weshalb das Artikelmenü (oder andere Inhalte, falls man noch weitere in die Seitenleiste geschoben hat) nach unten rutscht und man erst scrollen muss, um es zu erreichen.
Besser wäre es, wenn dort ein Button "Kontakt" zu sehen wäre, welche bei Klick den QR-Code einblendet... und den man mit einem weiteren Klick wieder ausblenden kann. Dafür bietet sich das "Accordeon" von W3.CSS an.
Und damit es nicht so langweilig aussieht, peppe ich es noch mit einer Karte als Inhalt und einer kleinen Animation auf. Ach... und der Button wird schwarz und hat ganz leich abgerundete Ecken.
Der Code dafür:
Schnell noch in die Seitenleiste geschoben... und schon ist die Delta Chat Karte da!
Einfach, um zu zeigen, dass man auch was mit PHP machen kann, hier ein Block, der anzeigt, wann die aktuelle Seite aufgerufen wurde. Mir ist einfach nichts Nützliches eingefallen...
Dazu legt man einen Block mit dem Inhaltstyp "PHP" an. Ich nenne ihn hier einfach mal "aufrufzeit".
Der Code ist extrem simpel!
Beachte hier: Es darf kein
Das Ding packe ich in die Profilansicht ganz ans Ende, damit jeder weiß, wann er sich das Profil angeschaut hat:
Damit lasse ich es jetzt einfach bewenden. Ich wollte hier einfach nur zeigen, was über die einfachen Dinge aus dem ersten Teil mit Hubzilla alles möglich ist.
Man ist extrem frei, die Oberfläche für sich selbst, aber auch für Besucher attraktiver und praktischer zu gestalten.
Und man ist nicht auf die Fähigkeiten vorhandener Widgets und Styles vorhandener Themes beschränkt. Mit aktuellen Frameworks kann man sehr viel gestalten, was frisch und modern aussieht.
Und da geht manches, was man vielleicht gar nicht für möglich hält. So habe ich einfach einmal was ausprobiert (in einem Test-Kanal... weil ich es eigentlich nicht nutzen würde)...
Zum einfachen Verfassen von bbCode-Beiträgen nutze ich gerne den SCEditor. Den habe ich mir lokal in eine HTML-Datei abgelegt und als Lesezeichen in die Lesezeichen-Symbolleiste meines Browsers gepackt. Ein Klick und er öffnet sich... und ich kann losschreiben.
Und da dachte ich mir einfach mal: Ob man das auch in eine Hubzilla-Ansicht packen kann?
Und tatsächlich ist es ohne große Anstrengung dort umsetzbar. Sah dann so aus:
Ihr seht also... es ist echt viel möglich. Einfach einmal ausprobieren.
Um Euch in die Frameworks einzuarbeiten oder den Einstieg in PHP zu schaffen, empfehle ich persönlich die Tutorials von w3 schools:
Viel Spaß beim Experimentieren und bei der Gestaltung Eures Hubzilla-Kanals!
Artikel in der Hubzilla KnowledgeDB
Eine Digitaluhr im simplen Text-Format in die Seitenleiste schieben und umständlich ein Hubzilla-Menü zu bauen... das ist jetzt nicht die "Hohe Schule" der Hubzilla-Gestaltung. Und auch nicht besonders schick und modern. Die Beispiele aus dem Artikel sollten nur dem grundlegenden Verständnis der Seitengestaltung bei Hubzilla dienen.
Das Thema ist auch kaum vollumfassend abzuhandeln. In diese Artikel hier gehe ich auch nur beispielhaft auf die Möglichkeiten ein und ich kann vielleicht Anstöße zu neuen Ideen geben, wie sich Nutzer ihr eigenes Hubzilla zusammenbauen können, ohne mit Admin-Rechten irgendetwas zu installieren.
Im ersten Teil habe ich ja gezeigt, wie man mit der App "Webseiten" ein Menü erstellt und dieses im PDL-Editor in die Seitenleiste packen kann... etwas umständlich und so eigentlich auch nicht vorgesehen.
Die Optik eines solchen Menüs ist ohnehin nicht sonderlich ansprechend und tut damit auch nichts gegen den Vorwurf, Hubzilla würde mit seinem Standard-Theme "Redbasic" doch recht altbacken aussehen.
Sinnvoller und auch so vorgesehen ist die Gestaltung mit selbst erstellten Blöcken. Nutzt man ein moderneres Theme, so passt sich die Optik auch halbwegs an das Theme an. So richtig schick wird es aber erst, wenn man auf ein modernes Framework zurückgreift.
Voraussetzungen
Voraussetzung für all die Dinge, die ich hier einmal vorführen möchte, sind die installierten Apps "PDL-Editor" und "Webseiten" und die Freigabe für Code für den Kanal, den man aufpeppen möchte.
Sofern man nicht selbst der Administrator ist, muss man für den letzten Punkt den Hub-Administrator kontaktieren und ihn bitten, Code für den eigenen Kanal zuzulassen. Für den Admin ist das nur ein einfacher Klick. Am besten schreibt man dem Admin bei der Bitte um Freischaltung auch gleich, wofür man das benötigt.
Sind diese Voraussetzungen geschaffen, die Apps also installiert und der Code erlaubt, kann es auch gleich losgehen.
Bootstrap und/oder W3.CSS
Die meisten Themes für Hubzilla bieten entweder ein Subset oder teilweise zumindest das Basis-Stylesheet von Bootstrap. Möchte man aber die Fähigkeiten von Bootstrap umfassend für die Gestaltung nutzen, ist es sinnvoll, das Framework auch original einzubinden.
Das funktioniert mit dem Inhaltstyp "HTML" auch völlig problemlos. Man muss nur führend im Block (gilt natürlich auch für Webseiten, wenn man sie so erstellen möchte) Bootstrap einbinden:
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/css/bootstrap.min.css" rel="stylesheet">`
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/js/bootstrap.bundle.min.js"></script>Damit bringt man dann allerdings eine Fremdquelle mit ein. Nun ist Bootstrap nicht extrem groß (aktuell 8,3 MB), weshalb es sich anbietet, es einfach in der eigenen Hubzilla-Cloud vorzuhalten. Dazu legt man sich am besten im Wurzelverzeichnis der eigenen Cloud ein Verzeichnis
bootstrap an, in welches man dann den Inhalt der Bootstrap-Distribution hochlädt.Eingebunden wird es dann mit
<link href="https://<URL_des_Hub>/cloud/<Kanal>/bootstrap/css/bootstrap.min.css" rel="stylesheet">`
<script src="https://<URL_des_Hub>/cloud/<Kanal>/bootstrap/js/bootstrap.bundle.min.js"></script>Auch dieses Framework muss man am Beginn eines Blocks einbinden:
<link rel="stylesheet" href="https://www.w3schools.com/w3css/5/w3.css">Oder man lädt w3.css herunter, packt es z.B. in ein Verzeichnis
css in der eigenen Cloud und bindet es mit<link rel="stylesheet" href="https://<URL_des_Hub>/cloud/<Kanal>/css/w3.css">ein.
Blöcke
Blöcke werden von der App "Webseiten" zur Verfügung gestellt. Sie dienen dazu, wiederholt benutzbare Inhalte aufzunehmen, welche man dann über den Blocknamen in Webseiten, Webseiten-Layouts oder aber auch in die Seitenlayouts von Hubzilla einbinden kann.
Der Vorteil ist, dass selbst erstellte Blöcke im ITEM-Bereich des PDL-Editors zur Verfügung stehen und per Drag-and-Drop an die passende Stelle geschoben werden können.
Ein Block kann so ziemlich "alles" beinhalten. Und man kann ihn mit verschiedenen Inhaltstypen erstellen.
Es stehen die Inhaltstypen
- bbCode
- HTML
- Markdown
- Text (plain Text)
- Comanche-Layout
- PHP
zur Auswahl.
bbCode erlaubt zwar keine Einbindung eines Web-Frameworks, dafür bietet es spezielle Auszeichnungen für hubzilla-spezifische Dinge.
HTML ist der universellste Inhaltstyp, sofern man sich mit HTML auskennt. Mit einem HTML-Block kann man auch die erwähnten Frameworks nutzen und tolle Effekte und Funktionen einsetzen.
Markdown eignet sich für formatierte Texte, ist also eher etwas für Beitrags-Inhalte und weniger für Blöcke, die man z.B. in die Seitenleiste einer Ansicht packt. Verwenden kann man es aber schon dafür.
(Plain) Text, also reiner, unformatierter Text, ist die einfachste Variante, gibt aber für unsere Zwecke nichts her.
Die Comanche-Layout Auszeichnungssprache ist für den Einsatz für die Dinge, welche hier behandelt werden auch nicht sinnvoll.
PHP hingegen kann man durchaus nutzen, wenn man dynamische Inhalte erzeugen möchte. Setzt allerdings das Verständnis und die Fähigkeit zum Programmieren voraus.
Ich werde jetzt hier fast ausschließlich Blöcke im HTML-Format einsetzen, weil damit die größte Flexibilität gegeben ist.
Beispiel 1: Navigationsleiste für die Kanalseite
Und jetzt fange ich einmal mit einem konkreten Beispiel an: Eine Navigationsleiste, die ich ganz oben im Inhaltsbereich der Kanalansicht einbauen möchte. Ich möchte damit Besuchern meiner Kanalseite eine einfache Navigation zu wesentlichen Bereichen meines Kanals ermöglichen. So sollen sie mit einem Klick, ohne länger zu suchen, auf meine Artikelseite, zu meinen Karten, zu meinem Wiki, meiner Galerie und zu meinem öffentlichen Kalender gelangen können. Damit es auch noch wirklich schick aussieht, gibt es als ersten Navigationspunkt eine Logo-Grafik des Hubs, die bei Anklicken zur Hub-Beschreibung führt.
Zunächst habe ich mir für den "Home-Button" eine passende Grafik gebaut, die transparenten Hintergrund hat und zur Schriftgröße der weiteren Buttons passt (100 x 24 Pixel):
Die Navigationsleiste realisiere ich in diesem Fall mit W3.CSS. Außerdem mach ich es noch ein wenig bunt, indem ich die Hover-Farbe für die Buttons auf verschiedene Standard-Farben des Frameworks festlege.
Den Block erstelle ich mit dem Block-Editor der App "Webseiten". Als Namen habe ich "wnavbar" festgelegt. Als Inhaltstyp
<link rel="stylesheet" href="https://hub.hubzilla.hu/cloud/pepecyb/css/w3.css">
<div class="w3-bar w3-border w3-light-grey">
<a href="https://hub.hubzilla.hu/page/pepecyb/about" class="w3-bar-item w3-button"><img src="https://hub.hubzilla.hu/cloud/pepecyb/whoville/whoville-logo.png" alt=""></a>
<a href="https://hub.hubzilla.hu/articles/pepecyb" class="w3-bar-item w3-button w3-hover-green">Artikel</a>
<a href="https://hub.hubzilla.hu/cards/pepecyb" class="w3-bar-item w3-button w3-hover-blue">Karten</a>
<a href="https://hub.hubzilla.hu/wiki/pepecyb" class="w3-bar-item w3-button w3-hover-teal">Wikis</a>
<a href="https://hub.hubzilla.hu/gallery/pepecyb" class="w3-bar-item w3-button w3-hover-purple">Galerie</a>
<a href="https://hub.hubzilla.hu/cal/pepecyb" class="w3-bar-item w3-button w3-hover-red">Kalender</a>
</div>Anschließend muss der Block im PDL-Editor noch an die oberste Stelle des Inhaltsbereichs im MODUL "channel" geschoben und die Änderungen mit Klick auf den Button "APPLY" übernommen werden.
Nicht schlecht für den Anfang, oder?
Beispiel 2: Nochmal das Menü aus dem ersten Teil - aber besser
Im ersten Einführungsteil hatte ich ja ein Menü zu Artikeln von mir als Beispiel gebastelt. Allerdings nicht als Block, sondern als Hubzilla-Menü, welches man nur umständlich mit dem PDL-Editor einbauen kann:
Im Endeffekt ist ein natives Hubzilla-Menü nichts anderes als eine Liste von Links. Und eine Link-Liste kann man auch ohne die Menü-Funktion erstellen.
Für diese Beispiel jetzt, erstelle ich wiederum ein Menü zu einigen (drei) Artikeln meines Kanals. Allerdings als Link-Liste.
Der HTML-Code für den entsprechenden Block sieht dann z.B. so aus:
<a href="https://hub.hubzilla.hu/articles/pepecyb/hhowama">Hubzilla-Häppchen: Hubzilla-Magie - OpenWebAuth / MagicAuth</a><br>
<a href="https://hub.hubzilla.hu/articles/pepecyb/folhsh2">Hubzilla: Hashtags folgen - Variante 2</a><br>
<a href="https://hub.hubzilla.hu/articles/pepecyb/irrungenwirrungen">Irrungen und Wirrungen - Hubzilla-Accounts, -Kanäle, -Profile</a>Hier einfach als einzelne Links untereinander mit dem
<br>-Tag (nicht schön und elegant).Sieht so aus:
Oder vielleicht besser als unsortierte Liste?
<ul><li><a href="https://hub.hubzilla.hu/articles/pepecyb/hhowama">Hubzilla-Häppchen: Hubzilla-Magie - OpenWebAuth / MagicAuth</a></li>
<li><a href="https://hub.hubzilla.hu/articles/pepecyb/folhsh2">Hubzilla: Hashtags folgen - Variante 2</a></li>
<li><a href="https://hub.hubzilla.hu/articles/pepecyb/irrungenwirrungen">Irrungen und Wirrungen - Hubzilla-Accounts, -Kanäle, -Profile</a></li></ul>Sieht schon etwas besser aus:
In die Kanalseite eingebaut (und mit einem Titel versehen):
Nett! Aber... Nett ist die kleine Schwester von Scheiße! 😉😂
Also packen wir mal ein wenig Schnick und Schnack vom W3.CSS Framework dazu:
<link rel="stylesheet" href="https://hub.hubzilla.hu/cloud/pepecyb/css/w3.css">
<ul class="w3-ul w3-card-4 w3-pale-green" style="width:100%">
<li><a href="https://hub.hubzilla.hu/articles/pepecyb/hhowama">Hubzilla-Häppchen: Hubzilla-Magie - OpenWebAuth / MagicAuth</a></li>
<li><a href="https://hub.hubzilla.hu/articles/pepecyb/folhsh2">Hubzilla: Hashtags folgen - Variante 2</a></li>
<li><a href="https://hub.hubzilla.hu/articles/pepecyb/irrungenwirrungen">Irrungen und Wirrungen - Hubzilla-Accounts, -Kanäle, -Profile</a></li>
</ul>Und schon sieht es fetziger aus, oder?
Beispiel 3: Kontakt-Widget
Nun möchte ich noch in der Seitenleiste ein Element haben, welches die Kontaktmöglichkeit mittels Delta Chat anzeigt. Dafür möchte ich den QR-Code meines Delta Chat Accounts verwenden.
Nun könnte man einfach ein Bild, nämlich den QR-Code dort hinpacken. Und das sogar mit bbCode, weil's einfacher ist.
Dann sieht das halt so aus:
Nicht sehr ansprechend... und es frisst Platz, weshalb das Artikelmenü (oder andere Inhalte, falls man noch weitere in die Seitenleiste geschoben hat) nach unten rutscht und man erst scrollen muss, um es zu erreichen.
Besser wäre es, wenn dort ein Button "Kontakt" zu sehen wäre, welche bei Klick den QR-Code einblendet... und den man mit einem weiteren Klick wieder ausblenden kann. Dafür bietet sich das "Accordeon" von W3.CSS an.
Und damit es nicht so langweilig aussieht, peppe ich es noch mit einer Karte als Inhalt und einer kleinen Animation auf. Ach... und der Button wird schwarz und hat ganz leich abgerundete Ecken.
Der Code dafür:
<link rel="stylesheet" href="https://hub.hubzilla.hu/cloud/pepecyb/css/w3.css">
<button onclick="myFunction('contact1')" class="w3-button w3-block w3-black w3-left-align w3-round w3-margin-bottom">Kontakt</button>
<div id="contact1" class="w3-hide w3-container w3-animate-zoom">
<div class="w3-container">
<div class="w3-card-4 w3-center" style="width:100%;max-width:400px">
<h2>Delta Chat</h2>
<img src="https://hub.hubzilla.hu/cloud/pepecyb/Pepes%20pic/delta.png" alt="" style="width:100%">
<div class="w3-container w3-center">
<p>derpepe@morpork.email</p>
</div>
</div>
</div>
</div>
<script>
function myFunction(id) {
var x = document.getElementById(id);
if (x.className.indexOf("w3-show") == -1) {
x.className += " w3-show";
} else {
x.className = x.className.replace(" w3-show", "");
}
}
</script>Schnell noch in die Seitenleiste geschoben... und schon ist die Delta Chat Karte da!
Beispiel 4: Sinnfreier PHP-Block
Einfach, um zu zeigen, dass man auch was mit PHP machen kann, hier ein Block, der anzeigt, wann die aktuelle Seite aufgerufen wurde. Mir ist einfach nichts Nützliches eingefallen...
Dazu legt man einen Block mit dem Inhaltstyp "PHP" an. Ich nenne ihn hier einfach mal "aufrufzeit".
Der Code ist extrem simpel!
date_default_timezone_set('Europe/Budapest');
echo 'Seite aufgerufen am: ' . date('d.m.Y - H:i:s');Beachte hier: Es darf kein
<?php davor und kein ?> am Ende stehen!Das Ding packe ich in die Profilansicht ganz ans Ende, damit jeder weiß, wann er sich das Profil angeschaut hat:
Soviel dazu...
Damit lasse ich es jetzt einfach bewenden. Ich wollte hier einfach nur zeigen, was über die einfachen Dinge aus dem ersten Teil mit Hubzilla alles möglich ist.
Man ist extrem frei, die Oberfläche für sich selbst, aber auch für Besucher attraktiver und praktischer zu gestalten.
Und man ist nicht auf die Fähigkeiten vorhandener Widgets und Styles vorhandener Themes beschränkt. Mit aktuellen Frameworks kann man sehr viel gestalten, was frisch und modern aussieht.
Und da geht manches, was man vielleicht gar nicht für möglich hält. So habe ich einfach einmal was ausprobiert (in einem Test-Kanal... weil ich es eigentlich nicht nutzen würde)...
Zum einfachen Verfassen von bbCode-Beiträgen nutze ich gerne den SCEditor. Den habe ich mir lokal in eine HTML-Datei abgelegt und als Lesezeichen in die Lesezeichen-Symbolleiste meines Browsers gepackt. Ein Klick und er öffnet sich... und ich kann losschreiben.
Und da dachte ich mir einfach mal: Ob man das auch in eine Hubzilla-Ansicht packen kann?
Und tatsächlich ist es ohne große Anstrengung dort umsetzbar. Sah dann so aus:
Ihr seht also... es ist echt viel möglich. Einfach einmal ausprobieren.
Um Euch in die Frameworks einzuarbeiten oder den Einstieg in PHP zu schaffen, empfehle ich persönlich die Tutorials von w3 schools:
Viel Spaß beim Experimentieren und bei der Gestaltung Eures Hubzilla-Kanals!
Artikel in der Hubzilla KnowledgeDB
Feintuning extrem - Berechtigungen unter Hubzilla
Immer wieder "prahle" ich, wie feingranular denn das Berechtigungssystem von Hubzilla ist und wie genau man festlegen kann, wer was sehen und wer was womit machen kann...
View article
View summary
Immer wieder "prahle" ich, wie feingranular denn das Berechtigungssystem von Hubzilla ist und wie genau man festlegen kann, wer was sehen und wer was womit machen kann.
Nutzt man die Kanalrollen "Persönlich" oder "Öffentlich", so ist auch schon sehr viel möglich. Viel mehr als bei den meisten Fediverse-Diensten. Aber trotzdem bleiben es noch "Berechtigungen mit Hammer und Meißel". Wer aber mit dem spitzen Bleistift feine Berechtigungsmuster zeichnen möchte, der muss etwas tiefer in das Berechtigungssystem von Hubzilla eintauchen und – das ergibt sich aus dem Wunsch – ein wenig mehr Aufwand betreiben.
Ausgangspunkt für einen solchen Kanal ist die Kanalrolle. Und hier müssen wir nun "Benutzerdefiniert" auswählen, weil die vorgegebenen Rollen zu viele Rechte einräumen.
Die benutzerdefinierte Kanalrolle entspricht nach Kanalerstellung der Rolle "Persönlich". Wir können aber, im Gegensatz zu den vorkonfigurierten Rollen, jegliche Berechtigung selbst festlegen. Dies geschieht über Einstellungen ➔ Privacy-Einstellungen ➔ Benutzerdefinierte Konfiguration der Channel Role.
Wählt man diesen Punkt, wird man zunächst gewarnt, dass man sich damit seinen Kanal durchaus "kaputt konfigurieren" kann. Na ja... dauerhaft kaputt macht man ihn sich damit auch nicht, weil man ja alles "zurückdrehen" kann. Es kann nur passieren, dass gewisse Dinge womöglich nicht mehr funktionieren, sofern man bei bestimmten Berechtigungen die falsche Einstellung wählt.
"Feintunig extrem" heißt dieser Beitrag... und "extrem" ist hier ziemlich wörtlich gemeint.
Grundsätzlich möchte man ja trotzdem, wenn man ein Soziales Netzwerk nutzt, mit anderen Nutzern in Interaktion treten. Das sollte man im Hinterkopf behalten, insbesondere bevor man bei einer Berechtigung die Auswahl "Nur ich" anwendet.
Für mein Beispiel setze ich jede(!) Berechtigung auf "Nur die, denen Du es explizit erlaubst". Damit ist der erste Schritt getan. Ab sofort muss ich alles, was ich anderen zugestehen möchte, explizit für jeden auch erlauben.
Nun kommen die Kontaktrollen ins Spiel. Es gibt immer die Rolle "Standard", welche allen Verbindungen das erlaubt, was auch mit der Kanalrolle "Persönlich" erlaubt ist. Und jede neue Verbindung erhält zunächst die Kontaktrolle "Standard". Damit wäre also erstmal kaum etwas gewonnen. An dieser Stelle ist es also erforderlich (bei einem neuen Kanal am besten, bevor man die erste Verbindung überhaupt eingeht), weitere Kontaktrollen zu erstellen. Das geschieht mit der App "Contact Roles" (findet Ihr die nicht im App-Menü, müsst ihr in der App-Verwaltung das "Sternchen" erst noch aktivieren).
Dort sieht man in einer Liste die bisher einzige vorhandene Kontaktrolle "Standard" und ein leeres Formular zur Erstellung einer neuen Rolle. Die ist nun im vorliegenden Fall im Bereich der Berechtigungen ohne auch nur ein einziges abgehaktes Kästchen und es gibt auch keine positiven Berechtigungen, die von der Kanalrolle geerbt wurden. Und genau diese Rolle nehmen wir jetzt auch mit sämtlich leeren Kästchen als eine neue Kontaktrolle. Das ist die Rolle, die auch Verbindungen nichts erlaubt. So mal rein gar nichts.
Sie muss einen Namen bekommen. Ich habe meine "nüscht" genannt. Wichtig (nicht zwingend, dazu später mehr) für unser Vorhaben ist die Option "Neuen Kontakten automatisch diese Rolle zuweisen". Die sollte aktiviert werden. Das sorgt dafür, dass jede neu eingegangene Verbindung grundsätzlich erst einmal diese Rolle bekommt... und letztlich "nüscht" darf. Die Verbindung bekommt nicht einmal von uns geteilte Inhalte auch nur zu sehen. Und wir selbst sehen von dieser Verbindung damit auch erstmal genau "nüscht".
Das ist nun aber eher sinnfrei. Die Rolle und die Festlegung, jedem Kontakt dieser Rolle zuzuweisen, sofern man keine andere auswählt, dient nur der Sicherheit, dass neue Verbindungen unbeabsichtigt Berechtigungen bekommen, die wir ihnen eigentlich nicht zugestehen wollen.
So, und nun können wir ans Feintuning gehen. Wir legen uns weitere Kontaktrollen an, die ganz genau auf unsere Bedürfnisse abgestimmt sind.
Die vorhandene (und nicht bearbeitbare) Standard-Rolle können wir natürlich auch für Verbindungen nutzen. Nämlich für genau diejenigen, mit denen wir wie in einem Sozialen Netzwerk ganz normal interagieren möchten.
Nun mag es vielleicht sein, dass wir das typische Social-Network-Verhalten nur für eine bestimmte Zahl unserer Verbindungen haben wollen, die meisten aber sollen die Funktionen nur etwas eingeschränkt nutzen können. Angenommen, die normalen Kontakte sollen unsere Postings sehen können, wir selbst wollen deren Postings auch sehen, sie sollen auch unsere Dateien und Bilder sehen können, ebenso unsere Webseiten und Wikiseiten. Überdies sollen sie liken und disliken können und unsere Beiträge kommentieren... ach und Direktnachrichten sollen sie uns auch schicken können. Die Rolle, ich nenne sie einfach mal "normal" würde dann so aussehen:
Nun mag es sein, dass wir Kontaktanfragen bekommen, wir dem Antragsteller auch durchaus erlauben wollen, unsere Beiträge zu verfolgen, wir selbst wollen aber seine Beiträge nicht sehen und er soll auch keine Reaktionen oder Kommentare machen können... er wäre also das, was bei anderen Diensten der "Follower" ist, dem wir selbst aber nicht folgen, dann können wir eine weitere Rolle anlegen (und z.B. "Follower" nennen). Die sähe dann so aus:
Wir erlauben dem "Follower" also, alles zu sehen, aber selbst nicht in unserem Stream in Erscheinung zu treten.
Und nach diesem Schema können wir uns beliebig viele Kontaktrollen für jede denkbare Verbindung erstellen und dann bestimmten Verbindungen zuweisen.
Das Zuweisen erfolgt entweder, wenn wir selbst eine Verbindung eingehen im dann erscheinenden Verbindungs-Editor. Hier können wir im Auswahlmenü "Wählen Sie eine Rolle für diesen Kontakt" die gewünschte Kontaktrolle auswählen.
Bereits bestehenden Verbindungen können wir auch andere Kontaktrollen zuordenen, indem wir den Verbindungs-Editor in der App "Verbindungen" nutzen.
Bekommen wir eine Verbindungs-Anfrage, landen wir auch wieder im Verbindungs-Editor und legen dort auch gleich die Rolle fest.
Bei einer übersichtlichen Zahl von Verbindungen funktioniert das. Werden es wesentlich mehr Verbindungen, dann kann man sich auch mit der Privacy Gruppen das Leben etwas einfacher machen (auch wenn man die Berechtigungen später einmal umfassend für seine Verbindungen umstrukturieren möchte).
Die App "Privacy Gruppen"muss, sofern noch nicht geschehen, erst einmal installiert werden (obwohl ihre Grundfunktionalität ohnehin schon vorhanden ist... man kann halt ohne die App nicht dran rumschrauben).
Legt man sich für verschiedene Berechtigungs-Rollen nun verschiedene Privacy Gruppen an und schiebt seine Kontakte in diese Gruppen, so kann man in der App "Contact Roles" bei jeder Rolle festlegen, dass diese allen Mitgliedern einer bestimmten Privacy Gruppe zugewiesen werden.
Achtung, Fußangel: Ordnet Ihr einzelne Verbindungen gleichzeitig mehreren Privacy Gruppen zu, so gilt für diese Verbindungen natürlich die Kontaktrolle, die Ihr zuletzt einer Gruppe zugewiesen habt.
Ist also Kontakt A gleichzeitig in den Gruppen B und C und Ihr weist die Kontaktrolle D allen Mitgliedern der Gruppe B zu und danach allen Mitgliedern der Gruppe C die Rolle E, dann verfügt Kontakt A über die Berechtigungen der Rolle D, weil ihm zuletzt als Gruppenmitglied der Gruppe C die Rolle E zugewiesen hat.
Aaaargh... wenn Ihr jetzt einen Knoten im Gehirn habt, Beschwerden bitte nach /dev/null verschieben. 😉😂 War jetzt suboptimal, das Beispiel...
Also kurz: Die zuletzt einer Privacy Gruppe zugewiesene Kontaktrolle gilt dann für alle Gruppenmitglieder, die sich zu dem Zeitpunkt in dieser Gruppe befunden haben. Andere Kontaktrollen, die sie vorher hatten, werden überschrieben.
Soviel zum Berechtigungs-Feintuning. Mit Hubzilla ist echt sehr viel möglich. Und das, was ich hier beschrieben habe, ist tatsächlich, wenn man es auf die Spitze treibt, etwas für Berechtigungsverteilungsfanatiker (nicht nur die Ungarn können lange Wörter). Man muss die richtige Balance finden.
Das Beispiel, das ich mit den paar Rollen hier beschrieben habe, ist aber durchaus alltagstauglich und kann helfen, den Stream hygienisch zu halten.
Die Rolle "nüscht" könnt Ihr Euch auch klemmen, wenn Ihr wollt (vor allem die automatische Zuweisung für neue Kontakte). Ihr müsst dann halt nur darauf achten, beim Eingehen einer Verbindung auch wirklich die korrekte Kontaktrolle zuzuweisen. Ist quasi nur ein zusätzliches Sicherungsseil. Dann wäre es aber sinnvoll, neuen Kontakten als Standard die Rolle "Normal" zuzuweisen.
Titelbild von Kevin Wuhrmann auf Pixabay
Conversation Features
Loading...
Loading...
Login
PepeCyBs Welt
pcw@hub.hubzilla.hu
Mein Blog PepeCyB's Welt - Pepes Gedanken, das Fediverse und mehr…
Categories
Archives
