Configura i menu a discesa nel negozio online

Puoi utilizzare i menu a discesa per raggruppare prodotti, collezioni o pagine e facilitare la navigazione dei clienti nel negozio online. Ad esempio, se hai molti prodotti, puoi aggiungerli alle collezioni e quindi utilizzare un menu a discesa dal menu principale per organizzarle. In questo modo i clienti possono trovare più facilmente il tipo di prodotti che cercano.

Puoi anche aggiungere, rimuovere o modificare voci di menu nei menu a discesa o nei menu predefiniti.

Puoi visualizzare e modificare i menu del negozio online dalla sezione Contenuti > Menu del pannello di controllo Shopify.

Nidificazione di voci di menu per creare menu a discesa

Puoi creare menu a discesa creando o spostando le voci di menu in modo che siano nidificate sotto una voce di primo livello. La voce di primo livello viene visualizzata nel menu principale del negozio online e le voci di menu nidificate vengono visualizzate in un menu a discesa. La voce di primo livello può avere fino a due livelli di menu a discesa nidificati.

Tutti i temi mostreranno le voci nidificate come menu a discesa dal menu principale e alcuni temi le mostreranno come menu a discesa in altre posizioni.

Il menu principale e i menu a discesa vengono visualizzati in posizioni diverse nel negozio online a seconda del tuo tema. Alcuni temi mostrano un'icona accanto al nome di un menu a discesa nel menu principale per aiutare i clienti a capire che è presente un menu a discesa.

Aggiunta di un menu a discesa dal menu principale

Puoi aggiungere un menu a discesa da una qualsiasi delle voci di menu del menu principale.

Passaggi:

Integrazione del menu footer

I menu a discesa possono essere implementati anche nei menu footer.

Passaggi:

1. Dal pannello di controllo Shopify, vai a Contenuti > Menu.
2. Facoltativo: segui gli stessi principi di nidificazione usati per i menu principali, ad esempio trascinando le voci di menu sotto una voce header per creare una struttura a discesa; a tal fine, clicca sull'icona e trascina le voci nella posizione desiderata.
3. Inserisci # nel campo Link per le voci header che non devono reindirizzare a una pagina (ad esempio, gli header «Assistenza» o «Esplora»).

Considerazioni sulla compatibilità del tema

Esamina le seguenti considerazioni per l'aggiunta di menu a discesa al tema:

• La maggior parte dei temi supporta fino a due livelli di menu a discesa nidificati. Controlla la documentazione del tema o testa le voci nidificate per confermare la compatibilità.
• Alcuni temi potrebbero richiedere modifiche al CSS per migliorare l'usabilità da dispositivo mobile. Non personalizzare il tema se non hai familiarità con il suo codice. Scopri di più sulla personalizzazione del tema.

Come determinare se il tema supporta i menu a discesa nidificati

Per determinare se il tema corrente supporta il numero massimo di livelli di menu a discesa nidificati che desideri implementare, puoi utilizzare le seguenti risorse:

1. Controlla la documentazione del tema: consulta la documentazione del tema per informazioni specifiche sulle funzionalità dei menu e sui livelli di nidificazione supportati.
2. Testa le voci nidificate: crea una struttura di menu di prova con il numero di livelli nidificati desiderato e verifica che venga visualizzata correttamente sia su desktop che su dispositivi mobili.

La maggior parte dei temi supporta fino a due livelli di menu a discesa nidificati. Se riscontri problemi con i menu a discesa, verifica che il tema supporti il numero di livelli nidificati che stai tentando di implementare, poiché alcuni temi potrebbero richiedere una personalizzazione aggiuntiva per supportare più livelli di nidificazione.

Best practice per i menu a discesa

Esamina le seguenti best practice per creare una struttura di menu utile che funzioni correttamente su tutti i dispositivi:

• Utilizza etichette descrittive, come «Acquista per categoria», per le voci di menu di primo livello con link #.
• Assicurati che i menu siano ottimizzati per i dispositivi mobili. Puoi testare i menu sui dispositivi mobili per confermare che i menu a discesa si espandano come previsto.
• Aggiungi sette o meno voci di menu di primo livello per evitare un menu troppo affollato.
• Utilizza titoli dei link chiari e descrittivi. Ad esempio «Collezioni» e «Abiti estivi».
• Ogni menu può avere fino a 10.000 voci e il negozio può avere fino a 1000 menu in totale. Ai fini di questo limite, ogni voce di menu con sottovoci in un menu a discesa viene conteggiata come un menu separato.

Accessibilità del menu a discesa

La maggior parte dei temi implementa gli header dei menu a discesa come pulsanti anziché come link cliccabili. Si tratta di una scelta di design intenzionale per l'accessibilità, che aiuta i clienti che utilizzano la tecnologia assistiva a comprendere la struttura di navigazione.

Quando una voce di menu di primo livello controlla un sottomenu a discesa, funziona come un pulsante per espandere il menu anziché come un link a una nuova pagina. Questo approccio garantisce che i clienti che utilizzano screen reader o altri dispositivi assistivi possano navigare correttamente nel sistema di menu del negozio.

Se desideri che i clienti possano accedere a una pagina di categoria principale (ad esempio «Tutti i prodotti» o «Tutte le collezioni»), aggiungila come prima voce all'interno del menu a discesa stesso invece di rendere l'header cliccabile.

Risoluzione dei problemi comuni

Esamina le seguenti soluzioni ai problemi comuni che potresti riscontrare durante la configurazione dei menu di navigazione:

• Reindirizzamenti del menu per dispositivi mobili: se un link del menu di primo livello reindirizza a una nuova pagina quando lo tocchi, controlla il menu nel pannello di controllo Shopify per confermare che il campo del link del menu sia #.

• Problemi di visibilità: se le voci nidificate non vengono visualizzate, assicurati che siano trascinate completamente sotto la voce header e che abbiano un rientro nell'interfaccia Menu. Conferma che il tema supporti il numero di livelli nidificati che hai impostato.

• Compatibilità del tema: se riscontri problemi con i menu a discesa, verifica che il tema supporti il numero di livelli nidificati che stai tentando di implementare. Alcuni temi potrebbero richiedere una personalizzazione aggiuntiva per supportare più livelli di nidificazione.

• Creazione di menu nidificati bloccata: se visualizzi l'errore «Il menu non può contenere menu nidificati. Per utilizzarli, acconsenti esplicitamente alla funzionalità di navigazione nidificata», potrebbe essere necessario attivare la funzionalità di navigazione nidificata per il negozio. Questo problema riguarda in genere i negozi creati prima del 2018. Se visualizzi questo errore, contatta l'Assistenza Shopify.

• Visualizzazione del menu errato: se hai più link di navigazione che puntano alla stessa pagina (ad esempio la homepage), il tema potrebbe visualizzare il sottomenu sbagliato. Assicurati che ogni sezione di navigazione reindirizzi a una pagina univoca per evitare confusione.

• Scomparsa delle voci di menu: se i link del menu scompaiono senza essere stati eliminati, controlla se hai eliminato i prodotti, le collezioni o le pagine a cui erano collegate le voci di menu. L'eliminazione della risorsa collegata comporta anche la rimozione della voce di menu.

Personalizzazione del codice del tema per i menu a discesa

Per i temi che richiedono una personalizzazione più approfondita, puoi valutare la possibilità di personalizzare il codice del tema.