Come aggiungere logica condizionale ai menu in WordPress (Passo dopo Passo)

Hai mai desiderato che il tuo menu di WordPress fosse più intelligente? Forse vuoi mostrare opzioni di navigazione diverse ai membri registrati, o visualizzare elementi di menu specifici solo in determinate pagine.

Per impostazione predefinita, WordPress mostra lo stesso menu statico a tutti, il che può far sembrare il tuo sito generico e poco utile. Abbiamo lavorato con molti proprietari di siti web diversi che hanno affrontato questa esatta sfida.

Fortunatamente, i menu condizionali possono trasformare completamente la tua esperienza utente.

Quando la navigazione di WordPress si adatta a diversi visitatori e contesti, le persone trovano ciò di cui hanno bisogno più velocemente. E puoi guidarli verso le azioni che contano di più per la tua attività.

In questa guida, ti spiegheremo come aggiungere logica condizionale ai tuoi menu di WordPress. Imparerai come creare una navigazione dinamica che cambia in base ai ruoli utente, a pagine specifiche o a qualsiasi altro criterio tu scelga.

Perché aggiungere la logica condizionale ai menu in WordPress?

I menu di navigazione danno struttura al tuo sito web e aiutano i visitatori a trovare ciò che cercano.

Per impostazione predefinita, il tuo sito web WordPress visualizzerà lo stesso menu di navigazione a tutti gli utenti e su tutti i post e le pagine.

Tuttavia, potrebbero esserci momenti in cui desideri visualizzare menu diversi a utenti diversi o su pagine diverse del tuo sito web.

Con la logica condizionale, puoi fare un passo avanti creando menu personalizzati per gli utenti registrati. Ecco alcuni esempi di casi d'uso su diversi tipi di siti:

• Negozio online – Evidenzia prodotti o offerte speciali in base alla cronologia di navigazione o acquisto di un cliente.
• Sito di membership WordPress – Mostra pagine e risorse esclusive solo ai membri che hanno effettuato l'accesso.
• Piattaforma di apprendimento online – Visualizza diverse categorie di corsi o lezioni a seconda dei progressi di uno studente.

Puoi pensarla come il controllo degli accessi ai menu di WordPress. 💡

Tenendo presente questo, ti mostreremo come aggiungere logica condizionale ai menu di WordPress. Ecco gli argomenti che tratteremo in questo tutorial:

• Creating New Navigation Menus in WordPress
• Showing a Different Menu to Logged-In Users in WordPress
• Mostrare un menu diverso agli utenti con accesso effettuato utilizzando FSE
• Showing a Different WordPress Menu Depending on User Role
• Showing a Different Menu for Different Pages in WordPress
• Hiding the Navigation Menu on Landing Pages in WordPress
• Domande frequenti sui menu condizionali
• Letture consigliate: Fare di più con i menu di navigazione di WordPress

Pronto? Iniziamo.

Creare nuovi menu di navigazione in WordPress

Il primo passo è creare i menu di navigazione aggiuntivi che desideri visualizzare in WordPress. Dopodiché, puoi utilizzare la logica condizionale per decidere quando ogni menu verrà visualizzato.

Da qui in poi, ti mostreremo come aggiungere menu condizionali a WordPress sia per l'editor classico che per l'editor a blocchi.

Creare nuovi menu di navigazione in WordPress utilizzando l'editor classico

Questo metodo funziona per gli utenti di temi classici.

Per creare nuovi menu di navigazione, vai semplicemente alla pagina Aspetto » Menu nella bacheca di WordPress. Se hai già un menu di navigazione che utilizzi sul tuo sito web per tutti gli utenti, questo può essere il tuo menu predefinito.

Successivamente, dovrai fare clic sul link 'crea un nuovo menu' per creare una nuova voce di menu. Ad esempio, potresti creare un menu da mostrare agli utenti connessi e un altro da visualizzare su una determinata pagina di WordPress o categoria.

Sul lato sinistro dello schermo, puoi vedere un elenco delle pagine del tuo sito web. Seleziona semplicemente la casella accanto a qualsiasi pagina che desideri aggiungere al tuo menu e fai clic sul pulsante ‘Aggiungi al menu’.

Puoi anche trascinare e rilasciare le voci di menu sul lato destro dello schermo per riordinarle.

Più in basso nella pagina, puoi scegliere una posizione per visualizzare il tuo menu. Ma non è necessario assegnare una posizione a questo menu ora. Lo faremo nel prossimo passaggio.

Non dimenticare di fare clic sul pulsante 'Salva menu' per memorizzare le tue modifiche.

Per maggiori dettagli sulla creazione di menu, puoi consultare la nostra guida per principianti su come aggiungere un menu di navigazione in WordPress.

Creazione di nuovi menu di navigazione in WordPress utilizzando FSE

Per creare nuovi menu di navigazione in un tema a blocchi con Full Site Editing (FSE), dovrai prima navigare su Aspetto » Editor dal tuo pannello di controllo di WordPress.

Una volta dentro, puoi fare clic sulla scheda 'Navigazione' per espanderla. Se ti stai chiedendo, stiamo usando il tema Twenty-Twenty Three per questa guida.

Successivamente, facciamo clic su 'Modifica' accanto all'etichetta 'Navigazione'.

Questo aprirà l'editor del sito completo sul tuo schermo.

Da qui, tutto ciò che resta da fare è fare clic sull'icona '+' per aggiungere una voce di menu di navigazione. Vedrai quindi un prompt che mostra un menu a discesa dove puoi selezionare un'opzione.

Per istruzioni più dettagliate, puoi consultare la nostra guida su come aggiungere un menu di navigazione in WordPress.

Mostrare un menu diverso agli utenti registrati in WordPress

È spesso utile visualizzare menu di navigazione diversi agli utenti a seconda che abbiano effettuato l'accesso al tuo sito o meno.

Ad esempio, puoi includere collegamenti di accesso e registrazione per gli utenti non registrati e aggiungere un link di logout al tuo menu per gli utenti registrati.

Se gestisci un negozio WooCommerce, potresti includere articoli per i tuoi clienti che sono nascosti al pubblico generale.

Mostrare un menu diverso agli utenti registrati utilizzando l'editor classico

Per iniziare, è necessario installare e attivare il plugin Conditional Menus. Per maggiori dettagli, consulta la nostra guida passo passo su come installare un plugin di WordPress.

Dopo l'attivazione, dovrai navigare su Aspetto » Menu e passare alla scheda 'Gestisci posizioni'.

Da qui, vedrai l'elenco delle posizioni dei menu disponibili e i menu attualmente visualizzati. Questi varieranno a seconda del tema WordPress che stai utilizzando.

Ad esempio, sul nostro sito demo, viene mostrato che la nostra posizione 'Menu principale' sta visualizzando un menu di navigazione intitolato 'Menu principale'.

Possiamo dire al plugin di mostrare un menu diverso quando una determinata condizione viene soddisfatta facendo clic sul link '+ Menu condizionale' e selezionando un altro menu dal menu a discesa.

Per questo tutorial, selezioneremo 'Menu utente connesso'.

Successivamente, devi fare clic sul link '+ Condizioni'.

Questo aprirà un popup in cui vedrai molte condizioni tra cui scegliere.

Seleziona semplicemente la casella accanto all’opzione ‘Utente connesso’ e quindi fai clic sul pulsante ‘Salva’.

Ora puoi visitare il tuo sito web per vedere il menu utente connesso in azione. Puoi disconnetterti dal tuo sito web per vedere il menu di navigazione mostrato a tutti gli altri utenti.

Per istruzioni più dettagliate e per imparare come farlo usando il codice, dai un'occhiata alla nostra guida su come mostrare menu diversi per gli utenti connessi in WordPress.

Mostrare un menu diverso agli utenti con accesso effettuato utilizzando FSE

Se stai usando un tema a blocchi, avrai bisogno del plugin Conditional Blocks. Quindi, installiamo e attiviamo prima il plugin. Se hai bisogno di aiuto, puoi consultare la nostra guida su come installare un plugin di WordPress.

Dopo averlo attivato, puoi aprire la funzionalità FSE navigando su Aspetto » Editor. Quindi, fai clic su 'Modelli' e poi su 'Tutte le parti del modello'.

Ora dovresti vedere tutte le tue parti del modello, che potrebbero includere un piè di pagina, un'intestazione e commenti. Facciamo clic sui tre punti nella sezione 'Intestazione' e quindi selezioniamo 'Modifica'.

Questo ti reindirizzerà all'editor a blocchi.

Ora dovrai fare clic sul blocco del menu di navigazione per aggiungere le condizioni.

Dopodiché, passa semplicemente alla scheda 'Blocco' nel pannello laterale destro per iniziare la personalizzazione.

Scorrendo verso il basso la scheda ‘Blocco’, vedrai la sezione ‘Blocchi condizionali’. Fai semplicemente clic per aprire le opzioni di personalizzazione.

Quindi, procedi e fai clic sul pulsante ‘Modifica visibilità’.

Apparirà una finestra popup in cui puoi impostare le condizioni per il tuo menu di navigazione scelto.

Qui, puoi aprire il menu a discesa ‘CONDIZIONE’ e selezionare l’opzione ‘Utente connesso’.

Chiudi semplicemente la finestra facendo clic sul pulsante ‘X’ nell’angolo in alto a destra.

Dovresti quindi vedere una condizione aggiunta alla sezione ‘Blocchi condizionali’. Procedi e fai clic su ‘Salva’ per aggiornare i tuoi menu di navigazione.

Ora, se visiti il tuo sito web, ecco come potrebbe apparire per gli utenti disconnessi e connessi:

Mostrare un menu WordPress diverso a seconda del ruolo dell'utente

Una volta che un utente si è connesso, puoi anche visualizzare un menu di navigazione diverso a seconda del ruolo utente che gli hai assegnato.

Ad esempio, potresti includere elementi di menu aggiuntivi per un amministratore e elementi più limitati per un collaboratore. Su un sito di appartenenza, potresti concedere diversi livelli di accesso a diversi livelli di appartenenza.

Mostrare un menu WordPress diverso a seconda del ruolo dell'utente utilizzando l'editor classico

Come nella sezione precedente, dovrai installare e attivare il plugin Conditional Menus.

Quindi, puoi andare alla pagina Aspetto » Menu e passare alla scheda ‘Gestisci posizioni’.

Dovresti aggiungere il menu condizionale appropriato per il tuo ruolo utente selezionato. Per questo tutorial, selezioneremo il menu ‘Nav Menu Administrator’.

Dopodiché, puoi fare clic sul link ‘+ Condizioni’ per scegliere il ruolo utente.

Dovrai fare clic sulla scheda ‘Ruoli utente’ per vedere le caselle di controllo per ogni ruolo utente sul tuo sito web. Fai semplicemente clic sui ruoli utente che vedranno questo menu, quindi fai clic sul pulsante ‘Salva’ per memorizzare le modifiche.

Mostrare un menu WordPress diverso a seconda del ruolo utente con FSE

Per mostrare un menu diverso a seconda dei ruoli utente in FSE, utilizzerai il plugin Content Control. Se hai bisogno di aiuto per installarlo e attivarlo, consulta la nostra guida su come installare un plugin WordPress.

Dopo l'attivazione, puoi navigare su Aspetto » Editor » Pattern » Tutte le parti del modello. Quindi, fai semplicemente clic sui tre punti nella sezione ‘Intestazione’ e poi seleziona ‘Modifica’.

Nell'editor, puoi selezionare un menu di navigazione a cui aggiungere le condizioni.

Ad esempio, renderemo la nostra pagina ‘Blog’ esclusiva solo per i nostri abbonati. Quindi, faremo clic su ‘Blog’ per aprire le sue opzioni di personalizzazione.

Da qui, dirigiamoci verso il pannello di destra e attiviamo l'interruttore ‘Abilita controlli’ nella sezione ‘Controlli blocco’.

Quindi, dovrai scorrere verso il basso fino alla sezione ‘Regole utente’ per impostare le condizioni.

Innanzitutto, apri semplicemente il menu a discesa ‘CHI PUÒ VEDERE QUESTO CONTENUTO’ e scegli ‘Utente connesso’.

Quindi, per il menu a discesa ‘RUOLO UTENTE’, puoi scegliere ‘Corrispondente’. E in ‘RUOLI SCELTI’, selezioniamo ‘abbonato’.

Una volta fatto, puoi procedere e fare clic sul pulsante ‘Salva’.

Mostrare un menu diverso per pagine diverse in WordPress

Puoi visualizzare un menu diverso per pagine diverse in WordPress.

Ad esempio, potresti visualizzare elementi di menu aggiuntivi nella tua pagina della privacy policy, come un link alla tua notifica sui cookie.

Mostrare un menu diverso per pagine diverse in WordPress utilizzando l'editor classico

Per fare ciò, è necessario installare e attivare il plugin Conditional Menus. Successivamente, dovrai navigare su Aspetto » Menu » Gestisci posizioni.

Dopo aver scelto il menu di navigazione appropriato, puoi fare clic sul link ‘+ Condizioni’. Questa volta, dovresti fare clic sulla scheda ‘Pagine’. Vedrai un elenco di ogni pagina sul tuo sito web.

Dovrai quindi apporre un segno di spunta accanto a ciascuna pagina in cui desideri visualizzare il menu di navigazione. Una volta fatto, procedi e fai clic sul pulsante ‘Salva’.

Mostrare un menu diverso per pagine diverse in WordPress utilizzando FSE

Gli utenti dei temi a blocchi possono utilizzare il plugin Block Visibility. Se hai bisogno di aiuto con l'installazione, consulta la nostra guida su come installare un plugin WordPress.

Una volta attivato, navighiamo su Aspetto » Editor » Pattern » Tutte le parti del modello. E dopo aver aperto l'editor dell'Intestazione, puoi dirigerti alla sezione ‘Visibilità’.

Da qui, puoi aprire il menu a discesa e selezionare ‘Percorso URL’.

Quindi, puoi aggiungere il percorso URL della pagina dell'Informativa sulla privacy all'area ‘PERCORSO URL (CONTIENE)’.

Un percorso URL è la parte di un indirizzo web che viene dopo il nome principale del sito web e mostra una pagina o un elemento specifico.

Ad esempio, nell'indirizzo https://example.com/about, la parte /about è il percorso URL.

Se non sai qual è il percorso URL della tua pagina dell'Informativa sulla privacy, puoi andare su Pagine » Tutte le pagine. Quindi, dovrai trovare la pagina dell'Informativa sulla privacy e passarci sopra il mouse.

Fai semplicemente clic sul pulsante ‘Modifica rapida’ e vedrai la sezione ‘Slug’. Il percorso dell’URL dovrebbe essere il simbolo ‘/’ seguito dallo slug della pagina.

Oppure visita semplicemente la pagina e copia e incolla la parte dopo il nome di dominio.

Fatto! Fai clic su ‘Salva’ per memorizzare le modifiche.

Nascondere il menu di navigazione nelle landing page in WordPress

Potrebbero esserci pagine sul tuo sito web in cui non desideri visualizzare affatto un menu di navigazione, come le tue landing page.

Una landing page è progettata per aumentare le vendite o generare lead per un’attività. Su queste pagine, vorrai ridurre al minimo le distrazioni e fornire agli utenti tutte le informazioni necessarie per intraprendere un’azione specifica.

Nella nostra guida su come aumentare le conversioni delle tue landing page del 300%, suggeriamo di ridurre al minimo le distrazioni rimuovendo i menu di navigazione e altri link dalla pagina.

Nascondere il menu di navigazione nelle landing page in WordPress utilizzando l’editor classico

Puoi farlo utilizzando il plugin Conditional Menus. Questa volta, sceglierai ‘Disabilita menu’ dal menu a discesa quando selezioni il menu condizionale.

Successivamente, facciamo clic sul link ‘+ Condizioni’ per scegliere quando visualizzare il menu.

Dovresti fare clic sulla scheda ‘Pagine’ e mettere un segno di spunta accanto alla voce ‘La mia landing page’.

Non dimenticare di fare clic sul pulsante ‘Salva’ per memorizzare e applicare le tue impostazioni.

Nascondere il menu di navigazione nelle landing page in WordPress utilizzando FSE

Ora, per gli utenti di temi a blocchi, puoi utilizzare il plugin Block Visibility, ma questa volta, inserirai il percorso dell'URL nel campo ‘Percorso URL (Non contiene)’.

Quindi, installiamo e attiviamo il plugin. Se hai bisogno di aiuto, non esitare a consultare la nostra guida su come installare un plugin di WordPress.

Dopo l'attivazione, puoi andare su Aspetto » Editor » Pattern » Tutte le parti del modello. Una volta nell'editor dell'intestazione, troviamo la sezione 'Visibilità'.

Da qui, puoi scegliere 'Percorso URL' e inserire il percorso della tua landing page nel campo 'Percorso URL (Non Contiene)'.

Una volta fatto, fai semplicemente clic sul pulsante 'Salva'.

Domande frequenti sui menu condizionali

Hai domande sulla configurazione o sulla personalizzazione dei menu condizionali in WordPress? Ecco alcune risposte rapide per aiutarti a iniziare.

Qual è il miglior plugin per menu condizionali per WordPress?

Se stai usando un tema classico, il plugin Conditional Menus è una scelta semplice e affidabile. Per i temi a blocchi, strumenti come Conditional Blocks o Block Visibility ti offrono un controllo potente direttamente nell'editor.

Posso aggiungere logica condizionale ai menu senza un plugin?

Sì, ma ciò comporta l'aggiunta di codice personalizzato ai file del tuo tema, cosa che è meglio lasciare agli utenti avanzati poiché un piccolo errore può compromettere il tuo sito.

Per la maggior parte delle persone, un plugin come WPCode è un modo molto più sicuro e semplice per aggiungere e gestire snippet di codice. Puoi scoprire tutto al riguardo nella nostra recensione completa di WPCode.

Posso applicare condizioni a un singolo elemento del menu invece che all'intero menu?

Assolutamente. Molti temi WordPress moderni e plugin per menu lo consentono. Nell'editor dei menu classico (Aspetto » Menu), puoi spesso impostare regole di visibilità per singoli elementi. Nell'editor a blocchi, puoi applicare condizioni a specifici blocchi di link di navigazione.

Letture consigliate: Fare di più con i menu di navigazione di WordPress

I menu di navigazione sono potenti strumenti di web design. Ti permettono di indirizzare gli utenti alle sezioni più importanti del tuo blog o sito web WordPress.

Ora che stai mostrando menu di navigazione diversi su pagine diverse e per vari ruoli utente, potresti chiederti come personalizzarli ulteriormente.

Per migliorare la funzionalità dei tuoi menu di navigazione, assicurati di consultare questi tutorial:

• Come aggiungere elementi personalizzati a menu specifici di WordPress
• Come aggiungere menu di navigazione personalizzati nei temi WordPress
• Come aggiungere un menu responsive a schermo intero in WordPress
• Come creare un menu di navigazione verticale in WordPress
• Come aggiungere un mega menu al tuo sito WordPress
• Come stilizzare i menu di navigazione di WordPress
• Come visualizzare i link di navigazione breadcrumb in WordPress

Se ti è piaciuto questo articolo, iscriviti al nostro canale YouTube per tutorial video su WordPress. Puoi anche trovarci su Twitter e Facebook.