Il template supporta 4 tipi differenti di sfondi per i contenuti. Per impostare lo sfondo desiderato bisogna agire sul parametro Sfondo contenuti direttamente nella pagina dello stile (Estensioni > Template > Stili).
Senza sfondo.
La Socials bar è un semplice modulo di tipo menu con layout Socials
Il menu contiene la lista dei link esterni.
Ogni voce di menu è di tipo URL.
Per la visualizzazione dell'icona si usa la Classe Immagine.
L'elenco completo delle icone è disponibile alla pagina Icone - Bootstrap Italia.
Il Top è la parte superiore del sito e presenta due distinti moduli di tipo menu: uno denominato brand e l'altro denominato top.
Il menu brand contiene i link a Bootstrap Italia, Joomla! e ItaliaPA4
Per ottenere il risultato desiderato bisogna agire sui parametri del modulo, selezionando il Layout Brand
Il modulo Top è un semplice modulo di tipo menu, ma la sua costruzione è un po' più complessa. Infatti, sfruttando una caratteristica intrinseca del template è possibile inserire un modulo direttamente nel modulo menu.
Il modulo in oggetto è il modulo Lingua. Per poterlo inserire in un menu basta creare, all'interno dello stesso, una voce di tipo Separatore il cui alias sia nella forma module-<id>, dove id è l'id del modulo da inserire.
La voce di menu di tipo Separatore deve avere la seguente Classe CSS del link.
Non resta che completare la formattazione aggiungendo il seguente Suffisso classe CSS modulo per allineare il modulo a destra.
Sia nel caso della Classe CSS del link che del Suffisso classe CSS modulo è molto importante lasciare lo spazio prima del valore.
Completiamo il lavoro sul Top menu aggiungendo la possibilità di nascondere il menu su dispositivi mobile.
Per ottenere il risultato desiderato bisogna agire sui parametri del modulo Top. Impostando il Layout
E lo Stile Modulo come segue:
In questo breve articolo sarà mostrato come creare un semplice ma completo megamenu per il nostro sitoweb basato su ItaliaPA4. Il risultato finale sarà quello mostrato in figura.
Ma andiamo con ordine.
Il primo passo è quello di creare un semplice menu.
Creiamo un semplice menu ed assegniamolo alla posizione megamenu.
Il menu avrà le seguenti voci.
Il semplice uso di voci di menu di tipo Titolo separatore permette di creare intestazioni per organizzare le voci del singolo menu in blocchi.
Per creare un menu multicolonna basta strutturare la voce di menu con un livello aggiuntivo.
Nel caso in esame le voci di menu J2XML 3.3 e Importer 1.5 sono state abbassate di livello e sono state poste sotto J2XML, mentre la voce di menu ItaliaPA4 è stata posta sotto Italia.
Naturalmente è possibile aggiungere instestazioni anche nel caso di voci di menu multicolonna.
Possiamo creare strutture colonnari asimmetriche per dar spazio a sottosezioni più popolate. Nell’esempio seguente abbiamo una struttura composta da due colonne a sinistra ed una a destra.
Basta inserire una voce di menu di tipo Separatore con la seguente Classe CSS del link nel punto in cui intendiamo suddividere la colonna.
Aggiungiamo un po' di stile inserendo delle icone alle voci di menu mediante la Classe Immagine.
Elenco delle icone disponibili.
Per completare il lavoro sul megamenu non manca che la voce di footer Tutti i progetti.
Alla voce Footer di tipo Separatore assegniamo la Classe CSS del link
Mentre alla voce di menu Tutti i progetti assegniamo le seguenti classi come segue:
English (UK)