Gli hashtag stanno subendo una #rivoluzione

Annunci
,
1

Discourse supporta da tempo il collegamento a categorie (Announcements) e tag (release-notes) utilizzando gli hashtag (#). Con l’introduzione di Discourse Chat, abbiamo voluto poter collegare i canali di chat con gli hashtag, il che ha richiesto una revisione di come funziona il sistema per consentire la suggerimento dei canali con autocompletamento e anche per la cottura nei post e nei messaggi di chat. Abbiamo anche deciso di dedicare del tempo a rivedere il design del menu di autocompletamento e degli hashtag cotti.

Un riepilogo delle modifiche incluse in questa revisione:

  • La possibilità di cercare canali di chat se si dispone della chat abilitata
  • I risultati della ricerca hashtag danno priorità alle corrispondenze esatte in base allo slug e, a seconda che li si utilizzi in un post o in un messaggio di chat, diamo priorità a diversi tipi di risultati (ad esempio, le categorie sono in cima in un post, ma i canali sono in cima in chat)
  • Viene mostrata un’icona distinta per ogni risultato
  • Un nuovo stile per gli hashtag cotti che includono l’icona distinta

I nuovi risultati di autocompletamento:

image
image574×434 20.8 KB

Il nuovo stile cotto per l’autocompletamento degli hashtag, che corrisponde strettamente allo stile @mention.

image
image1567×376 51.4 KB

È possibile scegliere di utilizzare questa nuova versione dell’autocompletamento e della cottura degli hashtag abilitando l’impostazione del sito enable_experimental_hashtag_autocomplete sul tuo sito Discourse:

image
image1493×163 18.7 KB

Prevediamo di renderla predefinita nel nuovo anno, nel frattempo questa è ancora considerata una funzionalità sperimentale, quindi ci sono ancora alcune cose da correggere e perfezionare.

Questa funzionalità è ora abilitata anche su Discourse Meta :sparkles:

42 Mi Piace
2

Un esempio di questi nuovi hashtag su Meta. Perché non dare un’occhiata a Announcements? O leggere alcune release-notes!

12 Mi Piace
3

23 post sono stati spostati in un nuovo argomento: Aggiungi colore e stile di sottocategoria ai menzioni di categoria e chat

5

Ecco un rapido esempio di come appare il collegamento a un canale di chat da un post: #general::channel

Ed ecco un rapido esempio di come appare il collegamento a un canale di chat da un altro canale di chat:

7 Mi Piace
21

Un post è stato diviso in un nuovo argomento: Cambia hashtag esistenti nel nuovo design

22

Un aggiornamento qui: ora l’abbiamo reso predefinito per tutti i siti, dopo aver apportato alcune modifiche al modo in cui vengono elaborati gli hashtag. Ora mostriamo anche i colori per le icone, compreso lo stile originale della sottocategoria :rainbow: :\n\n#support Feature #general::channel Announcements > Blog \n\nhttps://github.com/discourse/discourse/pull/21788\n\nPresto verrà eliminato anche il vecchio codice che fa riferimento al precedente sistema di hashtag.

16 Mi Piace
23

Questo sembra molto buono. Ma come funziona per le persone con disabilità visive? Suppongo che #accessibility #general #general::channel #documentation:devs potrebbero mancare le etichette aria… Ecco l’anteprima HTML corrispondente.

<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 Mi Piace
24

Grazie per averlo fatto notare, è un ottimo punto. Come minimo, alcuni aria-label su ogni hashtag sono appropriati. Cercherò di inviare un commit questa settimana.

7 Mi Piace
28

I vecchi argomenti non utilizzeranno il nuovo formato per tag e categorie finché l’HTML non verrà ricostruito. Esiste un modo sicuro per ricostruire tutti gli argomenti per rendere l’interfaccia utente coerente? Magari con rake?

Qualcosa del genere? Non l’ho testato!

./launcher enter app
rake posts:rebake
2 Mi Piace
29

Penso che questo sia più mirato:

Non sono sicuro riguardo al pezzo bundle exec, però. Non so se sia necessario per un sito live?

5 Mi Piace
30

Senza bundle exec, sembra funzionare su un sito di produzione :slight_smile:

root@Canapin-app:/var/www/discourse# rake hashtags:mark_old_format_for_rebake
Finding posts matching old format, this could take some time...
[!] You are about to mark 0 posts containing hashtags in the old format to rebake. [CTRL+c] to cancel, [ENTER] to continue

Done, rebakes will happen when periodical updates job runs.
6 Mi Piace