In questo video parleremo di come creare e personalizzare il menu di navigazione del sito che appare nella parte superiore delle nostre pagine.
Dalla dashboard vai al menu “Aspetto”, quindi seleziona il sottopannello “Menu”. Questa schermata è uno dei due posti in cui puoi creare e gestire i menu per il tuo sito.
L’altro metodo è tramite il “Personalizza”, che ha l’ulteriore vantaggio di mostrare un’anteprima dal vivo delle nostre modifiche aggiornate in tempo reale.
Per avviare le modifiche con questo sistema, seleziona “Personalizza” dal menu “Aspetto” o fai clic sul pulsante nella parte superiore della pagina “Gestisci con l’anteprima in tempo reale”.
Sul lato destro c’è un’anteprima dal vivo del nostro sito e quando apportiamo modifiche alle opzioni sul lato sinistro l’anteprima si aggiornerà in tempo reale. WordPress ci dice che non abbiamo ancora creato alcun menu, quindi farò clic sul pulsante per creare un nuovo menu.
Dobbiamo dare a questo menu un nome descrittivo in modo da poterlo identificare in seguito, quindi dobbiamo scegliere dove vogliamo che appaia. Questo particolare tema supporta cinque diverse posizioni di menu: un menu orizzontale nella parte superiore del sito, un menu espandibile, un menu visibile solo sui dispositivi mobili, un menu a piè di pagina nella parte inferiore del sito e fun menu dei collegamenti social del quale parleremo in seguito.
Assegno il nostro menu appena creato alla posizione del menu orizzontale del desktop e quindi anche alla posizione del piè di pagina. Queste opzioni essenzialmente ripeteranno questo menu nella parte superiore e inferiore del nostro sito.
Ora siamo pronti per iniziare ad aggiungere alcuni collegamenti al nostro nuovo menu, clicco su “Prossimo” e quindi seleziono il pulsante “Aggiungi voce” per iniziare ad aggiungere collegamenti al nostro menu.
Iniziamo aggiungendo i link alle pagine più importanti del nostro sito, per prima cosa aggiungerò un link alla nostra homepage che renderà più facile per i nostri visitatori tornare alla home da qualsiasi pagina del nostro sito.
Clicco per aggiungere il collegamento home al nostro menu.
Successivamente vorrei aggiungere un collegamento alla nostra pagina “Chi siamo”, quindi clicco clic su quella pagina per aggiungerla come prossima voce nel menu.
Clicca sulla barra del titolo di una voce di menu per modificare i dettagli di quel collegamento; inclusa l’etichetta di navigazione che appare nel menu.
Puoi anche rimuovere un collegamento dal menu in qualsiasi momento.
Vorrei aggiungere alcune nuove pagine al nostro menu: possiamo infatti creare nuove pagine proprio da qui per poi andarle a modificare in seguito.
Quindi ad esempio aggiungerò una nuova pagina per il Blog e creerò anche una pagina “Contatti”.
Questo è un menu piuttosto semplice ma per ora funzionerà alla grande.
Puoi anche aggiungere link personalizzati al tuo menu: basta inserire l’URL per un link e poi il testo del link che vuoi che appaia nel menu così per esempio aggiungerò temporaneamente questo link ad Acme.com, e vedrai che è stato aggiunto al nostro menu come collegamento personalizzato; per rimuovere un elemento dal tuo menu, fai clic sulla X rossa accanto all’elemento che desideri eliminare.
Oltre alle pagine puoi anche aggiungere collegamenti a singoli post e persino creare nuovi post proprio qui.
Puoi anche aggiungere collegamenti al menu a categorie o tag specifici, il che può essere davvero utile, ad esempio aggiungerò un collegamento alla categoria “mobili” del nostro sito che aiuterà i nostri visitatori a trovare facilmente tutti i nostri post sui “mobili” .
Per riorganizzare gli elementi nel menu, trascinali semplicemente nell’ordine che preferisci; puoi persino creare menu nidificati o a discesa semplicemente trascinando leggermente una voce menu sulla destra della voce menu principale. Nell’anteprima dal vivo possiamo vedere come sarà il nostro nuovo menu, nota come ad ogni cambiamento che apporto l’anteprima si aggiorna in tempo reale. Per questo sito preferisco dare un ordine diverso al menu, quindi trascinerò il link di questa categoria sopra alla precedente per modificare l’ordine.
Un’altra cosa prima continuare, abilito ora la posizione del menu “espanso del desktop” in modo da poter vedere come appare, nota che ora c’è una nuova voce menu nell’angolo in alto a destra che contiene tre punti.
Probabilmente hai visto che il menu di navigazione è così su altri siti.
Se assegni un menu a questa posizione, le voci del menu stesse non saranno visibili finché un visitatore non fa effettivamente clic su questo collegamento, quindi si espanderà per rivelare le voci del menu.
Questa è un’ottima idea per un menu mobile e infatti nella parte inferiore del personalizzatore possiamo visualizzare in anteprima come apparirà quando verrà visualizzato su un tablet o un dispositivo mobile.
Quindi, se vuoi, puoi creare menu dedicati per ciascuna di queste posizioni nella pagina, ma non è necessario. Se non specifichi un menu per queste posizioni, questo tema utilizzerà solo il menu principale che abbiamo creato qui.
Ora abbiamo creato un menu personalizzato per il nostro sito, quindi selezioniamo “Pubblica”, e ora il nostro nuovo menu principale apparirà nella parte superiore e di nuovo nella parte inferiore del nostro sito.
Per uscire dal “customizer” e tornare alla “schermata del menu” nella bacheca seleziona l’icona “Chiudi” nell’angolo in alto a sinistra.
Ora se vogliamo possiamo modificare ulteriormente il nostro menu appena creato da questa schermata.
Ricordi che in precedenza nel video avevo menzionato che questo tema include anche un menu “Collegamenti social”? Non tutti i temi includono questa funzione, ma ricorda che consente ai visitatori di accedere rapidamente ai tuoi profili social facendo clic su piccole icone che rappresentano ciascun servizio.
Ti mostrerò cosa intendo creando prima un nuovo menù personalizzato. Diamo un nome a questo menu e poi clicchiamo su “Crea menu”.
Successivamente dobbiamo aggiungere collegamenti personalizzati all’indirizzo web per ciascuno dei nostri profili social; per esempio incollo il link al nostro profilo Twitter e poi per il testo del link inserisco solo il nome del social network, in questo caso Twitter.
Quindi creo nuovi collegamenti personalizzati ad altri profili social.
Dopo aver aggiunto tutti i tuoi link social, assicurati di assegnare questo menu alla posizione menu “Link social” e quindi salva il nuovo menu.
Ora se visitiamo il nostro sito e scorriamo fino in fondo troveremo il nostro nuovo menu Social Links; questo tema sostituisce automaticamente i collegamenti personalizzati con le icone per ogni servizio consentendo ai nostri visitatori di connettersi facilmente con noi sui nostri social network preferiti. Ricorda che non tutti i temi includono il supporto per un menu “social links”, quindi controlla la documentazione per il tuo tema per saperne di più.
Ora sai come creare menu di navigazione personalizzati per il tuo sito web, consentendo ai tuoi visitatori di trovare facilmente i contenuti più importanti del tuo sito.