fb-pixel

Come realizzare un mega menu su WordPress

Pubblicato in:

by:

La creazione di un mega menu su un sito WordPress è un’implementazione abbastanza semplice da gestire, che permette di migliorare notevolmente la navigazione fra le pagine, ottimizzare la User Experience e l’aspetto estetico dei menu. In questo articolo, oltre a spiegarti nel dettaglio come impostare un mega menu, ti aiuteremo anche a capire quali sono le implicazioni legate a questa scelta.

Cos’è un mega menu: definizione

Il nostro occhio si è ormai abituato a concepire il menu di un sito come una barra – posizionata solitamente nella parte superiore del sito – con una serie di parole cliccabili. Queste parole, come fossero una sorta di mappa, contengono un link verso un URL, cioè l’indirizzo di una nuova pagina web. A volte ci troviamo davanti i cosiddetti dropdown menu, dotati di una tendina che si visualizza al click o al passaggio del mouse, e che mostra altre voci di menu.

Nel corso degli anni, tuttavia, i siti sono diventati molto articolati e ricchi di funzionalità, un’evoluzione che ha in qualche modo avuto un impatto anche sulla struttura e le potenzialità dei menu.

Mega Menu Colorato

Qui entrano in gioco i mega menu di WordPress: strumenti che, rispetto ai menu standard, si arricchiscono di elementi visivi come icone e immagini, oltre a occupare uno spazio visivo molto più ampio e capace di ospitare un maggior numero di link senza perdere in chiarezza e praticità. Questo aumento di spazio e di possibilità di personalizzazione è ciò che rende “mega” questi menu.

Premessa all’uso e alle funzionalità dei menu

I mega menu rispondono proprio all’esigenza sempre più pressante del web di massimizzare gli strumenti digitali e le opportunità di personalizzazione, così da rendere ogni sito web più performante e capace di distinguersi dagli altri.

Ma com’è possibile che uno strumento così apparentemente marginale come il menu possa diventare talmente centrale da raggiungere potenzialità come quelle offerte dai mega menu?

In realtà i menu sono uno strumento tutt’altro che di secondo piano, anche se spesso vengono considerati tali, e abbiamo anche dedicato un’articolo approfondito dedicato ai menu di navigazione e alle loro funzionalità. Secondo alcuni studi legati al mondo del web design il 38% degli utenti, durante la loro prima visita al sito, analizza con cura il menu e i vari link prima di proseguire nella navigazione. Questo dato evidenzia chiaramente quanto un menu possa influire nell’esperienza d’uso del suo pubblico e, di conseguenza, anche nella sua propensione verso l’acquisto o altre tipologie di azioni richieste.

Il web ci ha abituato per tanti anni a menu abbastanza standard, sempre con le stesse voci. Ecco a seguire un esempio classico:

  • homepage
  • servizi
  • chi siamo
  • contatti.

Si tratta di un elemento del sito che a volte è considerato così ininfluente da non essere più di tanto preso in considerazione all’interno di un processo di sviluppo di un sito web.

Menu Semplice

Niente di più sbagliato, e chi si occupa di web design lo sa bene: un menu progettato male o senza troppa cura potrebbe essere una delle cause per cui alcune sezioni di un sito ricevono poche visite, o ancora il motivo che porta gli utenti a sentirsi smarriti fra le varie pagine web.

Maggiore sarà la complessità del sito e dell’alberatura di contenuti, maggiore dovrà essere la cura del tuo menu.

Mega Menu Con Immagini

Un menu standard come quello che abbiamo visto poco fa rischia di essere troppo esiguo – e anche un po’ scontato – per svolgere davvero la sua funzione di supporto alla navigazione degli utenti. Allo stesso modo però, anche menù troppo complessi e ricchi di link rischiano di mandare in confusione i visitatori, ed è proprio questo il caso più classico in cui la soluzione dei mega menu WordPress può davvero fare la differenza.

Scopriamo quindi quali sono i casi più frequenti in cui questa soluzione può fare al caso nostro.

Quando utilizzare i mega menu

L’errore più classico davanti ai mega menu di WordPress è quello di lasciarsi “affascinare” dalla loro bellezza e diversità rispetto ai menu classici, senza prima di tutto capire se possano davvero essere utili per il tuo sito web e il tuo pubblico.

Mega Menu Laterale

Se hai un sito con una struttura molto semplice, fatta di poche pagine e pochi livelli gerarchici, puoi tranquillamente fare a meno dei mega menu. Il rischio infatti sarebbe quello di appesantire inutilmente l’esperienza di navigazione dell’utente solo per un puro fattore estetico, scelta che ci sentiamo di sconsigliare.

Nel caso invece di progetti articolati come ecommerce, portali, siti informativi o blog, magari anche con un gran numero di categorie e tag, o ancora con diversi livelli di gerarchia, ecco che i mega menu tirano fuori tutto il loro potenziale per rendere più agevole la navigazione e la fruizione dei contenuti. In questo caso sarà molto importante, per ogni voce di menu, creare dei sottomenu in cui raggruppare le varie sottovoci.

Nell’esempio qui sotto, il sottomenu “Telefonia” contiene tutta una serie di sottovoci più specifiche.

Mega Menu Graficati

Come aggiungere un mega menu su WordPress

WordPress anche nel caso dei mega menu permette di integrare con estrema facilità questo strumento all’interno del tuo sito web. Esistono alcuni temi che prevedono già al loro interno la possibilità di attivare i mega menu; oppure, come sempre, puoi appoggiarti a diversi plugin per integrarli nel tuo sito.

Temi WordPress con mega menu

Se sei ancora in una fase preliminare di sviluppo del tuo sito e sai già che l’alberatura dei contenuti sarà piuttosto articolata, potresti valutare di acquistare un tema che preveda già la possibilità di attivare i mega menu, senza dover ricorrere ai plugin.

Ad oggi esistono davvero centinaia di temi con questa funzionalità, fra i quali segnaliamo i più conosciuti:

Plugin per i mega menu WordPress

Se il tuo tema WordPress non include un mega menu, non disperare: in questo caso puoi fare affidamento su diversi plugin che ti permetteranno di potenziare il tuo menu. Ne troverai davvero tanti, ma abbiamo deciso di consigliarti i due che riteniamo avere il miglior equilibrio fra potenzialità, facilità d’uso e impatto sulle prestazioni di un sito.

Max Mega Menu

Max Mega Menu è senza dubbio il plugin più famoso per questa tipologia di funzione, che conta ad oggi oltre 400.000 download e una valutazione altissima da parte dei suoi utenti. Disponibile nella versione gratuita già nella directory di WordPress, dialoga perfettamente con il menu standard di WordPress aggiungendo tutta una serie di funzionalità e livelli di personalizzazione molto validi.

Installazione e configurazione plugin menu WordPress

Per installare Max Mega Menu su WordPress sarà sufficiente accedere a “Aggiungi nuovo plugin” dall’area Plugin nel backend, cercare il nome esatto e cliccare su “Installa ora” e, a seguire, “Attiva”.

Max Mega Menu WordPress

Cosa succede a questo punto? Avrai a disposizione due sezioni per la personalizzazione del tuo menu.

La visualizzazione e gli strumenti di configurazione classici rimangono comunque disponibili nella loro solita sezione, raggiungibile da backend cliccando su Aspetto e poi “Menu”. Una volta attivato il plugin, in questa sezione troverai anche una serie di nuove funzionalità che potrai personalizzare e visualizzare in frontend aprendo il menu a tendina “Max mega menu Settings” e mettendo il flag su “Attiva”.

Attenzione: per ogni modifica che farai in questa sezione ricordati di cliccare prima su “Salva”, e poi anche su “Salva menu” nel pannello di destra.

Configurazione Megamenu Wp

Passando il mouse sulle singole voci di menu comparirà un box azzurro con la dicitura “Mega Menu” accanto alla singola voce (come puoi vedere per “Servizi” nella schermata qui sopra): cliccandoci sopra si aprirà un pannello in cui poter definire varie personalizzazioni.

Personalizzazione Voce Mega Menu WordPress

Qui potrai creare per ogni voce di menu le colonne in cui inserire i vari sottomenu e le voci specifiche, aggiungere icone o altri contenuti visivi, e definire ogni dettaglio di visualizzazione.

Puoi anche accedere alla sezione dedicata di backend cliccando su Max Mega Menu, così da avere a tua disposizione tutti i livelli di personalizzazione più generale che questo plugin mette a tua disposizione.

Mega Menu WordPress Configurazione

In particolare:

  1. Menu Locations: qui potrai scegliere in quale posizione collocare il tuo menu (footer, header, barra laterale, etc) e il suo comportamento generale.
  2. Menu Themes: questa sezione è dedicata all’aspetto estetico. Colori, dimensioni, sfondi, font, fino alla personalizzazione dettagliata a livello di CSS.
  3. Impostazioni generali: utile per decidere dove caricare il foglio di stile personalizzato.
  4. Tools: qui trovi le funzioni di cancellazione della cache di questo plugin, così come l’opzione per rimuovere tutti i suoi dati.
Max Mega Menu Pro

Con l’acquisto dell’estensione a pagamento (disponibile in tre opzioni, da 29$ a 99$ in base al numero di licenze necessarie), a tutte le funzionalità già attive con la versione gratuita si sommano alcune opzioni davvero interessanti. A seguire trovi le principali, nonché le più richieste:

  • sticky menu WordPress
  • organizzazione del menu in tab o accordion
  • menu in formato verticale
  • possibilità di integrazione con WooCommerce e funzionalità avanzate per gli ecommerce
  • un ampio archivio di icone, font e stili
  • barra di ricerca nel menu
  • supporto prioritario.
Mega Menu Con Icone

Questo plugin dispone inoltre di un’ampia documentazione tecnica per la sua configurazione, ma non è al momento disponibile in lingua italiana.

Puoi approfondire le varie funzionalità anche attraverso questo tutorial realizzato dal nostro Ivan, che ti spiegherà passo dopo passo come configurare e personalizzare il tuo mega menu WordPress.

UberMenu

Il secondo suggerimento di mega menu per WordPress che vi diamo è un plugin disponibile solo nella versione a pagamento. Per UberMenu si tratta tuttavia di un costo davvero molto contenuto (29 $ una tantum), che vi permette di accedere non solo a un plugin dalle funzionalità davvero eccellenti e senza più limiti di licenza, ma anche a un’assistenza tecnica molto supportiva.

Ubermenu Mega Menu

Conclusioni

Abbiamo visto come i mega menu possano rivoluzionare e accentuare il potenziale non solo del menu, ma anche dell’intera UX e UI di un sito web.

Mega Menu Sito WordPress Corporate

Assicurati però di valutare attentamente se questa implementazione sia davvero necessaria per il tuo sito: domandati se aggiungere elementi visivi possa appesantire la fruizione del sito, e se non siano inutili tanti link in una posizione così in evidenza come quella del menu.

Mega Menu Categorie

Se hai difficoltà nel valutare come procedere, prova a porti queste domande:

  1. Quali sono le esigenze primarie dei tuoi utenti?
  2. Quali pagine rispondono meglio a queste esigenze?
  3. Esiste una gerarchia fra questi contenuti?
  4. Quante sono le pagine che meritano di stare “in vetrina” nel tuo menu?

Nel caso di un sito già avviato, dare anche un’occhiata agli analytics e, in particolare, ai dati di visualizzazione delle pagine potrebbe darti qualche spunto di riflessione.

Se hai sperimentato il mondo dei mega menu WordPress e vuoi raccontarci la tua esperienza, ti aspettiamo nei commenti.


Prova gratis e senza impegno uno dei nostri piani hosting per 14 giorni. Non è richiesto nessun dato di pagamento!

Commenti

Lascia un commento

Il tuo indirizzo email non sarà pubblicato. I campi obbligatori sono contrassegnati *