Die Funktionalität dieses Theme-Components wurde ab Version 2.8.0 in den Discourse-Kern integriert. Wenn Sie es nach einem Upgrade auf eine neuere Version weiterhin verwenden, werden Sie kaum Freude daran haben!
Ich habe einen Theme-Component erstellt, um die Darstellung von persönlichen Nachrichten-Beiträgen in Sprechblasen zu ändern, damit sie besser von Themen zu unterscheiden sind.
Einstellungen:
Legen Sie die Hintergrundfarbe der Sprechblase auf eine der Primär-, Sekundär- oder Tertiärfarben Ihres Themas oder eine Auswahl anderer gängiger Farben fest.
Wählen Sie verschiedene Farben, um gesendete Nachrichten von empfangenen Nachrichten zu unterscheiden.
Stellen Sie die Hintergrundtransparenz der Sprechblase ein – je höher der Prozentsatz, desto intensiver die Farbe.
Entscheiden Sie, ob die Sprechblase mit einem Schlagschatten angezeigt werden soll.
Optional können Sie dem Button „Nachricht antworten" einen Text anfügen, um ihn vom Button „Thema antworten" zu unterscheiden.
Sie können aus einer Reihe von Farben wählen oder Farben aus Ihrer Palette auswählen, um sie an Ihr Theme anzupassen. Außerdem können Sie die Hintergrundtransparenz der Sprechblase relativ zur Farbe und zum Hintergrund einstellen.
Ich bin neugierig auf etwas, da ich noch nie mit Plugins gearbeitet habe…
Ist es möglich, einen Hex-Code mit Opazität zu verwenden, anstatt nur Systemfarben zuzulassen? Kein Problem, falls das sehr viel zusätzliche Arbeit bedeutet. Ich bin nur neugierig.
Was ist, wenn ich das Styling ändern möchte? Den Schatten oder anderes CSS? Ich bin mit GitHub und der Funktionsweise nicht so vertraut, aber ich habe vor dem Kopieren in meine Theme-Komponenten in dein .git-Repository geschaut. CSS schreiben kann ich jedoch. Kann ich eine Kopie deines Plugins erstellen, dann die CSS-Datei anpassen und diese als neues Theme-Komponente mit dem gewünschten Styling hochladen?
Wenn du mir Hinweise geben könntest, wie man ein Plugin modifiziert, wäre das großartig. Oder ich könnte einfach ein CSS-Override im Frontend vornehmen. Ist eine Option in Bezug auf die Leistung besser als die andere?
Nochmals … Vielen Dank dafür … es ist genau die Lösung, die ich gesucht habe, um DMs von regulären Themen zu unterscheiden!
Vielen Dank @jord8on. Es ist großartig, solches Feedback zu erhalten.
Ich werde den Schlagschatten als Einstellungsoption anpassbar machen.
Bezüglich des Erstellens/Bearbeitens Ihres eigenen CSS ist es einfach. Laden Sie die Komponente, und klicken Sie dann im Bereich der Komponenteneinstellungen auf den Abschnitt „Benutzerdefiniertes CSS/HTML".
Bearbeiten Sie einfach das CSS-Sheet und klicken Sie auf Speichern. Dies sind Ihre eigenen Anpassungen. Wenn Sie diese teilen und in die Komponente integrieren möchten, damit alle davon profitieren können, können Sie das CSS einfach in diesem Thema im Discourse-Meta-Bereich posten – oder als langfristiges Ziel lernen, wie man Pull Requests auf GitHub erstellt und/oder das Repository forkt, wenn Sie umfangreichere Änderungen vornehmen.
Das ist eine so einfache Lösung, um DMs deutlich von den Standard-Themen in unserem Forum abzugrenzen.
Ich habe gerade ein Mitglied gefragt, was es davon hält, und es war soooo glücklich darüber. Es hat die Idee und die Umsetzung gelobt, also leite ich das einfach an dich weiter!!
HTML-Farbcodes (#000000 black, #FFFFFF white usw. oder Kurzcodes, z. B. #CCC)
Theme-Farbnamen (primary, secondary, tertiary)
Sie können auch Ihre eigenen Textfarben für Nachrichten auf die gleiche Weise eingeben, um einen Kontrast zur Sprechblasenfarbe zu erzielen.
Mit der Opazitätseinstellung können Sie die Sprechblasenfarbe mit dem Hintergrund mischen, sodass sich die Farbe je nach Ihren Theme-Farbeinstellungen ändert – z. B. für helle und dunkle Themes.
Dieses Update ist abwärtskompatibel. Um auf diese Funktion zuzugreifen, klicken Sie in den Theme-Einstellungen auf den Button „Nach Updates suchen".
Ich habe mit benutzerdefiniertem CSS die Ränder deaktiviert und nur eine subtile Farbänderung vorgenommen, was gut aussieht. Es wäre toll, wenn es dafür eine Option gäbe, die Ränder anzupassen oder einfach einen Ein-/Ausschalter.
Übrigens, wie Sie sehen können, habe ich die Komponente zweimal installiert und dunkle Farben für unser dunkles Theme sowie helle Farben für unser helles Theme festgelegt. Ich denke, es gibt keine andere Möglichkeit, wenn wir benutzerdefinierte CSS-Farben verwenden möchten.
Außerdem eine kleine Anregung: Sie erlauben das Anhängen an das Ende des Antwort-Buttons, aber in einigen Sprachen (wie dem Türkischen) ist es vorzuziehen, etwas an den Anfang zu stellen, da das Verb in diesen Sprachen am Ende des Satzes steht.
Ja, das ist eine gute Lösung. Hat die geplante Änderung in Discourse, die Möglichkeit zu entfernen, Discourse-Themen und -Komponenten lokal zu modifizieren, Auswirkungen auf Ihre Implementierung? Das war hier eindeutig nützlich.
Ich habe mich auf diese Ankündigung im Beta-Release bezogen. Du kannst zwar weiterhin CSS ändern, musst aber eine neue Theme-Komponente erstellen, die nicht mehr mit dem Git-Repository verknüpft ist, und den gesamten Code kopieren. Hast du das gemacht – oder hast du die einfache Lösung gewählt und das CSS direkt in der Komponente bearbeitet?
Das erscheint mir problematisch. Ich würde es vorziehen, die Möglichkeit zu behalten, Themes vor Ort zu bearbeiten. Das hilft definitiv bei der Entwicklung von Themes und Komponenten.
Ich habe eine lokale Komponente namens „common sub-theme“, in der ich Änderungen für andere Komponenten vornehme. Dabei adressiere ich innerhalb dieses Sub-Themes Klassen, Elemente usw. anderer Komponenten. Solange der Autor der Komponente die Namen seiner Klassen, IDs usw. nicht ändert, ist das in Ordnung und funktioniert. Da Sie mittlerweile auch die Entfernung der Rahmen integriert haben, benötige ich übrigens keine Anpassungen in meinem Sub-Theme für die Komponente „Personal Message Bubbles“.
Hallo und vielen Dank für diese wunderbare Theme-Komponente.
Ein möglicher Fehler: Es scheint, als ob die Option für angehängten Text vor dem String am unteren Rand des Nachrichtenthemas ein Leerzeichen enthält, dies jedoch nicht im Editor-Fenster der Fall ist. Siehe unten:
@Rhidian, könntest du auch die Option hinzufügen, dem Antwort-Button Text voranzustellen? In einigen Sprachen (wie dem Türkischen) wäre es sinnvoll, einem Verb am Anfang einen Text hinzuzufügen.
Tolle Komponente! Haben wir etwas Ähnliches für echte Beiträge in Themen? Ich meine eine Komponente, die Beiträge wie Nachrichtenblasen aussehen lässt!