Diskussionsforum: Themenliste, Autor und Poster

[Lilly]

	Zusammenfassung	Fügt den Autor eines Themas in die linke Spalte der Themenlisten-Seiten ein und bietet zudem die Option, nur den letzten Poster in der Standard-Poster-Spalte anzuzeigen. Das Avatar des Autors kann zudem in Größe und Form angepasst werden.
	Vorschau	https://discourse.theme-creator.io/theme/Lilly/discourse-topic-list-author-posters
	Repository	https://github.com/Lillinator/discourse-topic-list-author-posters
	Installationsanleitung	So installieren Sie ein Theme oder eine Theme-Komponente
	Neu bei Discourse-Themes?	Anfängerleitfaden zur Verwendung von Discourse-Themes

Dieses Theme-Modul installieren

Überblick

Diese Discourse-Theme-Komponente fügt das Avatar des Thementheaters in die erste Spalte aller Routen für Themenlisten ein und verfügt über Einstellungen, mit denen der Administrator die Form und Größe des Avatars festlegen kann. Zudem wird das Avatar des Autors nicht als erstes Avatar in der Liste der Poster angezeigt.

Es gibt zudem eine Einstellung, damit die Spalte mit den Poster-Avataren nur den letzten (jüngsten) Poster anzeigt, jedoch nur, wenn mehr als ein Teilnehmer am Thema beteiligt ist. Das Avatar des Autors wird also nur angezeigt, wenn weitere Poster im Thema vorhanden sind.

Darüber hinaus können Administratoren entscheiden, ob das Avatar des Thementheaters auf der Kategorie-Seite angezeigt werden soll, wenn die Ansicht der neuesten Themenlisten aktiviert ist (d. h.: „Kategorien mit neuesten Themen“). Auch hier stehen Optionen zur Größe und Form des Avatars zur Verfügung.

Zusätzlich gibt es einen Schalter zur vertikalen Ausrichtung des Zeileninhalts oben oder mittig.

In kleinen Viewports (Mobile-Größe) erscheint der Autor dort, wo normalerweise das Avatar des letzten Posters angezeigt wird.

Diese Komponente funktioniert gut mit Auszügen aus Themenlisten und Discourse-AI-Zusammenfassungen von Gists.

Einstellungen

Screenshot der Einstellungen mit Standardoptionen auf der Admin-Seite der Komponente

Einstellungen	Beschreibung
Größe des Thementheaters-Avatars in der Themenliste	Größe der Avatare in der Spalte für das Autor-Avatar auf den Routen der Themenlisten-Seiten – small, medium oder large.
Eckenradius des Thementheaters-Avatars in der Themenliste	Abrundung der Avatare auf den Routen der Themenlisten-Seiten: 0% = quadratisch → 50% = kreisförmig. tab_style = abgerundete linke Ecken
Nur letzten Poster in der Themenliste anzeigen	Zeigt nur das Avatar des letzten Posters in der Poster-Spalte an, jedoch nur, wenn mehr als ein Teilnehmer am Thema beteiligt ist.
Zeileninhalte vertikal oben ausrichten	Schalter zum vertikalen Ausrichten der Zeilen oben oder mittig
Autor auf der Kategorie-Seite anzeigen	Zeigt das Avatar des Autors anstelle des letzten Posters in den Themenlisten auf der Kategorie-Seite an.
Größe der Avatare auf der Kategorie-Seite	Größe der Avatare in der Spalte für das Autor-Avatar in den Themenlisten auf der Kategorie-Seite – small, medium oder large.
Eckenradius der Avatare auf der Kategorie-Seite	Abrundung der Avatare auf der Kategorie-Seite: 0% = quadratisch → 50% = kreisförmig. tab_style = abgerundete linke Ecken

Screenshots

Hier sind einige Screenshots mit verschiedenen Einstellungen für Avatar-Größe und -Form, ebenfalls mit erweiterten AI-Zusammenfassungen von Gists.

Screenshots verschiedener Themenlisten-Seiten mit aktivierten Komponenten-Einstellungen, die sowohl den kompakten als auch den erweiterten Gist-Modus sowie die ein- und ausgeklappte Seitenleiste zeigen

Mit Standardeinstellungen:

Große tab_style-Avatar-Form mit erweiterten Zusammenfassungs-Gists:

Kleine Avatare mit 15%-Eckenradius und aktiviertem Topic_list_show_last_poster_only:

Mittlere Avatare mit 0%-Eckenradius (quadratisch), aktiviertem Topic_list_show_last_poster_only und erweiterten Zusammenfassungs-Gists:

Screenshots der Kategorie-Seite mit zwei verschiedenen Größen und Formen von Avataren, entweder mit Autor oder letztem Poster.

Standardeinstellungen der Komponente mit mittelgroßen runden Avataren und aktiviertem Show_author_on_categories_page:

Große tab_style-Avatare und deaktiviertes Show_author_on_categories_page:

Screenshot der mobilen Ansicht

Mit tab_style-Autor-Avataren:

---

Hinweise

• Fügt das Avatar des Autors ein und ändert die Poster-Spalte dort, wo dies auf den Registerkarten der Profilseite erwartet wird.
• Das Verhalten auf mobilen Geräten entspricht dem Standard in den Footer-Listen von Themen (vorgeschlagene/bezogene Themen) sowie auf den Registerkarten für Profil und Posteingang.
• Nicht wirklich kompatibel mit dem Horizon-Theme.

---

Mögliche zukünftige Aufgaben

• Schalter zum Deaktivieren auf mobilen Geräten hinzufügen?
• Ausnahmen für Kategorien und Tags?
• Unterstützung für Links-nach-Rechts-Schreibweise?
• Form der Poster-Avatare anpassen?

Wie immer vielen Dank an @Moin für die Idee, das Feedback und die Hilfe beim Debuggen.

---

Schauen Sie sich meine anderen Discourse-Projekte an

[jordanjay29]

Vielen Dank für die Erstellung, es hat sofort ein potenzielles Problem für mich gelöst!

@Lilly

Weitere Styling-Verbesserungen

Vielleicht ist dies bereits geplant, ich wollte nur erwähnen, dass mir aufgefallen ist, dass der Abstand und die Ausrichtung der Poster-Avatar-Spalte auf der linken Seite eine seltsame Einrückung aufweisen (die auf Mobilgeräten nicht vorhanden ist, wenn die Komponente deaktiviert ist, zum Vergleich). Dies sieht so aus, als ob das text-align-Attribut von td.posters auch das Bild beeinflusst.
Die Ausrichtung der Poster-Avatar-Liste ändert sich ebenfalls, wenn sie aktiviert ist, und dies sieht so aus, als ob die Ausrichtung von td.topic-list-data die Standardeinstellung überschreibt. Es ist einfach genug, Änderungen am Stylesheet auf meiner Seite vorzunehmen, wenn Sie mit diesen ansonsten zufrieden sind.

Fantastische Komponente, nochmals vielen Dank.

[Lilly]

Danke für den Bericht, ich habe gerade einen Fix gepusht. Aktualisieren Sie die Komponente und lassen Sie mich wissen, ob das hilft.

[jordanjay29]

Die Avatar-Linksbündelung ist auf dem Desktop besser. Ich habe dieses CSS hinzugefügt, um die Spalte des mittleren Posters meinen Präferenzen anzupassen:

td.posters.topic-list-data {
    vertical-align: middle !important;
}

Ich denke, Ihre zukünftige Deaktivierung für Mobilgeräte wird auch helfen, da das Styling etwas mehr Leerraum verwendet als nötig.

[Lilly]

[quote=“jordanjay29, post:4, topic:394364”]Die Avatar-Linksbündelung ist auf dem Desktop besser. Ich habe diesen CSS-Code hinzugefügt, um die Spalte des mittleren Posters nach meinen Wünschen anzupassen:

[/quote]
Die vertikale Ausrichtung oben ist beabsichtigt, um konsistent mit dem Rest der Themenkarte zu sein, und wird nicht geändert.
Ich habe keine Änderungen für Mobilgeräte vorgenommen, aber ich werde es mir ansehen.

[jordanjay29]

Die vertikale Ausrichtung wurde möglicherweise zu breit in Ihrem CSS angewendet und muss wahrscheinlich nur auf die custom-author-column abzielen, wo Sie td.topic-list-data verwenden. Ich vermute, dass die Änderung des Ziels auf td.custom-author-column.topic-list-data das Problem beheben und die Notwendigkeit benutzerdefinierter Formatierung auf meiner Seite beseitigen wird.

[Lilly]

Nein, ich beabsichtigte, dass die Spalte „Poster“ zusammen mit allen anderen Zeilenelementen oben vertikal ausgerichtet wird. Sie wirkt mittig ausgerichtet deplatziert (besonders wenn man Auszüge oder KI-Gists aktiviert), aber ich nehme an, es ist Geschmackssache, also können Sie es nach Belieben anpassen.

Ich habe eine kleine Änderung für Mobilgeräte eingespielt.

[jordanjay29]

Da mein Forum keine Auszüge, Gists oder KI-Zusammenfassungen verwendet, wird das Standard-Discourse-Aussehen bevorzugt. Diese Änderung scheint mir eher in eine dedizierte Theme-Komponente zu gehören, aber wir sind uns uneinig, und ich habe es auf meiner Seite behoben, also keine böse Überraschung.

Mobil sieht etwas besser aus, danke!

[Lilly]

@jordanjay29 nach weiterem Nachdenken habe ich mich entschieden, einen Ausrichtungsumschalter hinzuzufügen (ganz einfach).

Hier, bitte schön

Es gibt eine neue Einstellung Vertikale Ausrichtung der Zeile oben, die Sie deaktivieren können, um die Standardeinstellung in der Mitte zu erhalten. Lassen Sie mich wissen, ob das für Sie funktioniert.