Un menu di navigazione ben strutturato è essenziale per guidare i visitatori attraverso il vostro sito WordPress e garantire che possano trovare facilmente le informazioni di cui hanno bisogno.
Sia che stiate impostando il vostro primo sito web, sia che stiate cercando di migliorare l’esperienza utente su un sito già esistente, imparare ad aggiungere e personalizzare un menu di navigazione è un’abilità importante.
WordPress è dotato di un’interfaccia di menu a trascinamento che si può utilizzare per creare facilmente menu a intestazione, menu con opzioni a discesa e molto altro ancora.
Nel corso degli anni abbiamo creato una varietà di menu per i nostri diversi brand, acquisendo così un’esperienza di prima mano nella progettazione di stili di menu. Abbiamo imparato quali tipi di menu funzionano meglio per le diverse aziende, quali link e pagine includere e come ottimizzare la navigazione per una migliore esperienza dell’utente.
In questa guida passo passo, vi mostreremo come aggiungere facilmente un menu di navigazione in WordPress.
Che cos’è un menu di navigazione?
Un menu di navigazione è un elenco di link che puntano ad aree importanti di un sito web. Di solito si presenta come una barra orizzontale di link in alto in ogni pagina di un sito WordPress.
Questi menu danno struttura al sito e aiutano i visitatori a trovare ciò che cercano. Ecco come appare il menu di navigazione su WPBeginner:
WordPress rende molto semplice l’aggiunta di menu e sottomenu. È possibile aggiungere collegamenti alle pagine più importanti, alle categorie o agli argomenti, ai post del blog e persino ai collegamenti personalizzati, come il profilo dei social media.
La posizione esatta del menu dipende dal tema di WordPress. La maggior parte dei temi dispone di diverse opzioni, per cui è possibile creare diversi menu che possono essere visualizzati in luoghi diversi.
Ad esempio, la maggior parte dei temi WordPress ha un menu principale che appare in alto. Alcuni temi possono includere anche un menu secondario, un menu footer o un menu di navigazione mobile.
Detto questo, vediamo come creare un menu di navigazione personalizzato in WordPress.
- Creating Your First Custom Navigation Menu
- Creating Drop-Down Menus in WordPress
- Adding Categories to WordPress Menus
- Adding Custom Links to Your WordPress Navigation Menus
- Editing or Removing a Menu Item in WordPress Navigation Menus
- Adding Navigational Menus in Full Site Editor (FSE)
- Adding WordPress Menus in Sidebars and Footers
- Going Further with Navigation Menus
- Video Tutorial
- FAQs About WordPress Menus
Creare il primo menu di navigazione personalizzato
Per creare un menu di navigazione, è necessario visitare la pagina Aspetto ” Menu nella dashboard di amministrazione di WordPress.
Nota: se sul vostro sito non vedete l’opzione“Aspetto ” Menu” e vedete solo“Aspetto ” Editor“, significa che il vostro tema è abilitato alla modifica completa del sito (FSE). Potete fare clic qui per passare alla sezione FSE che segue.
Una volta arrivati a questo punto, assegnate un nome al vostro menu, ad esempio “Menu di navigazione superiore”, e poi fate clic sul pulsante “Crea menu”.
L’area del menu si espanderà e avrà il seguente aspetto:
Successivamente, è possibile scegliere le pagine da aggiungere al menu. È possibile aggiungere automaticamente tutte le nuove pagine in alto oppure selezionare pagine specifiche dalla colonna di sinistra.
Per prima cosa, fare clic sulla scheda “Visualizza tutto” per visualizzare tutte le pagine del sito. Successivamente, fare clic sul boxed accanto a ciascuna delle pagine che si desidera aggiungere al menu, quindi cliccare sul pulsante “Add-on to Menu”.
Una volta aggiunte le pagine, è possibile spostarle trascinandole e rilasciandole nella sezione “Struttura del menu”.
In questo modo è possibile modificare il loro ordine e riorganizzarli.
Nota: tutte le voci di menu sono elencate in verticale (dall’alto in basso) nell’editor dei menu. Quando il menu viene inserito nel sito, viene visualizzato in verticale o in orizzontale (da sinistra a destra), a seconda della posizione selezionata.
La maggior parte dei temi ha diverse posizioni in cui è possibile inserire i menu. In questo esempio, stiamo usando il tema Astra, che ha 5 posizioni diverse.
Dopo aver aggiunto le pagine al menu, selezionare la posizione in cui si desidera visualizzarle e fare clic sul pulsante “Salva menu”.
Suggerimento: se non siete sicuri di dove si trovi ogni posizione, provate a salvare il menu in luoghi diversi e poi visitate il vostro sito per vedere come appare. Probabilmente non vorrete usare tutte le posizioni, ma potreste volerne usare più di una.
Per maggiori dettagli, potete consultare il nostro tutorial su come creare un menu di navigazione verticale in WordPress.
Ecco il nostro menu finito sul sito:
Creare menu a tendina in WordPress
I menu a discesa, talvolta chiamati menu annidati, sono menu di navigazione con voci di menu figlio/bambino.
Quando si passa il cursore su un elemento principale, tutti gli elementi figli appariranno sotto di esso in un sottomenu.
Per creare un sottomenu, trascinate un elemento sotto il genitore e poi trascinatelo leggermente a destra. Abbiamo fatto questo con 3 sottovoci sotto ‘Servizi’ nel nostro menu:
È anche possibile aggiungere più livelli di menu a discesa, in modo che il menu secondario possa avere un menu secondario. Questo può sembrare un po’ disordinato e molti temi non supportano i menu a discesa a più livelli.
Per istruzioni più dettagliate, consultare il nostro tutorial su come creare un menu a discesa in WordPress.
Ecco il menu secondario dal vivo sul nostro sito demo:
Aggiungere categorie ai menu di WordPress
Se utilizzate WordPress per gestire un blog, potreste aggiungere le categorie del vostro blog come menu a tendina nel vostro menu di WordPress.
Su WPBeginner abbiamo diverse categorie come notizie, temi, tutorial e altro ancora.
È possibile aggiungere facilmente categorie al menu facendo clic sulla scheda Categorie sul lato sinistro della schermata del menu. Potrebbe anche essere necessario fare clic sulla scheda “Visualizza tutto” per vedere tutte le categorie.
È sufficiente selezionare le categorie che si desidera aggiungere al menu, quindi fare clic sul pulsante “Aggiungi al menu”.
Le categorie appariranno come normali voci di menu in fondo al menu.
Quindi, è possibile trascinarle e posizionarle. Ad esempio, metteremo tutte queste categorie sotto la voce di menu Blog.
Per ulteriori istruzioni, consultare la nostra guida per principianti su come aggiungere argomenti nei menu di navigazione di WordPress.
Ecco come appaiono le diverse categorie nel menu di navigazione del nostro sito demo:
Aggiunta di collegamenti personalizzati ai menu di navigazione di WordPress
A lato delle categorie e delle pagine, WordPress consente anche di aggiungere con estrema facilità link personalizzati al vostro menu. Potete usarli per linkare i vostri profili sui media, il vostro negozio online e altri siti web di vostra proprietà.
Per farlo, dovrete utilizzare la scheda ‘Collegamenti personalizzati’ nella schermata Menu. È sufficiente aggiungere il link e il testo che si desidera utilizzare nel menu e fare clic sul pulsante ‘Aggiungi al menu’.
Potete anche essere creativi e aggiungere le icone dei social media al vostro menu o ai pulsanti di invito all’azione per ottenere maggiori conversioni.
Modifica o rimozione di una voce di menu nei menu di navigazione di WordPress
Quando si aggiungono pagine o categorie al menu di navigazione personalizzato, WordPress utilizza il titolo della pagina o il nome della categoria come testo del collegamento. Se si desidera, è possibile modificare questa impostazione.
È possibile modificare qualsiasi voce di menu facendo clic sulla freccia rivolta verso il basso accanto ad essa.
Da qui è possibile modificare il nome della voce di menu. Si può anche fare clic su “Rimuovi” per rimuovere completamente il link dal menu.
Se avete difficoltà con l’interfaccia di trascinamento, potete anche spostare la voce di menu facendo clic sull’apposito link “Sposta”.
Aggiunta di menu di navigazione nell’Editor completo del sito (FSE)
Il nuovo editor completo del sito consente di personalizzare i temi di WordPress utilizzando l’editor di blocchi. È stato rilasciato in WordPress 5.9 e consente di aggiungere diversi blocchi ai modelli per creare un design unico.
Per aggiungere un menu di navigazione utilizzando l’editor completo del sito, visitate Aspetto ” Editor dalla vostra dashboard di WordPress.
Per questa esercitazione utilizzeremo il tema predefinito Twenty Twenty-Three. Per maggiori dettagli, potete consultare il nostro articolo sui migliori temi WordPress per la modifica completa del sito.
Una volta entrati nell’editor, fare clic sulla scheda “Navigazione” per espanderla.
Si apriranno così alcune nuove impostazioni nella colonna di sinistra.
Da qui, è sufficiente fare clic sull’icona “Modifica” in alto.
Si aprirà l’editor del sito completo sulla schermata, facendo clic sull’icona ‘+’ per aggiungere una voce di menu di navigazione.
A questo punto si aprirà un prompt e si potrà selezionare un’opzione dal menu a discesa.
Tuttavia, se si desidera aggiungere un collegamento personalizzato, è possibile aggiungere un’etichetta e un URL per la voce del menu di navigazione nel pannello dei blocchi. È anche possibile aggiungere un’opzione di ricerca al menu.
Una volta aggiunto un elemento, passare alla scheda “Stili” dalla colonna a destra.
È ora possibile modificare la tipografia, l’aspetto, l’altezza, la spaziatura, le maiuscole e la decorazione del testo per le voci di menu.
È anche possibile add-on un sottomenu facendo clic sulla sua icona nella barra degli strumenti del blocco.
Al termine, è possibile visualizzare l’anteprima delle modifiche per vedere come appare il menu in tempo reale. Non dimenticate poi di fare clic sul pulsante “Salva” in alto.
Aggiunta di menu di WordPress nelle barre laterali e nei piè di pagina
Non è necessario attenersi solo alle posizioni di visualizzazione del tema. È possibile aggiungere menu di navigazione in qualsiasi area che utilizzi widget, come la barra laterale o il piè di pagina.
Basta andare su Aspetto ” Widget e poi fare clic sul pulsante “Aggiungi blocco” (+) in alto per aggiungere il blocco widget “Menu di navigazione” alla barra laterale.
Quindi, aggiungere un titolo per il widget e scegliere il menu corretto dall’elenco a discesa “Seleziona menu”.
Al termine, è sufficiente fare clic sul pulsante “Aggiorna”.
Ecco un esempio di menu personalizzato per il footer di WordPress realizzato sul sito web del nostro fondatore, Syed Balkhi.
Approfondimenti con i menu di navigazione
Se volete creare un menu davvero epico con molti link, abbiamo un tutorial su come creare un mega menu in WordPress.
Ciò consente di creare un menu a discesa con molti elementi, comprese le immagini.
I menu mega sono un’opzione ideale se si dispone di un sito di grandi dimensioni, come un negozio online o un sito di notizie. Questo tipo di menu è utilizzato da siti come Reuters, Buzzfeed, Starbucks, ecc.
Video tutorial
Se preferite guardare questa esercitazione, guardate il nostro video qui sotto:
Domande frequenti sui menu di WordPress
Ecco alcune delle domande più comuni che i principianti pongono a proposito dei menu di navigazione di WordPress.
1. Come si aggiunge un link alla homepage in un menu di WordPress?
Per aggiungere la propria homepage a un menu di navigazione, è necessario fare clic sulla scheda “Visualizza tutto” sotto Pagine. Da qui si dovrebbe vedere la propria homepage.
Selezionate la casella accanto a “Casa” e cliccate su “Aggiungi al menu”. Ricordarsi di salvare le modifiche.
2. Come si aggiungono più menu di navigazione in WordPress?
In WordPress, potete creare tutti i menu che volete. Per inserire un menu sul vostro sito web, dovrete aggiungerlo a una delle posizioni del menu del tema o a un’area widget, come abbiamo mostrato sopra.
Se volete aggiungere più menu di navigazione al vostro sito WordPress, create prima i menu seguendo il nostro tutorial precedente.
Per inserirli nel sito, fare clic sulla scheda “Gestisci posizioni”.
Da qui è possibile selezionare il menu che si desidera visualizzare nelle posizioni di menu disponibili nel tema.
Se volete aggiungere una nuova posizione del menu al vostro sito, consultate il nostro tutorial su come aggiungere menu di navigazione personalizzati ai temi WordPress.
Speriamo che questo articolo vi abbia aiutato a capire come aggiungere un menu di navigazione in WordPress. Potreste anche dare un’occhiata alle nostre guide su come stilizzare i menu di navigazione in WordPress e su come creare un menu di navigazione flottante e appiccicoso in WordPress.
Se questo articolo vi è piaciuto, iscrivetevi al nostro canale YouTube per le esercitazioni video su WordPress. Potete trovarci anche su Twitter e Facebook.
Jiří Vaněk
Regarding adding pages to the menu, don’t know how to solve the search problem? Or if you haven’t met him. I have a website where there are currently about 600 pages, which are mainly used for dictionary purposes. The problem is, when I want to add one of the pages to the menu, I write its link in the search, so wordpress does not find it and I have to first display all and find it alphabetically. It delays my work quite a bit and I haven’t figured out where the problem is.
WPBeginner Support
You would want to try writing the title of the page, otherwise you could use custom links and link to the page if you have the URL directly.
Admin
Jiří Vaněk
Yes, I do. I type the site name into the search box and WordPress lists similar sites, but usually not the one I’m looking for. So I will search further where the problem might be.
David Keevis
Thanks so much for a really excellent tutorial. We’re building our site with multiple CPT’s and this post clearly explained what was needed. Had it implemented in a couple minutes. We’re using Generate Press/Generate Blocks and the query loop is exceptionally powerful. Y’all just made our day!!!!
WPBeginner Support
Glad to hear our guide helped!
Admin
NPH LLC
If I “remove” a link within my main navigation menu, can I bring it back easily? We want to take a page offline while we are reconfiguring it.
Thanks!
WPBeginner Support
Yes, you can easily add and remove menu items and if the menu items even if the item is not currently on the menu. You would want to ensure you clear any caching on your site so your visitors see the up-to-date menu.
Admin
Akanksha
Thank you ..This was very helpful to me
WPBeginner Support
Glad it was helpful!
Admin
Sunny
A very basic question. How can you link your website URL to your homepage? Meaning, having the website URL, also as your homepage section in the menu. Thanks
WPBeginner Support
You could either set the menu to the homepage you have set under Settings>General for your site or create a custom URL and add your domain there to point to your homepage.
Admin
Lisa
I’m confused about how to get my posts where I want them to go… I have a recipe blog. On the top of my site, I have categories you can click such as “Dinner recipes” and “Side dishes”… How do I get my specific posts to go on those specific pages when you click on the title at the top of the page?
aberry
Is there a way that when you add a category it automatically adds the sub categories?
WPBeginner Support
You would want to take a look at one of our older articles covering this below for showing subcategories on the parent category page:
https://www.wpbeginner.com/wp-tutorials/display-subcategories-on-category-pages-in-wordpress/
Admin
HJ
Very basic question, but how to enable menu on a subpage? I designed some subpages, but the menu is not visible on top. In my main pages the menu is visible. How to enable the menu to make it visible on the sub-pages?
WPBeginner Support
You would want to reach out to the support for your specific theme, it sounds like your theme may remove the menu for certain pages. If you reach out to the support they should let you know how to add the menu back.
Admin
Janien
I’m trying to get a navigation menu that is sticky and is not transparent. I’ve tried everything. Am I allowed to change the navigation bar in a theme?
WPBeginner Support
You are but it would require some coding knowledge, we would recommend reaching out to your theme’s support and they can normally assist.
Admin
Miranda
I have made a navigation menu but it won’t show up on the mobile site and when I go to navigation menu settings it does not have mobile menu as an option. Do you know how I can fix this or do I need to find a different theme?
WPBeginner Support
You would need to reach out to the support for your specific theme for it not displaying properly and they would be able to assist.
Admin
sadik
Thenk you Wp Begginer
WPBeginner Support
You’re welcome
Admin
Nanyc
This helped a lot. I wanted a heads up before I started. Presented very well.
WPBeginner Support
Glad our article was helpful
Admin
atta
Thanks for the detailed guide. I have a question: how can we add a navbar (for a landing page) which links the landing page sections/elements instead of navigating to other pages. An example is Wikipedia. On any Wikipedia page, you can click on the name of the section and it will immediately go down to that section.
WPBeginner Support
For that, you would want to use anchor links which we cover in our article below:
https://www.wpbeginner.com/beginners-guide/how-to-easily-add-anchor-links-in-wordpress-step-by-step/
Admin
Gina
Hi,
I created categories and added to my menu so that once a reader clicks they can find all the blog posts on that category. My problem is that I don’t want the blog name to appear at the top of the page, that is, Blogging category => Blogging category description => blog posts, how do I remove that?
WPBeginner Support
That would depend on your specific theme’s styling. If you reach out to your theme’s support they should be able to assist with changing what is shown
Admin
wan
i try to add menu item on my menu structure. even when i save menu, the website doesn’t change. why?
WPBeginner Support
You would want to ensure your site or your hosting provider does not have a cache that could be causing your issue.
Admin
Keith
Great resources
WPBeginner Support
Thank you
Admin
Linda McMillan
Hello, I am using Elementor and OceanWP. I set up a custom link in my menu so that when clicking on it goes to the Home page. How can I make it go instead of just to the Home page, but down the page to a certain section? I appreciate your help.
WPBeginner Support
You would want to take a look at making an anchor link: https://www.wpbeginner.com/beginners-guide/how-to-easily-add-anchor-links-in-wordpress-step-by-step/
Admin
Annie
Pretty much there with the navigation. One question though, I have one point in my navigation “products” from there it splits into 3 other sections (drop down menu coming up). I don’t want visitors be able to access this product page as it will be empty, I want them to choose directly from the drop down menu instead of accessing the products page first. So products will be still displayed in the navigation but will be inaccessible, visitors have to click onto the drop down menu to choose what they are after. How do I do this? I m I m removing the whole products section it wont be displayed in the navi anymore, how can I make the products page inaccessible?
WPBeginner Support
You can create a custom link under Appearance>Menus titled Products and link it to either a different page or # which should keep the users on the same page they are on.
Admin
Ishan
Thank you for your help.I was facing the same problem
Terry L. Cooper
How old is this anyway?? I’m not seeing any of this on the WP page.
WPBeginner Support
The steps in this article should still work for WordPress.org sites, are you on WordPress.com? https://www.wpbeginner.com/beginners-guide/self-hosted-wordpress-org-vs-free-wordpress-com-infograph/
Admin
Azizi
Sorry sir, which WordPress theme you’re using on WPbeginner.com?????
WPBeginner Support
We are using a theme we created for our site built on the Genesis Framework, for more on what we’re using on our site you would want to take a look at our blueprint page here: https://www.wpbeginner.com/blueprint/
Admin
Inzamam ul haq
It really helped me. very informative.Thanks
Natalie V
Hi! Thanks so much for this post. It helped me a lot. I have the “Karuna” theme. Whenever I add more menu options (I have 4) they are displayed in two row. I would like them all to be in one row. Is there a way to fix this? Thank you so much!
David
Needed to link a buy now button to woo commerce cart page. Spent two days going in circles. Tried to contact woo with little success. Then found you guys who helped solve the problem.
Often it is the little things which can stop us in our tracks. A big thank you for the simplified set of clear instructions.
Elliot Kershaw
Hello,
I am making a website with Ocean WP and Elementor, however I am unable to see the menu at the top of all of my pages. It only appears at the top of the home page. So people can navigate to any page from the home page, however if anyone wanted to navigate back to the home page or to another page from there, it would tricky. Do you have a solution for this? Thank you!