Hashtags bekommen ein #Neugestaltung

Ankündigungen
,
1

Discourse unterstützt seit langem das Verknüpfen von Kategorien (Announcements) und Tags (release-notes) mit Hashtags (#). Mit der Einführung von Discourse Chat wollten wir Chat-Kanälen mit Hashtags verknüpfen können, was einige Überarbeitungen der Funktionsweise erforderte, um Kanäle mit Autovervollständigung vorschlagen zu können und auch in Beiträgen und Chat-Nachrichten zu verarbeiten. Wir haben uns auch entschieden, die Gestaltung des Autovervollständigungsmenüs und der verarbeiteten Hashtags zu überarbeiten.

Eine Zusammenfassung der Änderungen, die mit dieser Überarbeitung einhergehen:

  • Die Möglichkeit, nach Chat-Kanälen zu suchen, wenn Sie Chat aktiviert haben
  • Hashtag-Suchergebnisse priorisieren exakte Übereinstimmungen basierend auf dem Slug, und je nachdem, ob Sie sie in einem Beitrag oder einer Chat-Nachricht verwenden, priorisieren wir unterschiedliche Arten von Ergebnissen (z. B. sind Kategorien in einem Beitrag oben, Kanäle aber im Chat oben)
  • Für jedes Ergebnis wird ein eindeutiges Symbol angezeigt
  • Ein neuer Stil für verarbeitete Hashtags, der das eindeutige Symbol enthält

Die neuen Autovervollständigungsergebnisse:

image
image574×434 20.8 KB

Der neue verarbeitete Stil für die Hashtag-Autovervollständigung, der dem @mention-Stil sehr ähnlich ist.

image
image1567×376 51.4 KB

Sie können diese neue Version der Hashtag-Autovervollständigung und -Verarbeitung aktivieren, indem Sie die Website-Einstellung enable_experimental_hashtag_autocomplete auf Ihrer Discourse-Website aktivieren:

image
image1493×163 18.7 KB

Wir erwarten, dass dies im neuen Jahr zum Standard wird. In der Zwischenzeit gilt dies immer noch als experimentelle Funktion, sodass noch einige Dinge zu beheben und zu verfeinern sind.

Diese Funktion ist jetzt auch auf Discourse Meta aktiviert :sparkles:

42 „Gefällt mir“
2

Ein Beispiel für diese neuen Hashtags auf Meta. Warum nicht Announcements ausprobieren? Oder release-notes durchlesen!

12 „Gefällt mir“
3

23 Beiträge wurden in ein neues Thema aufgeteilt: Farbe und Unterkategorien-Styling zu Kategorie- und Chat-Erwähnungen hinzufügen

5

Hier ist ein kurzes Beispiel, wie es aussieht, wenn man von einem Beitrag aus auf einen Chat-Kanal verlinkt: #general::channel

Und hier ist ein kurzes Beispiel, wie es aussieht, wenn man von einem anderen Chat-Kanal aus auf einen Chat-Kanal verlinkt:

7 „Gefällt mir“
21

Ein Beitrag wurde in ein neues Thema aufgeteilt: Bestehende Hashtags in das neue Design ändern

22

Ein Update hier – wir haben dies nun zum Standard für alle Websites gemacht, nachdem wir einige Änderungen an der Art und Weise vorgenommen haben, wie die Hashtags verarbeitet werden. Wir zeigen nun auch Farben für die Symbole an, einschließlich des ursprünglichen Unterkategorien-Stylings :rainbow: :\n\n#support Feature #general::channel Announcements > Blog \n\nhttps://github.com/discourse/discourse/pull/21788\n\nBald wird auch der alte Code, der sich auf das vorherige Hashtag-System bezieht, gelöscht.

16 „Gefällt mir“
23

Das sieht sehr gut aus. Aber wie funktioniert das für sehbehinderte Menschen? Ich vermute, dass bei

accessibility General #general::channel #documentation:devs

aria-Labels fehlen könnten… Hier ist die passende HTML-Vorschau.

<p dir="ltr">
<a class="hashtag-cooked" href="/tag/accessibility" data-type="tag" data-id="109" data-slug="accessibility" tabindex="-1">
  <svg class="fa d-icon d-icon-tag svg-icon hashtag-color--tag-109 svg-string" xmlns="http://www.w3.org/2000/svg">
    <use href="#tag"></use>
  </svg>
  <span>accessibility</span>
</a> 
<a class="hashtag-cooked" href="/c/general/124" data-type="category" data-id="124" data-slug="general" tabindex="-1">
  <span class="hashtag-category-badge hashtag-color--category-124"></span>  
  <span>General</span>
</a> 
<a class="hashtag-cooked" href="/chat/c/general/508" data-type="channel" data-id="508" data-slug="general" tabindex="-1">
  <svg class="fa d-icon d-icon-comment svg-icon hashtag-missing svg-string" xmlns="http://www.w3.org/2000/svg">
    <use href="#comment"></use>
  </svg>
  <span>general</span>
</a> 
<a class="hashtag-cooked" href="/c/documentation/devs/56" data-type="category" data-id="56" data-slug="devs" tabindex="-1">
  <span class="hashtag-category-badge hashtag-color--category-56"></span>
  <span>developers</span>
</a>
</p>
7 „Gefällt mir“
24

Danke für den Hinweis, das ist ein wichtiger Punkt. Zumindest einige aria-labels für jeden Hashtag sind angebracht. Ich werde versuchen, diese Woche einen Commit dafür zu erstellen.

7 „Gefällt mir“
28

Ältere Themen verwenden das neue Format für Tags und Kategorien erst, wenn das HTML neu erstellt wird. Gibt es eine Möglichkeit, alle Themen sicher neu zu erstellen, um die Benutzeroberfläche konsistent zu gestalten? Vielleicht mit rake?

So etwas? Habe es nicht getestet!

./launcher enter app
rake posts:rebake
2 „Gefällt mir“
29

Ich glaube, dieser hier ist gezielter:

Beim bundle exec-Teil bin ich mir aber nicht sicher. Ich weiß nicht, ob das für eine Live-Seite benötigt wird?

5 „Gefällt mir“
30

Ohne bundle exec scheint es auf einer Produktionsseite zu funktionieren :slight_smile:

root@Canapin-app:/var/www/discourse# rake hashtags:mark_old_format_for_rebake
Posts mit altem Format werden gesucht, das kann einige Zeit dauern...
[!] Sie sind dabei, 0 Beiträge mit Hashtags im alten Format zum erneuten Backen zu markieren. [CTRL+c] zum Abbrechen, [ENTER] zum Fortfahren

Fertig, erneutes Backen findet statt, wenn der periodische Update-Job läuft.
6 „Gefällt mir“