Solidified – Hubzilla-SPA-Theme

Eine Solid.js-Single-Page-Anwendung (SPA), die als Solidified-Theme für Hubzilla, eine föderierte Social-Networking-Plattform, bereitgestellt wird. Es ersetzt die klassische, serverseitig gerenderte Benutzeroberfläche durch ein schnelles, reaktives clientseitiges Erlebnis und bleibt dabei vollständig in das PHP-Backend von Hubzilla integriert.

Der Quellcode des Themes ist unter saiwal/Hubzilla-Solidified-Source auf GitHub verfügbar.

Quelle: solidified/README.md

Eine häufig geäußerte Kritik an Hubzilla ist die “altbacken” aussehende, teilweise träge und nicht sehr intuitiv bedienbare grafische Oberfläche (UI).

Mit seinen herkömmlichen Utsukta-Themes hat Saiwal diese Vorwürfe bereits in weiten Teilen entkräftet.

Doch nun entwickelt er das Theme Solidified, welches nicht nur eine moderne, responsive UI bietet, sondern aufgrund seiner Konzeption auch noch ausgespochen reaktiv ist und dazu auch in Hinblick auf die Bedienbarkeit (UX) wesentlich intuitiver verwendet werden kann.

Auch auf mobilen Geräten macht Solidified eine ausgesprochen gute Figur.

Diese Info-Sammlung soll dabei helfen, sich schnell mit Solidified zurechtzufinden und neue Funktionen zu entdecken.

Beachte: Solidified befindet sich derzeit in der Betatest-Phase für das erste Release. Es ändert sich regelmäßig etwas. Und es kann sein, dass manches nicht oder nur fehlerhaft kunktioniert. Deshalb sollte man, wenn man Fehler entdeckt auch entsprechende Issues im Theme-Repo melden. Saiwal ist in der Regel übermenschlich schnell dabei, solche Dinge auszubügeln.

Hubzilla-Administratoren können das Theme-Repo ganz einfach mittels

./util/add_theme_repo https://github.com/saiwal/Utsukta-hub-themes.git utsukta-themes

installieren (und nebenbei den Nutzern ihres Hub auch die anderen Utsukta-Themes zur Verfügung stellen).

Das Solidified-Theme aktivieren

Wenn auf dem Hub, bei welchem man seinen Account hat, das Solidified-Theme aktiviert ist, kann man dies unter Einstellungen ➔ Anzeige-Einstellungen ➔ Theme wählen aktivieren.

Achtung: Derzeit (ist in Bearbeitung) kann es noch Probleme mit einigen Modulen geben, wenn man unter einem anderen Theme mit deutschen Spracheinstellungen auf Solidified umstellt. Deshalb empfiehlt es sich, den Kanal vor dem Umstellen auf die Englische Sprache umzustellen. Nach dem Wechsel zu Solidified ist das Umstellen auf Deutsch kein Problem mehr und sorgt (soweit bekannt) auch nicht für Fehler.

Admin: Installieren/Aktivieren

Hub-Betreiber, also Administratoren müssen zunächst das Repo der Utsukta-Themes zum Hub hinzufügen. Dies erledigen sie auf der Kommandozeile mittels

./util/add_theme_repo https://github.com/saiwal/Utsukta-hub-themes.git utsukta-themes.

Anschließend müssen sie in der Administrations-Oberfläche von Hubzilla das Theme noch aktivieren, damit Nutzer ihres Hubs das Theme auswählen können.

Die verschiedenen Module

Stellt man einen brandneuen Kanal auf solidified um, so findet man im Navigations-Menü (linke Seitenleiste) zunächst die folgenden Module:

• Kanal
• HQ
• Netzwerk
• Kalender
• Verzeichnis
• Dateien
• Hilfe
• Fotos
• Spiele
• Notizblock
• Werkzeuge

Weitere Module installiert man unter Einstellungen ➔ Integrationen.

Hie werden derzeit alle bei Hubzilla vorhandenen Apps als Module angeboten. Es wurden aber noch nicht alle von Saiwal in Solidified implementiert. Die erfolgt nach und nach. Seine Absicht ist, im Endeffekt die gesamte Funktionalität von Hubzilla in Solidified abzubilden.

Module, die aktuell funktionieren, sind neben den oben erwähnten Standard-Modulen noch:

• ActivityPub-Protokoll (dies erscheint nicht im Navigationsmenü, stellt aber nach Installation die AP-Fähigkeit zur Verfügung)
• Artikel
• Chaträume
• Warenkorb
• Öffentlicher Stream
• NSFW (erscheint nicht im Navigationsmenü und kann unter Einstellungen ➔ Integrationen konfiguriert werden)
• Superblock (erscheint nicht im Navigationsmenü; Blocken über das Kanalmenü im Stream; Verwaltung unter Einstellungen ➔ Blockierte Kanäle)
• Webseiten
• Wiki

Privacy Gruppen und Kontaktrollen sind im Verzeichnis integriert.

HQ

Das Modul HQ entspricht im Wesentlichen der HQ-Ansicht bei den “klassischen” Themes. Es kann aber durch weitere Widgets, deren Lage auch eingestellt werden kann, erweitert werden.

Netzwerk

Das Modul Netzwerk ist die netzwerkweite Stream-Ansicht.

Stream-Darstellung

Die Form wie Postings angezeigt werden kann über die Buttons für den Anzeige-Stil ausgewählt werden.

Es gibt vier Ansichtsmodi: Die klassische Feed-Ansicht, die Raster-Ansicht, die Listenansicht und die Zeitstrahl-Ansicht.

In der Feed-Ansicht werden die Postings wie üblich untereinander angezeigt. Im Gegensatz zu der Ansicht in den “klassischen” Themen, werden Kommentare / Antworten nicht direkt angezeigt. Man kann sie mit Klick auf das Kommentarsymbol am unteren Rand der Posting-Karte eingeblendet werden.

In der Raster-Ansicht werden die Inhalte in einem festen Raster in Kartenform angezeigt.

Ein Klick auf eine Karte öffnet das Posting in einer modalen Einzeilansicht, bei welcher auch ggf. vorhandene Kommentare hierarchisch angezeigt werden.

Die Listen-Ansicht zeigt die Inhalte in einer kompakten Liste, die ein wenig der Kompaktansicht von Reddit oder der Ansicht von Hacker-News ähnelt.

Auch hier öffnet ein Klick auf einen Listeneintrag den Beitrag in einer modalen Ansicht.

Die Zeitstrahl-Ansicht zeigt die Beiträge ohne Threads an einem Zeitstrahl.

Auch hier muss man wieder auf einen Betrag klicken, um den Beitrag als Thread modal anschauen zu können.

Reihenfolge

Mit dem Anzeigefilter, den man über die Buttons oben links erreichen kann, lässt sich die Streamreihenfolge bestimmen: Neueste, Aktiv, Top, Angesagt, Meist diskutiert, Kontrovers und Ohne Threads.

Mit Neueste werden die Beiträge in umgekehrter chronologischer Reihenfolge (neueste zuoberst) in Bezug auf den Zeitpunkt der Erstellung sortiert.

Aktiv sortiert, ebenfalls chronologisch umgekehrt, die Beiträge nach der letzten Aktivität, also Erstellung, Kommentare, Likes. etc.

Top zeigt die beliebtesten Beiträge, sortiert nach der höchsten Anzahl an Likes. Ein „Gefällt mir“ zählt nur einmal pro Person, unabhängig davon, wie oft der Beitrag auf Ihrer Startseite erscheint.

Angesagt ist eine Mischung aus Likes und Aktualität. Likes werden nach einer gleitenden Skala gewichtet, aber auch durch zeitliche Aktualität.

Meist diskutiert bevorzugt die umfangreichsten Diskussionen, gemessen an der Anzahl der Antworten/Kommentare.

Bei Kontrovers wird als Gewichtung die Anzahl der Likes und Dislikes ausgewertet. Je einseitiger die Meinungen ausfallen, desto weiter fällt der Beitrag in der Rangliste zurück.

Ohne Threads schließlich zeigt einzelne Akivitäten ohne Thread-Zusammenhang, also auch einzelne Kommentare, ähnlich wie bei Mastodon. Um ein Element dann im Zusammenhang (sofern es einen solchen gibt) betrachten zu können, muss man das kleine Augensymbol unten rechts neben dem Beitragsmenü klicken (“Im Kontext anzeigen”).

Die Sortierungen Top, Angesagt, Meist Diskutiert und Kontrovers stehen erst zur Verfügung, wenn man sie unter Einstellungen ➔ Funktionen ➔ Netzwerk ➔ “Advanced Sorting” aktivert.

Aktualisieren

Ganz links gibt es noch einen Button, um den Stream zu aktualisieren (dies geschieht nach einem festgelegten Zeitraum automatisch, kann mit dem Button aber sofort ausgelöst werden).

Wenn eine oder mehrere Aktivitäten im Stream stattgefunden haben, wird eine Schaltfläche eingeblendet, welche diese Aktivitäten abruft.

Schneller Beitragseditor

Ganz oben über dem Stream findet man die bekannte Schaltfläche für das schnelle Erstellen von eigenen Beiträgen (“Was gibt’s Neues?”). Klickt man darauf, öffnet sich an dieser Stelle ein vereinfachter Beitragseditor.

Stream-Filter

In der rechten Seitenleiste findet man schließlich die bekannten, aber auch einige neue Stream-Filter (einzelne Filter werden nur bei gegebenen Voraussetzungen angezeigt):

• Suche
• Markierte Beiträge
• Folge ich
• Persönliche Beiträge
• Direktnachrichten
• Termine
• Umfragen
• Nach Verbindungen filtern
• Gespeicherte Ordner
• Privatsphäre-Gruppen
• Foren
• Tags
• Zeitraum
• Nähe (der Ersatz für den Beziehingsgrad-Schieber)

Hat man Filter ausgewählt, lassen sie sich per Klick auf “x Filter zurücksetzen” wieder zurücksetzen, sodass der ungefilterte Stream angezeigt wird.

Kanal

Die Kanalansicht zeigt den eigenen Kanalstream an, also alle Beiträge, die im eigenen Kanal veröffentlicht wurden (eigene Beiträge, aber z.B. auch Wall-Postings).

Dateien (die Cloud)

Das Modul “Dateien” erlaubt den Zugriff auf die Cloud. Sie funktioniert entsprechend der gleichnamigen App der “klassischen” Themes.

In der aktuellen Version wurde die Oberfläche ein wenig mehr wie ein Dateimanager auf dem Desktop gestaltet. Im linken Teil des Inhaltsbereichs befindet sich eine Baumansicht der Cloud. Hier hat man schnellen Zugriff auf die Anzeige von Ordnern und Dateien. Wählt man in diesem Bereich einen Ordner aus, wird der Inhalt des Ordner im rechten Teil des Inhaltsbereichs angezeigt.

In diesem Bereich findet man nun auch die möglichen Dateioperationen in einer Symbolleiste über dem Anzeigebereich. Ist im Anzeigebereich keine Datei selektiert, beziehen sich die Operationen auf den angezeigten Ordner.

Das Modul bietet verschiedene Datei- und Verzeichnisoperationen.

Dateien, die über einen internen Viewer dargestellt werden können, werden geöffnet und dargestellt (z.T. auch abhängig von den Mime-Typen des Browsers). Andere Dateien werden bei Klick zum Download angeboten.

Auswählen:

Teilen:

Lesezeichen setzen:

Berechtigungen anpassen:

Umbenennen:

Verschieben oder Kopieren:

Kategorien:

Herunterladen:

Filtern:

Rasteransicht:

Bei der Rasteransicht werden drei Buttons zur Sortierung eingeblendet.

Neuer Ordner:

Hochladen:

Wenn Inhalte eines Ordners ausgewählt wurden, kommen einige wenige Operationen hinzu bzw. verändern sich in den Möglichkeiten.

Bei Dateien gibt es eine weitere Option hinter dem Teilen-Button: “Anhang-Code”.

Löschen:

Collabora-Unterstützung

Wenn der Hub Collabora-Unterstützung bietet, kann man über das Dateimenü mit dem Menüpunkt “In Office bearbeiten” die Datei in Collabora öffnen.

Fotos

Das Modul “Fotos” ist eine Anwendung, welche die Funktion der Foto-App und der Galerie-App vereint.

Die Alben (also Verzeichnisse in der Cloud, welche Bilder enthalten) werden skaliert und gekachelt inklusive Ordnernamen angezeigt. Es gibt einen leichten Zoom-Effekt bei Mouseover.

Öffnet man ein Album erscheint eine Fotogalerie, bei der die Bilder ebenfalls gekachelt und mit Zoomeffekt dargestellt werden.

Hier können einzelne Bilder bereits geteilt oder gelöscht werden. Außerdem kann das gesamte Album gelöscht, neue Dateien hochgeladen und die Zugriffsberechtigungen eingestellt werden.

Klickt man nun in der Albenansicht auf ein Bild, so wird es skaliert im Inhaltsbereich angezeigt. Mittels zweier Pfeile kann man hier durch die einzelnen Bilder des Albums blättern.

In dieser Ansicht kann man dem Foto auch einen Titel und eine Beschreibung geben.

Über das Item-Menü (unten rechts ⋮) kann man das Bild auch im Bildeditor von Solidified bearbeiten.

Klickt man in der Bildansicht auf ein Bild, so öffnet es sich in der Einzelansicht, wo man es sich in unterschiedlichen Zoomstufen ansehen kann.

Kalender

Das Kalender-Modul bietet einen Kanal-Kalender zur Terminverwaltung.

Die Ansicht lässt sich auf Monats-, Wochen- und Tagesansicht umschalten. Außerdem gibt es eine Ansicht mit einer Terminliste.

Klickt man auf einen Tag, so hat man die Möglichkeit, einen Termin einzugeben.

Wenn im Stream ein von einem anderen Kanal stammender Kalendereintrag erscheint, ist es möglich, diesen Event über das Item-Menü in den eigenen Kalender zu übernehmen.

Verzeichnis

Das Modul “Verzeichnis” integriert die Funktionalität der Apps “Verbindungen”, “Verzeichnis”, “Privacy Gruppen” und “Kontaktrollen” sinnvoll an einem Ort.

Verbindungen

Unter “Verbindungen” werden die Verbindungen angezeigt. Die Ansicht kann außerdem nach

• Aktiv
• Ausstehend
• Blockiert
• Ignoriert
• Versteckt
• Archiviert
• Alle

gefiltert werden.

Über die Schaltfläche “Aus CSV importieren” ist es möglich, Following-Dateien anderer Fediversedienste zu laden und die darin aufgeführten Kontakte als Verbindungen hinzuzufügen.

Hier kann auch eine Direktnachricht an den Kanal verschickt werden, die Verbindung gelöscht und bearbeitet werden.

Weiterhin ist die Suche nach einer Verbindung möglich. Gibt man hingegen in das Suchfeld das Handle (Webbie / Fediverse-Adresse) eines Kanals ein, kann man hier auch direkt eine Verbindung herstellen, indem man auf den Button “+ Verbinden” klickt.

Die Sortierung der angezeigten Kanäle kann ebenfalls festgelegt werden.

Kontaktrollen

Die Kontaktrollen können in diesem Modul ebenfalls verwaltet werden.

Man kann dort über ein Auswahlmenü jedem Kontakt eine Kontaktrolle zuordnen

und auch neue Kontaktrollen erstellen bzw. selbst erstellte Kontaktrollen bearbeiten sowie Kontaktrollen in einem Rutsch einer Privacy Gruppe zuweisen (Beachte: Das betrifft nur Verbindungen, die sich zu diesem Zeitpunkt bereits in der Gruppe befinden; später hinzugefügten Verbindungen muss die Rolle anschließend zugewiesen werden).

Privacy Gruppen

Auch Privacy Gruppen werden im Modul “Verzeichnis” verwaltet.

Bestehende Gruppen lassen sich bearbeiten

und neue erstellen.

Personen und Gruppen

Diese Funktion ermöglicht das Betrachten und Durchsuchen des globalen oder lokalen Verzeichnisses und das Herstellen neuer Verbindungen, wie man es bei den “herkömmlichen” Themen von der App “Verzeichnis” kennt.

Öffentliche Hubs

Mit “Öffentliche Hubs” kann man Hubs suchen. Diese Ansicht entspricht der Liste aus pubsites/.

Öffentlicher Stream

Hier werden beim lokalen Stream sämtliche Inhalte des eigenen Hubs in einem Stream angezeigt, beim globalen Stream zusätzlich alle Inhalte, die über Verbindung von Kanälen des Hubs importiert wurden.

Artikel

Das Artikel-Modul bietet die Funktionalität der App “Artikel”.

Über den Button “Neuer Artikel” wird der Artikel-Editor aufgerufen.

Neben dem Titel kann hier eine kurze Beschreibung eingegeben werden, die dann in Artikellisten als Zusammenfassung angezeigt wird. Weiterhin muss der URL Slug eingegeben werden, also der Teil der URL, welcher letztlich die Webseite referenziert.

Bei Artikeln muss man zusätzlich die Sprache des Artikelinhalts angeben und den Artikel ggf., sofern es ein “Mehrteiler” ist, einer Artikelserie zuordnen und auch die laufende Nummer des Artikels innerhalb der Serie festlegen.

Artikel können auch hier einer oder mehreren Kategorien zugeordnet werden.

Als Inhaltstyp steht derzeit nur BBcode zur Verfügung.

Mit der Angabe der Sprache hat es eine besondere Bewandnis! Es ist nämlich moglich, durch Klick auf das Symbol (“Übersetzung hinzufügen”) den Editor für den Artikel erneut zu öffnen und eine Übersetzung einzugeben.

Ist dies geschehen, erscheint im Kopf des Betrags der Text “Auch verfügbar in:” mit Batches für die anderen Sprachen, in welchen der Artikel zur Verfügung steht. Ein klick auf die gewünschte Sprache schaltet dann unverzüglich die Sprache des Artikels um.

Der RSS-Stream aller Artikel eines Kanals steht über die Adresse <URL_DES_HUB>/artfeed/<KANAL_NAME> zur Verfügung.

Saiwal hat die Funktionalität der Artikel hier sinnvoll erweitert. Artikel eignen sich hervorragend für das Blogging.

Webseiten

Auch mit Solidified ist es möglich, Webseiten zu erstellen.

Derzeit stehen für das Erstellen von Webseiten die Inhaltstypen BBcode, Markdown, HTML und Plaintext zur Verfügung.

Webseiten

Wählt man im Modul “+ Neue Seite”, öffnet sich der Webseiteneditor im WYSIWYG-Modus.

Im Editor kann man einen Seitentitel vergeben, der bei Darstellung der Webseite als Überschrift angezeigt wird. Es gibt auch ein Eingabefeld für eine kurze Zusammenfassung. Diese wird lediglich in der Liste der Webseiten angezeigt.

Weiterhin muss der URL Slug eingegeben werden, also der Teil der URL, welcher letztlich die Webseite referenziert.

Für die Darstellung der Webseite kann ein Seitenlayout ausgewählt werden. Mit dem Webseiten-Modul kann man solche Layouts erstellen.

Der eigentliche Inhaltsbereich kann mit dem WYSIWYG-Editor erstellt und bearbeitet werden. Der Editor lässt sich aber auch in den Quellcode-Modus umschalten, sodass man die Textauszeichnungen direkt per Hand eingeben kann.

Die Webseite kann dann angezeigt werden.

Blöcke

“Blöcke” erlaubt das Erstellen von Blöcken, also wiederverwendbaren Elementen.

Die so erstellten Blöcke können dann in Layouts in ein Widget “HTML-Block” eingebaut werden.

Blöcke können auf diese Art auch in Ansichten der Module eingebaut werden. Sie sind im Kanalim HTML-Block global verfügbar.

Menüs

Mit dem Menüeditor des Webseiten-Moduls kann man rasch Menüs erstellen.

Hat man ein Menü erstellt, muss man nun nur noch Einträge Hinzufügen.

Man kann übrigens auch Untermenüs einbinden.

Layouts

Die Gestaltung der Webseite erfolgt schließlich mit Layouts.

Unter “Layout-Vorlagen” kann man Layouts erstellen und vorhandene bearbeiten.

Mit dem Layout-Editor kann man in einem Layout Widgets im Kopbereich, über dem Seiteninhalt, in der Fußzeile und in der rechten Seitenleiste hinzufügen. Diese werden dann bei Anzeige der Webseite an diesen Stellen dargestellt.

So könnte man z.B. das gerade erstellte Menü einfach im Kopfbereich platzieren.

In den unterschiedlichen Bereichen steht eine unterschiedliche Menge an Widgets zur Verfügung. Mit “HTML-Block” und “Einbettung” hat man auch die Möglichkeit, speziellere Inhalte einzubauen. Der HTML-Block macht es möglich, ein Widget selbst mit HTML-Code zu gestalten, oder einen mit dem Webseiten-Modul erstellten Block einzufügen.

Ist man mit dem Layout zufrieden, klickt man auf “Fertig” und man kann es nun für Webseiten verwenden.

Nun wird die Webseite – hier im Beispiel nur zusätzlich mit der Menüleiste – gemäß dem gewählten Layout angezeigt.

Einschränkungen des Webseiten-Moduls

Das Prinzip von Solidified bringt einige systembedingt Einschränkungen mit sich, die insbesondere das Modul “Webseiten” betreffen. Aufgrund der Tatsache, dass Solidified sämtliche Ansichten selbst rendert und nicht das Template-System von Hubzilla nutzt, ist die Erstellung von Webseiten nicht so flexibel wie bei den “klassischen” Themes. Webseiten und Blöcke können mit BBcode, Markdown, HTML und Plaintext erstellt werden.

Stylesheets und eigene Javascript-Routinen sind aktuell nicht möglich. Auch Bootstrap5 steht nicht wie bei den “klassischen” Themes zur Verfügung.

Das Bearbeitungswerkzeug für Layouts funktioniert auch anders, als man es von den “klassischen” Themes kennt. Es ermöglicht eine Anpassung des Solidified-Layouts in bestimmten Grenzen. Man kann Widgets und Elemente im Header, im Inhaltsbereich, im Footer und in der rechten Seitenleiste hinzufügen, bearbeiten und entfernen. Dabei ist man auf die unter Solidified existierenden Widgets beschränkt. Es gibt ein Widget “HTML-Block”, das Standard-HTML Code erlaubt (aber keine Styles und kein Js) oder einen selbst erstellten Block darstellt.

Wer also die CMS-Fähigkeiten von Hubzilla in Hinblick auf die Webseiten-Erstellung voll ausnutzen möchte, muss eines der “klassischen” Themes verwenden, oder sich auf die Fähigkeiten von Solidified beschränken.

@𝓒𝓱𝓻𝓲𝓼 hat aber einen Workaround erarbeitet. Wenn man völlig freie Webseitengestaltung will, selbst aber nicht auf den Komfort von Solidified im selben Kanal verzichten möchte, gibt es eine Lösung:

Man wählt für seinen Kanal ein “klassisches” Theme, also z.B. Redbasic (oder eines der “klassischen” Utsukta-Themes) und bearbeitet im PDL-Editor das Modul “HQ”. Dort bearbeitet man den Quelltext und gibt dort ganz am Anfang

[theme]solidified[/theme]

ein.

Das Theme des Kanals bleibt damit Redbasic und man kann die mit der klassischen Methode erstellten Webseiten betrachten. Besucher des Kanals oder der Webseite bekommen auch immer das Redbasic-Theme präsentiert. Als Kanalbesitzer kann man nun aber HQ aufrufen und bekommt dieses und alle anderen danach besuchten Module mit dem Solidified-Theme angezeigt. Erst bei einem Reload oder dem Aufrufen der Webseite, wechselt auch für den Kanalbesitzer das Theme wieder zu Redbasic, so lange, bis er wieder das HQ aufruft.

Wikis

Das Modul “Wikis” erlaubt das Anbieten von Wikis. Jedes Wiki kann aus einer oder mehreren Wikiseiten bestehen, die, je nach Rechtevergabe, auch gemeinschaftlich gepflegt werden können.

Aktuell wird als Inhaltstyp ausschließlich BBcode unterstützt.

Erstellt man ein Wiki, so muss man diesem einen Titel geben und die Berechtigungen festlegen.

Ruft man nun das neue Wiki auf, wird die automatisch erzeugte Startseite “Home” angezeigt.

Mit dem Button “Bearbeiten” kann man nun den Inhalt gestalten.

Im Beschreibungsfeld für die Bearbeitung sollte man einen kurzen Hinweis über die durchgeführten Änderungen eintragen.

Nach dem Speichern wird nun die neue Version angezeigt.

Mit einem Klick auf den Button Verlauf kann man sich die Versionsverwaltung der Seite anschauen nd Änderungen auch wieder rückgängig machen, wie man es von Wikis kennt.

Editoren

Unter dem Theme Solidified begegnen wir verschiedenen Editoren. Von der Basis her ähneln sie sich alle. Lediglich aufgrund der jeweiligen Nutzung weisen sie verschiedene Features auf.

Ein echter Fortschritt ist, dass die Editoren über einen WYSIWYG-Modus verfügen, der Nutzer sich also nicht unbedingt mit der jeweiligen Textauszeichnungssprache befassen muss.

Da wäre zunächst der Beitragseditor (Posteditor), den wir nutzen, um Beiträge (Startpostings) zu erstellen:

Er bietet die bekannten optionalen Felder für einen Titel, eine Zusammenfassung und Kategorien an.

Über die Schaltfläche “<> Quelltext” kann man zwischen der Quelltext-Ansicht und der Schreiben-Ansicht (WYSIWYG) umschalten.

Man kann den “Modus” des Editors umschalten.

Die Standard-Ansicht ist die Darstellung als modales Fenster. Aktionen sind auf dieses Fenster beschränkt, bis es geschlossen wird.

Ein Klick auf das Minimieren-Icon bewirkt, dass der Editor an den unteren Rand des Browsers minimiert wird.

Klickt man auf das Dock-Icon , wird der Editor unten rechts angedockt. Das angedockte Fenster verhält sich nun nicht mehr modal. Man kann den Rest der Oberfläche weiter bedienen.

Das Maximieren-Icon öffnet einen ganzseitigen Editor im ablenkungsfreien Modus (die Oberfläche von Solidified wird nicht mehr angezeigt).

Das Schließen-Icon schließt den Editor, speichert aber alle Eingaben zwischen. Öffnet man den Editor erneut, sind die bisherigen Eingaben wieder vorhanden. Man kann alternativ auch den Button “Verwerfen” dafür nutzen.

Möchte man die bisherigen eingaben komfortabel in einem Rutsch löschen, muss man das Löschen-Icon neben dem “Verwerfen”-Button nutzen.

Weitere Optionen (Umfrage einfügen, Veröffentlichungs-Datum, Kommentare sperren etc.) findet man im Menü des Buttons “Veröffentlichen”:

Im Gegensatz zu den “klassischen” Themes gibt es bei Solidified einen extra Editor für Direktnachrichten (Messages):

Hier gibt es keinen Titel, keine Zusammenfassung und keine Kategorie, sondern lediglich ein Adressfeld, das bei Auswahl eine Auswahlliste öffnet und nach der Eingabe von Zeichen die passenden Verbindungen filtert. Zusätzlich gibt es die Möglichkeit, die Nachricht über “Bcc hinzufügen” als eigenständige Konversation an weitere Verbindungen zuzustellen.

Der Editor für Webseiten erlaubt die Eingabe eines Seitentitels, einer Zusammenfassung und eines Slugs.

Außerdem kann man eine Vorlage wählen bzw. eigene Vorlagen erstellen.

Als Inhalts-Typen stehen BBcode, HTML, Markdown und Text zur Verfügung.

Der Editor für Wiki-Seiten bietet ein Protokollfeld, in welches man die vorgenommenen Änderungen eingeben kann.

Der Editor für Artikel, also nicht föderierte Blogbeiträge, bietet zusätzlich ein Eingabefeld für ein Slug, um den Artikel über einen sinnvollen Namen n der URL adressierbar zu machen.

Auch Artikel können mit den Inhaltstypen BBcode, HTML, Markdown oder Text erstellt werden.

Im Auswahlfeld “Sprache wählen…” muss man die Sprache des Inhalts angeben. Veröffentlicht man den Artikel in einer weiteren Sprache, kann man bei der Anzeige des Artikels dann zwischen den vorhandenen Sprachen umschalten.

Außerdem ist es möglich, den Artikel als Teil einer Artikelserie zu markieren. Dafür muss man einen Namen für die Serie und den Teil (Nr.) für den Artikel festlegen.

Der Kommentar- bzw. Antworteditor öffnet sich, wenn wir auf einen vorhandenen Beitrag oder Kommentar antworten. Er ist – das liegt in der Natur der Sache – gegenüber den anderen Editoren in der Funktion reduziert und ermöglicht nur das, was in einem Kommentar möglich ist.

Notizen

In Solidified hat Saiwal aus den nicht sonderlich nützlichen Notizen der “klassischen” Themes eine wirklich nutzbare Notiz-App gemacht.

Öffnet man sie, wird ein Inhaltseditor im WYSIWYG-Modus geöffnet. Hier kann man nun eine Notiz erstellen und mittels Strg-Enter oder durch Klick auf den Button “Save” speichern.

Man kann nun entweder die vorhandene Notiz bearbeiten oder eine weitere Notiz erstellen.

Das Bearbeiten oder das Löschen einer Notiz erreicht man durch Klick auf die Buttons “Edit” bzw. “Delete”, die angezeigt werden, sobald sich der Mauszeiger über der Notiz befindet.

Unter Solidified kommen wir also in den Genuss einer echten und gut nutzbaren Notiz-App!

Werkzeuge

Solidified bietet im Navigations-Menü (linke Seitenleiste) eine Sammlung verschiedener Werkzeuge an.

Ein Klick öffnet die Toolbox mit nützlichen Werkzeugen:

1. Ein Taschenrechner:

2. Ein QR-Code Generator:

3. Ein Einheiten-Umrechner:

4. Ein Base64 En-/Decoder:

5. Ein Passwort-Generator:

6. Ein Bild-Editor:

7. Ein Video-Editor:

8. Ein Draw-Programm:

Spiele

Kurze Pause vom Social-Networking gefällig? Nun… da hat Solidified etwas für Euch: Spiele!

Als Gimmick ist in Solidified eine Reihe simpler (aber nicht unbedingt einfacher) Games eingebaut.

Es handelt sich Simon Tatham’s Portable Puzzle Collection. Ich gebe zu… ich kenne von den Spielen nur eine Hand voll (maximal)… Fifteen, Mastermind, Mines, Pegs und Sudoku. Es handelt sich um sogenannte “Puzzle Games”. Die Anleitungen für die Spiele findet man auf der Seite des Entwicklers, der Link dorthin befindet sich unter der Liste der Games in Solidified.

Nicht wirklich essenziell, aber eine nette Zugabe…

Navigationsleiste

In der linken Seitenleiste befindet sich die Navigationsleiste.

Hier sind die verschiedenen Module aufgeführt, um sie schnell aufrufen zu können.

Schnelleinstellungen / Hilfe / Info

Am unteren Ende der Leiste findet man den Umschalter für die Sprache (Hindi, Englisch, Deutsch) und ein Auswahlmenü für den (Farb-) Style des Themes.

Farbeinstellungen

Kontext-Hilfe

Ein weiteres Symbol (“?”) dient zum Aufruf der Kontext-Hilfe. Aktiviert man diesen Modus und klickt auf ein Element auf dem Bildschirm, wird die entsprechende Passage des integrierten Manuals angezeigt (derzeit nur bei Spracheinstellingen “Hindi” und “Englisch” verfügbar).

Siteinfo

Das Symbol “i” öffnet die Seiteninformationen des Hub (siteinfo/).

Gestaltungsmodus

Das Bleistiftsymbol schaltet in den Gestaltungsmodus um. Mit diesem kann man jede Ansicht in gewissem Rahmen gestalten, indem man z.B. Widgets hinzufügt, entfernt, konfiguriert oder verschiebt.

Die Breite von Widgets im Inhaltsbereich lässt sich anpassen.

Die Reihenfolge der Moduleinträge in der Navigationsleiste lässt sich in diesem Modus ebenfalls umsortieren.

Account-Menü

Unmittelbar oberhalb der Schnelleinstellungen befindet sich das Account-Menü (Avatarbild), über welches man Zugriff auf die Kanalverwaltung

Bzw.

und die Einstellungen, sowie auf Login/Logout hat.

Einstellungen

In den Einstellungen sind sämtliche Einstellungsmöglichkeiten zusammengefasst.

Alle Einstellungen, die in den “klassischen” Themes etwas in der Oberfläche verstreut sind, findet man hier an einem Ort.

Im Bereich “Blockierte Kanäle” kann man die Kanäle verwalten, die mit “Superblock” blockiert (temporär stummgeschaltet) wurden.

Der Bereich “Integrationen” ist die App-Verwaltung. In dieser Verwaltung kann man Module/Apps installieren, deinstallieren, teilweise konfigurieren und in der Navigationsleiste anpinnen bzw. von dort entfernen.

Mobile Benutzeroberfläche

Aufgrund seines Designs und der verwendeten Technologie (solid.js) ist Solidified hervorragend für die Nutzung auf mobilen Endgeräten wie z.B. Smartphone oder Tablet geeignet.

Wer bereits einen Account hat, kann sich Hubzilla mit Solidified blitzschnell und ganz einfach als PWA auf das Gerät zaubern.

Was Hubzilla noch fehlt, ist eine achte App z.B. für Android, die auch nach Installation und erstem Start ein komplettes Onboarding (Registrierung oder bei vorhandenem Account das Login) bietet. Doch mit Solidified sind die Grundlagen dafür geschaffen und es dürfte nur noch eine Frage der Zeit sein, dass eine solche App entwickelt wird.

Hier ein paar Beispiele, wie Hubzilla/Solidified auf dem Smartphone aussieht…

HQ:

Beitragseditor:

Netzwerk (Stream):

Listenansicht:

Dateien (Cloud):

Navigationsmenü (erweitert):

Sidebar:

Wie man Hubzilla als PWA nutzt (bis es einmal eine native App gibt), kann man hier nachlesen: Installation PWA.

Einen neuen Kanal anlegen

Das Anlegen eines neuen Kanals hat Saiwal merklich optimiert.

Bei den “klassischen” Themes gibt lediglich einen Kanal- (lang) Namen und einen Kurznamen (Handle-/Webbie-Namen) ein. Dann wird ein Kanal mit der vom System vorgegebenen Kanalrolle erstellt. Zusätzliche, teils wichtige Apps werden nicht installiert.

Für Einsteiger / Neulinge ergeben sich damit Probleme, denn man muss wissen, wie und wo man die Kanalrolle ändert, wo und wie man Apps installiert und welche die wichtigen Apps sind. Nicht wenige denken, Hubzilla funktioniere nicht richtig im Fediverse, weil sie keine Verbindungen zu Nutzern anderer Dienste herstellen können… einfach nur, weil sie die App “ActivityPub-Protokoll” nicht installiert haben… weil sie gar nicht wussten, dass dies für diese Zwecke (Fediverse-Teilnahme) erforderlich ist.

Erzeugt man mit Solidified einen neuen Kanal, so wird ein neu gestalteter Assistent aufgerufen, welcher diese wichtigen Schritte abarbeitet.

Zunächst werden Kanalname und Kurzname wie bisher abgefragt. Zusätzlich wird aber auch nach der gewünschten Kanalrolle gefragt.

Also z.B.:

Im nächsten Schritt wird ermöglicht, weitere Kommunikationsprotokolle zu aktivieren. So auch ActivityPub. Es gibt Erläuterungen dafür, wozu die Protokolle dienen.

Danach werden einige sinnvolle Apps zur automatischen Installation vorgeschlagen.

Im vorletzten Schritt kann der Stil des Solidified-Themes ausgewählt werden.

Im letzten Schritt schließlich, werden die gewählten Einstellungen noch einmal zusammengefasst, und man kann durch Klick auf den Button “Kanal erstellen” den neuen Kanal erzeugen.

Dieser Assistent senkt die Hürde für Einsteiger enorm, ist aber auch für erfahrene Nutzer ungemein praktisch.

Creating a new channel

Saiwal has significantly optimised the process of creating a new channel.

With the ‘classic’ themes, you simply enter a (long) channel name and a short name (handle/Webbie name). A channel is then created with the channel role specified by the system. Additional apps – some of which are important – are not installed.

This causes problems for beginners and newcomers, as you need to know how and where to change the channel role, where and how to install apps, and which apps are essential. Quite a few people think that Hubzilla doesn’t work properly in the Fediverse because they can’t connect to users on other services… simply because they haven’t installed the ‘ActivityPub Protocol’ app… because they didn’t even know that this is required for this purpose (participating in the Fediverse).

When you create a new channel using Solidified, a redesigned wizard is launched which guides you through these important steps.

First, you’re asked for the channel name and nickname, as before. However, you’re also asked to select your preferred channel role.

For example:

The next step allows you to enable further communication protocols, including ActivityPub. There are explanations of what these protocols are used for.

After that, a few useful apps are suggested for automatic installation.

In the step before the last, you can select the style of the Solidified theme.

Finally, in the last step, the selected settings are summarised once more, and you can create the new channel by clicking the ‘Create channel’ button.

This wizard makes it much easier for beginners to get started, but is also incredibly useful for experienced users.

Das Item-Menü (“Beitrags-Menü”)

Unten rechts findet man bei Beiträgen das Item-Menü “⋮” (Weitere Aktionen), mit welchem man weitere Funktionen für einen Inhalt erreichen kann.

• Folgen / Entfolgen dient dazu einem Thread zu folgen, also über Aktivitäten, welche den Thread betreffen (z.B. Kommentare, Likes etc.), benachrichtigt zu werden.

• Statistiken zeigt an, welche Nutzer einen Inhalt mit einem Like/Dislike markiert hat und welcher Nutzer den Inhalt wiederholt hat. Dieser Menüpunkt wird nur angezeigt, wenn es Likes/Dislikes und/oder Repeats gibt.

  

• Quelltext ansehen zeigt den Quelltext des Inhalts inklusive id, uid, plink (Link auf der Ursprungs-Instanz) und llink (Link auf der eigenen Instanz).

  

• Ursprünglicher Beitrag ist der Link zum Inhalt auf der Ursprungs-Instanz.

• Aktualisieren

• Zustellbericht (nur bei eigenen Inhalten)

• Bearbeiten (nur bei eigenen Inhalten)

• Löschen (nur bei eigenen Inhalten)

• Aus deinem Feed entfernen (bei fremden Inhalten)

Messenger

Ein wirklich nützliches Modul bei Solidified ist der Messenger.

Als seinerzeit aus guten Gründen die “Mails” aus Hubzilla verschwunden sind (mit Version 7) und komplett auf echte Direktnachrichten umgestellt wurden, ist auch die “Mail-App” verabschiedet worden. Direktnachrichten werden wie normale Postings angezeigt. Man kann sie lediglich im Stream filtern und sich so nur Direktnachrichten anzeigen lassen.

Damit ist ein Stück Komfort verlorengegangen, denn bei längeren Dialogen/Threads wird es schnell unübersichtlich.

Auch bei Solidified kann man sich per Filter die Direktnachrichten aus dem Stream gefiltert anzeigen lassen… mit den selben Nachteilen bezüglich der Übersichtlichkeit.

Solidified bietet aber auch das Modul “Messenger”, der zwar nichts am Prinzip der Direktnachrichten als Posting mit Privacy-Tag (@!)ändert, die Messages aber in einer sehr übersichtlichen Art präsentiert.

In der linken Seitenleiste des Messengers werden die einzelnen Dialoge/Threads aufgelistet. Ein hier ausgewählter Thread wird im Inhaltsbereich des Messengers (rechts) dann angezeigt.

Um auf wichtige oder aktive Threads schnell zugreifen zu können, lassen sich diese in der Threadliste (Seitenleiste) über das Pinnadel-Symbol oben anheften.

Man kann einen Thread aber auch über das Pinnadel-Symbol über dem Inhaltsbereich anpinnen.

Neben diesem Symbol befindet sich ein Sprechblasen-Symbol, mit weichem man sich den Thread als Overlay in der klassischen Ansicht anzeigen lassen kann.

Mit dem Bleistiftsymbol kann man einen neuen Thread erzeugen, also eine neue Direktnachricht erstellen.

Im Messenger-Modul lassen sich ebenfalls die Chaträume verwalten.

Das Messenger-Modul bietet ein modernes, funktionales und bequemes Handlich für eingeschränkte Nachrichten und erlaubt zusätzlich den Zugriff auf Chaträume.

Weshalb das Modul so heißt, wie es heißt, offenbart sich auf den ersten Blick: Es sieht aus wie ein typischer Messenger!