Discourse Themenliste Autor & Poster

:information_source: Zusammenfassung Fügt einen Themenautor zur linken Spalte von Themenlistenseiten hinzu, sowie eine Option, nur den letzten Poster in der Standard-Poster-Spalte anzuzeigen. Der Avatar des Autors kann auch in Größe und Form angepasst werden.
:eyeglasses: Vorschau https://discourse.theme-creator.io/theme/Lilly/discourse-topic-list-author-posters
:hammer_and_wrench: Repository https://github.com/Lillinator/discourse-topic-list-author-posters
:question: Installationsanleitung Ein Thema oder eine Themenkomponente installieren
:open_book: Neu bei Discourse-Themen? Anfängerleitfaden zur Verwendung von Discourse-Themen

Diese Themenkomponente installieren

:woman_technologist:t2: Übersicht

Diese Discourse-Themenkomponente fügt einen Themenautoren-Avatar in die erste Spalte aller Themenlisten-Routen ein und verfügt über Einstellungen, mit denen der Administrator die Avatar-Form und -Größe festlegen kann. Außerdem wird der Avatar des Autors nicht als erster Avatar in der Posterliste angezeigt.

Es gibt auch eine Einstellung, um in der Poster-Avatar-Spalte nur den neuesten (aktuellsten) Poster anzuzeigen, dies gilt jedoch nur, wenn mehr als ein Teilnehmer am Thema beteiligt ist. Der Avatar des Autors wird also nur angezeigt, wenn es andere Poster im Thema gibt.

Darüber hinaus können Administratoren wählen, ob der Themenautor auf der Kategorieseite angezeigt werden soll, wenn die neuesten Themenlistenansichten aktiviert sind (d. h. „Kategorien mit neuesten Themen“), und es gibt auch Optionen für Avatar-Größe und -Form.

Es gibt auch einen Schalter, um den Zeileninhalt oben oder mittig vertikal auszurichten.

Bei kleinen Ansichtsfenstern (mobiler Größe) wird der Autor dort angezeigt, wo sich der Avatar des letzten Posters befindet.

Dieses Thema funktioniert gut mit Topic List Excerpts und Discourse AI summary gists.

:gear: Einstellungen

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

Einstellungen Beschreibung
Topic list author avatar size Größe der Avatare in der Autoren-Avatar-Spalte der Themenlistenseiten-Routen – small, medium oder large.
Topic list author avatar border radius Avatar-Rundung auf Themenlistenseiten-Routen: 0% = quadratisch → 50% = kreisförmig. tab_style = links abgerundete Ecken
Topic list show last poster only Zeigt nur den Avatar des letzten Posters in der Poster-Spalte an, aber nur, wenn mehr als ein Teilnehmer am Thema beteiligt ist.
Vertically align row top Schalter zum Ausrichten der Zeilen oben oder mittig
Show author on categories page Zeigt den Autoren-Avatar anstelle des letzten Posters in Themenlisten auf der Kategorieseite an.
Category page topic avatar size Größe der Avatare in der Autoren-Avatar-Spalte in Themenlisten auf der Kategorieseite – small, medium oder large.
Category page avatar border radius Avatar-Rundung auf Kategorieseiten: 0% = quadratisch → 50% = kreisförmig. tab_style = links abgerundete Ecken

:camera_flash: Screenshots

Hier sind einige Screenshots mit verschiedenen Einstellungen für Avatar-Größe und -Form, die auch mit erweiterten KI-Zusammenfassungs-Gists angezeigt werden.

Screenshots verschiedener Themenlistenseiten mit aktivierten verschiedenen Komponenten-Einstellungen, die sowohl kompakte als auch erweiterte Gist-Modi sowie erweiterte/eingeklappte Seitenleiste zeigen

Mit Standardeinstellungen:

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

Kleine Avatare mit 15% Randradius-Form und Topic_list_show_last_poster_only aktiviert:

Mittelgroße Avatare mit 0% Randradius (quadratisch) mit Topic_list_show_last_poster_only aktiviert, und erweiterte Zusammenfassungs-Gists:

Screenshots der Kategorieseite, die 2 verschiedene Größen & Formen von Avataren mit Autor oder letztem Poster zeigen.

Standard-Komponenteneinstellungen, mit mittelgroßen runden Avataren und Show_author_on_categories_page aktiviert:

Große tab_style Avatare und Show_author_on_categories_page deaktiviert:

Screenshot der mobilen Ansicht

Mit tab_style Autoren-Avataren:


:backhand_index_pointing_right:t3: Hinweise

  • Fügt den Avatar des Autors ein und ändert die Poster-Spalte, wie in den Registerkarten der Profilseite erwartet.
  • Das Verhalten auf Mobilgeräten ist dasselbe wie das Standardverhalten in Themenfußzeilenlisten (vorgeschlagene/verwandte Themen) und auf Profil- und Posteingangs-Tab-Seiten.
  • Nicht wirklich kompatibel mit dem Horizon-Theme. :slight_smile:

:bulb: Mögliche zukünftige Aufgaben

  • Deaktivierungsschalter für Mobilgeräte hinzufügen?
  • Kategorie- und Tag-Ausnahmen?
  • Unterstützung von Links von links nach rechts (Left-to-right support)?
  • Poster-Avatare formen?

:hugs: Wie immer, vielen Dank an @Moin für die Idee, das Feedback und die Debugging-Hilfe.

13 „Gefällt mir“

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

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.

1 „Gefällt mir“

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

1 „Gefällt mir“

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.

[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.

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.

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.

3 „Gefällt mir“

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!

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

Hier, bitte schön :slight_smile:

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.


4 „Gefällt mir“