Strumento Stile Tag

:information_source: Riepilogo Tag Style Tool ti consente di personalizzare l’aspetto dei tag.
:eyeglasses: Anteprima Da compilare
:hammer_and_wrench: Repository TagStyleTool su Github
:question: Guida all’installazione Come installare un tema o un componente tema
:open_book: Nuovo ai Temi di Discourse? Guida per principianti all’uso dei temi di Discourse

Installa questo componente tema

Informazioni

TagStyleTool è una versione ispirata a (3) componenti esistenti per consentire la personalizzazione dell’aspetto dei tag su Discourse!

Caratteristiche:

  • Risolti problemi di compatibilità (In particolare tra la rimozione dei trattini e le icone dei tag)
  • Assegna un’icona Font Awesome a tag specifici.
  • Aggiunta l’opzione per applicare un’icona di tag predefinita a qualsiasi tag non definito.
  • Ereditarietà invertita, ad esempio colore dell’etichetta o del testo
  • Risolve un problema di colore di contrasto con il colore del testo quando si utilizza l’impostazione di colorazione dell’etichetta.
  • Permessa la possibilità di scegliere tra gli stili di tag esistenti.
  • Versatilità delle impostazioni che consentono di disabilitare il tag predefinito o la funzione dei trattini.
  • Il formato delle impostazioni è lo stesso (con l’aggiunta di nuove impostazioni) di Tag Icons consentendo una facile portabilità/adozione.

Altro da fare:

  • Implementare un’opzione per applicare a un’intera categoria. (Questo presenta degli inconvenienti, penso che si possa fare, ma richiede manutenzione aggiuntiva)
  • Colore predefinito del tag :sweat_smile: uno scenario “what if” se si desidera solo il colore e non l’icona.
  • Correzioni per le impostazioni orientate all’utente

Altro:

Questa è la prima volta che pubblico qualcosa al pubblico dopo un po’ di tempo. Se riscontri problemi, fammelo sapere!

L’ispirazione (e in alcuni casi la formattazione/impostazioni, ecc.) è stata adottata direttamente da questi progetti esistenti:
Remove Dashes from Tag Names
Tag Icons
Color Tag Style

Risorse utili

Font Awesome
HTML Color Picker

7 Mi Piace

Proverò questo! Grazie!! Avevo guardato un sacco di componenti per lo stile dei tag e sembrava complicato doverne installare diversi, quindi proverò il tuo la prossima volta che mi dedicherò alla mia configurazione!

1 Mi Piace

Ho provato velocemente. Due commenti da “principiante”:

  • Mi perdo un po’ con le cose di FontAwesome. Sono solo quelle gratuite? Quale versione? C’è un elenco di tutte le icone da qualche parte (o è troppo lungo per quello)?
  • colore: quanto sarebbe complicato fornire un selettore di colori, per le persone che non conoscono bene l’RGB? :innocent:

Ma grazie comunque, sembra buono!

Non preoccuparti di perderti, felice di aiutare in ogni modo possibile, dopotutto è a questo che serve Discourse, giusto?

Font Awesome
Il componente dovrebbe supportare automaticamente qualsiasi icona Font Awesome dalla versione corrente che è presente nella versione corrente di Discourse. Credo che attualmente supportino la v6. Puoi trovarle tutte qui Font Awesome.
Per la seconda parte della domanda, sì è gratuito, esiste una versione premium, ma non sono sicuro di come funzioni con Discourse poiché Font Awesome è già incluso nel core.

Selettore di Colori
Posso dare un’occhiata e vedere se riesco a implementarne uno, ma dato che è un componente del tema, non sono sicuro di quanto io possa fare prima che diventi necessario essere un plugin. Puoi comunque usare questo utile strumento, clicchi sull’area “Use HTML 5” dove si trova il colore, e per questo componente, vuoi usare il colore esadecimale. HTML Color Picker

1 Mi Piace

Grazie! In effetti, un link a quelle due risorse nell’interfaccia delle impostazioni sarebbe già di grande aiuto!

1 Mi Piace

Ormai esiste un componente HTML nativo per la selezione dei colori

Lo avvolgiamo anche in un componente per un utilizzo ancora più semplice.

4 Mi Piace

Grazie mille!

Chandler Bing Smiling in Friends

Bene, ho fatto qualche progresso. Devo ancora sistemare alcune cose prima di fare il push, come ad esempio la logica di inserimento non funziona (la copia sì), e il pulsante è visibile su tutto il sito, e soprattutto, come puoi vedere, si trova nell’angolo in basso.

Inoltre, ho :eyes: capito come applicare a tutti i tag di un gruppo di tag.


colorpickdemo

3 Mi Piace

Quel style builder sarebbe una funzione eccezionale!