Sottomenu dell'intestazione

[Discourse]

	Riepilogo	Header Submenus ti permetterà di creare un menu di intestazione con sottomenu utilizzando solo testo!
	Anteprima	Anteprima su Discourse Theme Creator
	Link al repository	https://github.com/discourse/discourse-header-submenus
	Nuovo nei temi di Discourse?	Guida introduttiva all’uso dei temi di Discourse

Installa questo componente tema

Poiché si tratta di un componente tema official mantenuto dal team di Discourse, le richieste di Support, Contribute > Bug, Contribute > UX e Contribute > Feature possono essere inviate nelle rispettive categorie qui su Meta, taggandole con il tag appropriato del componente tema. Clicca su un link qui sotto per iniziare.

 Supporto  Bug  UX  Funzionalità

Funzionalità

Desktop

Mobile

Impostazioni

Nome	Descrizione
Elementi del menu	Aggiungi elementi del menu. Un elemento per riga in questo ordine: Testo, icona, titolo, visualizzazione.
Elementi del sottomenu	Aggiungi elementi del sottomenu. Un elemento per riga in questo ordine: Genitore, testo, icona, URL, destinazione, titolo.
Icone Svg	Includi le classi delle icone FontAwesome per ciascuna icona utilizzata nelle liste sopra.
Modalità fissa	Forza il menu a essere visibile nella parte superiore dello schermo indipendentemente dalla posizione di scorrimento - Solo Desktop
Mostra freccia	Mostra le icone a freccia accanto agli elementi del menu
Inverti posizione	Visualizza gli elementi del menu sul lato opposto dello schermo
Sfondo del menu	Colore di sfondo del menu. (hex, rgb, rgba o nome colore CSS)
Colore elemento menu	Colore per gli elementi del menu. (hex, rgb, rgba o nome colore CSS)
Sfondo elemento menu attivo	Colore di sfondo per gli elementi del menu quando sono attivi. (hex, rgb, rgba o nome colore CSS)
Colore elemento menu attivo	Colore per gli elementi del menu quando sono attivi. (hex, rgb, rgba o nome colore CSS)
Sfondo sottomenu	Colore di sfondo dei sottomenu. (hex, rgb, rgba o nome colore CSS)
Colore elemento sottomenu	Colore per gli elementi del sottomenu. (hex, rgb, rgba o nome colore CSS)
Sfondo elemento sottomenu al passaggio del mouse	Colore di sfondo per gli elementi del sottomenu quando il mouse passa sopra. (hex, rgb, rgba o nome colore CSS)
Colore elemento sottomenu al passaggio del mouse	Colore per gli elementi del sottomenu quando il mouse passa sopra. (hex, rgb, rgba o nome colore CSS)
Colore divisore	Colore per le linee divisoria nei sottomenu. (hex, rgb, rgba o nome colore CSS)

Ci sono quattro gruppi di impostazioni

1. Elementi del menu

   Inserisci gli elementi che desideri apparire nel menu. Un elemento delimitato da virgole per riga in questo ordine

   Testo, icona, titolo, visualizzazione

   Testo: ciò che appare nel menu.
   Icona: l’icona visualizzata accanto all’elemento. Se non vuoi usare un’icona, usa none.
   Titolo: il testo che appare quando si passa il mouse sull’elemento.
   Visualizzazione: Scegli su quali dispositivi deve apparire l’elemento.

   ‏‏‎ ‏‏‎ ‏‏‎ ‏‏‎ ‏‏‎ ‏‏‎ ‏‏‎ ‏‏‎ ‏‏‎ ‏‏‎ ‏‏‎ ‏‏‎ vdm appare sia su desktop che su mobile
   ‏‏‎ ‏‏‎ ‏‏‎ ‏‏‎ ‏‏‎ ‏‏‎ ‏‏‎ ‏‏‎ ‏‏‎ ‏‏‎ ‏‏‎ ‏‏‎ vdo appare solo sui desktop,
   ‏‏‎ ‏‏‎ ‏‏‎ ‏‏‎ ‏‏‎ ‏‏‎ ‏‏‎ ‏‏‎ ‏‏‎ ‏‏‎ ‏‏‎ ‏‏‎ vmo appare solo sui dispositivi mobili.

   A causa della mancanza di spazio, non si consiglia di aggiungere più di 3-4 elementi su mobile.

2. Elementi del sottomenu

   Inserisci un elenco degli elementi del sottomenu che desideri aggiungere al tuo menu. Un elemento delimitato da virgole per riga in questo ordine

   Genitore, testo, icona, URL, destinazione, titolo

   Genitore: il nome dell’elemento del menu principale sotto il quale deve apparire questo elemento del sottomenu. Usa il valore testo della lista sopra.
   Testo: il testo che viene visualizzato per questo elemento del sottomenu.
   Icona: l’icona per questo elemento del sottomenu, usa none se non è necessaria un’icona.
   URL: il percorso a cui punta questo elemento del menu. Puoi usare anche percorsi relativi.
   Destinazione: Scegli se questo elemento si aprirà in una nuova scheda o nella stessa scheda. Usa blank per aprire il link in una nuova scheda, oppure usa self per aprirlo nella stessa scheda.
   Titolo: il testo che viene visualizzato quando si passa il mouse sull’elemento.
   Divisori: Puoi anche aggiungere divisori tra gli elementi del sottomenu. Per aggiungere un divisore usa genitore, divider.

Ecco un esempio rapido per coprire i punti 1 e 2 sopra:

Supponiamo di voler aggiungere un elemento del menu chiamato Design e aggiungere alcuni elementi al suo sottomenu in questo modo

Inserirei prima questo come menu_item

Design, magic, Get inspired!, vdm

E poi inserirei questi come elementi sub_menu

Design, Galleries, th, #, blank, Cool galleries for you to look at.
Design, Design process, lightbulb-o, #, blank, Learn the basics.
Design, Blog design, columns, #, blank, What makes for a great blog?
Design, divider
Design, Freebies, gift, #, blank, Everyone likes freebies!
Design, Photoshop tutorials, book, #, blank, Photoshop for beginners.
Design, Design trends, bar-chart, #, blank, Stay on top of the current trends!

Ecco fatto!

Il tema viene fornito con un menu segnaposto di default, quindi dai un’occhiata e chiedi se hai domande.

3. Opzioni di layout.

   Queste sono piuttosto autoesplicative

   

4. Opzioni di colore

   Questi sono vuoti di default, ma se aggiungi un colore qui, sovrascriverà i valori predefiniti del componente che si basano sullo schema di colore corrente.

Ospitato da noi? I componenti tema sono disponibili per l’uso sui nostri piani Standard, Business ed Enterprise.