I menu giocano un ruolo fondamentale nella interpretazione del sito. Menu ben organizzati e una grafica ben realizzata, rendono più coinvolgente ed efficace la navigazione. Gli utenti saranno incentivati a rimanere sul sito se riescono a percepire che al suo interno troveranno contenuti di loro interesse.
Per ottenere menu più accattivanti e una navigazione semplice ed intuitiva, possiamo utilizzare strumenti di animazione come Flash o jQuery. In questo articolo presenteremo alcune estensioni che ci consentiranno di integrare diverse tipologie di menù nel nostro sito, sfruttando sia i meccanismi messi a disposizione da Flash che da jQuery, senza necessariamente conoscere questi ultimi in modo approfondito.
Chinch Menu
La prima estensione che presenteremo è Chinch Menu, componente giunto alla versione 1.6, disponibile sia per le versione 2.5.x che 3.x di Joomla. Una volta reperito ed integrato il componente all’interno del CMS eseguendo la classica procedura di installazione, per la creazione di un nuovo menù di tipo accordion occorrerà posizionarsi all’interno della sezione “Gestione moduli: Moduli”, presente nel back-end di Joomla, da dove si selezionerà la voce "Nuovo"; a questo punto il sistema ci richiederà di selezionare il tipo di modulo da creare, all’interno della lista propostaci non dovremo far altro che individuare la voce “Cinch Menu” così come evidenziato dal cerchio rosso nella seguente figura.
Una volta creato il modulo, saremo pronti per personalizzarlo secondo le nostre esigenze; nello specifico si avranno due sezioni distinte per la configurazione: la schermata di sinistra riporta i dettagli del modulo, mentre la schermata di destra le impostazioni avanzate e le opzioni che possono essere associate al menù.
Relativamente alla sezione "Dettagli", potremo personalizzare il titolo (che rappresenterà anche il nome che daremo al menu), decidere se visualizzare quest'ultimo oppure no, la posizione nella quale inserire il menù all'interno delle nostre pagine e specificare un intervallo di visualizzazione dello stesso. La parte sicuramente più interessante della configurazione è quella di destra, dove potremo personalizzare l'animazione, il formato e tutte le altre impostazioni del menu; in particolare potremo determinare la classe CSS da assegnare al modulo pubblicato, il livello e il tipo di menu (“Accordion” o “Flyout”) e definire se preferiamo che i sub menu si attivino con un semplice clic del mouse oppure al suo passaggio.
Non meno importante è la definizione della durate dell’animazione introdotta, nonché la larghezza del sub menu. Completano le opzioni di personalizzazione la possibilità di scegliere la direzione dell’animazione e lo sfondo da assegnare.
DC Bullet List Accordion Menu
Un altro modulo che può tornarci utile qualora decidessimo di utilizzare un accordion menu sfruttando le librerie jQuery è “DC Bullet List Accordion Menu”, giunto alla versione 2.5.0 e compatibile sia con le versioni 2.5.x di Joomla che con le nuove 3.x; prima di procedere al download del modulo è necessario effettuare la registrazione (comunque gratuita) sul sito ufficiale.
A registrazione ultimata, e dopo aver eseguito l’integrazione del modulo nel nostro Joomla secondo la classica modalità prevista per i componenti, procederemo alla configurazione del modulo posizionandoci all’interno della già citata sezione “Gestione moduli: Moduli” del back-end; selezionando la voce “DC Bullet List Accordion Menu” verremo condotti nella sezione per la configurazione del modulo (figura 3) all’interno della quale saremo in grado di personalizzare il livello del menu, decidere se mostrare o meno i sottomenu, definire il layout alternativo tramite le opzioni avanzate e stabilire la politica da adottare nell’eventuale gestione della cache.
Flash Floating Menu
Flash Floating Menu è un modulo che permette di integrare all’interno delle pagine di Joomla un menù basato sulle animazioni Flash; esso è disponibile sia in modalità modulo che componente ed è giunto alla versione 1.0 compatibile con Joomla 2.5.x e 3.x. Flash Floating Menu consente di definire menu sia in formato orizzontale che verticale, arricchendoli con icone nei formati PNG, GIF e JPG di tre diverse dimensioni.
Il componente può essere prelevato dall’indirizzo ufficiale, ma anche in questo caso per poter procedere al download sarà necessario eseguire una registrazione (gratuita); ultimata tale operazione si procederà al download del file "25_30_Module_FlashMenu_extract_first_Stable", il quale contiene al suo interno sia il componente che il modulo da installare.
La prima operazione da effettuare sarà proprio l’installazione del componente (file "com_falshmenu.zip"), per poi proseguire con l’installazione del modulo ("mod_flashmenu.zip").
Completate le operazioni di installazione si dovrà procedere all’attivazione e configurazione del modulo, anche in questo caso, come mostrato in figura 4, avremo quindi la possibilità di configurare sia i dettagli che le opzioni di base; in particolare, nelle opzioni di base dovremo selezionare la tipologia di menu da utilizzare (orizzontale o verticale) ed eventualmente le dimensioni da associare allo stesso.
Se l’installazione del componente è andata a buon fine, nel menù “Componenti” del back-end di Joomla troverà spazio una nuova voce: “Flash menu” che, se selezionata, ci permetterà di configurarne le impostazioni e caricare nuove icone da utilizzare nei nostri menu.
Nel caso in cui si voglia creare un nuovo menu sfruttando i meccanismi appena integrati in Joomla dovremo posizionarci nella sezione “Gestione moduli: Moduli”, selezionare "Nuovo", scegliere il tipo di modulo “Flashmenu” e settare le opportune impostazioni.
La linea Flashxml.net
Concludiamo il nostro viaggio nelle estensioni per menù presentando la linea di estensioni di Flashxml.net, un insieme di tipologie di menù sviluppati in Flash personalizzabili per il nostro Joomla, le estensioni messe a disposizione attualmente sono disponibili solo per la versione 2.5.x del CMS, ma breve dovrebbero essere rilasciate anche quelle pienamente compatibili con Joomla 3.x.
I menu editati tramite flashxml, possono essere personalizzati a livello di animazione, roll over, dimensioni, effetti sonori etc., la personalizzazione avviene tramite il settaggio delle direttive contenute nel file “settings.xml” presente nella cartella “flashxml/textmenufx/”.
Ad esempio, potremo includere facilmente un semplice popMenu orizzontale servendoci del modulo “Horizontal PopMenu Fx”, si potranno settare direttamente le opzioni relative alla dimensione da associare al menù, nonché l’effetto Flash ed il percorso ("path") dove è contenuto il componente Flash da utilizzare.
Come già detto in precedenza Flashxml permette di utilizzare diverse tipologie di menu flash, sarà altresì possibile optare per un menu multilivello tramite il componente “Multilevel Menu Fx”, oppure avvalersi di un drop-down menu integrando all’interno di Joomla con “Dropdown Menu FX”, il testo che si utilizzerà sarà gestibile tramite HTML/CSS e formattato secondo le specifiche di orientamento ed allineamento da noi indicati.
Concludiamo la nostra panoramica dei menu in stile flash segnalando la presenza di “Slide Menu FX”, esso permette di proporre i nostri menu in stile slide, il menu e le slide sono personalizzabili in dimensioni, effetti over/out e background; naturalmente non può mancare la personalizzazione del testo e delle animazioni associate alle singole voci menu.
Conclusioni
In questo articolo sono stati proposti alcuni strumenti, in particolare moduli e componenti, grazie ai quali ottimizzare, stilizzare, organizzare, animare e migliorare graficamente i menu di navigazione di un sito Web basato su Joomla.
