Guida Magento Lezione 10 – Come creare menu personalizzati

Ecco come creare menu personalizzati in Magento, contenenti link alle pagine e alle categorie principali del portale di e-commerce

Nella lezione precedente della guida abbiamo visto come installare un tema e come generare delle pagine statiche. In questa lezione continueremo ad occuparci ancora una volta del front end del sito: in particolare vedremo come creare menu personalizzati in Magento e come posizionarli all’interno della home page e delle altre pagine del portale.

La presenza di un menu all’interno di un qualsiasi sito Internet è fondamentale, in quanto, permette agli utenti di navigare con estrema facilità aiutandoli nella ricerca delle informazioni desiderate. L’home page di un portale deve quindi contenere almeno un menu, posizionato o in alto alla pagina (in genere si indica con il nome di top menu) o sul lato destro o sinistro. La disposizione del menu principale e di quelli secondari dipende dal tema scelto e installato nella lezione precedente. Vediamo quindi come creare menu personalizzati e come generare link alle pagine e alle categorie.

Come creare menu personalizzati in Magento: ecco spiegati tutti i passi

La prima operazione da compiere, subito dopo aver creato le pagine statiche (vedi Lezione 9) e le categorie prodotti (vedi Lezione 4), è quella di popolare il menu principale del sito inserendo i link ai servizi offerti. Generalmente tale menu contiene i link alla pagina di Home, a quella del Chi siamo, ai Contatti e alle Categorie principali dei prodotti in vendita.

Per inserire nuove voci e creare menu personalizzati è necessario collegarsi al back end di Magento. Dal menu principale facciamo clic sulla voce Catalogo e quindi su Gestisci Categorie.

creare menu personalizzati magento

A sinistra della pagina, nella sezione Categoria, selezioniamo la cartella Default Category e facciamo clic sul pulsante Aggiungi sottocategoria.

creare menu personalizzati magento default category

Supponiamo di voler far comparire come prima voce di menu quella di Home. Spostiamoci, quindi, nella scheda Informazioni generali e compiliamo il form indicando:

  • nel campo Nome la stringa Home;
  • nel campo È attivo la voce Si;
  • nel campo URL Key la dicitura home2: è importante che la URL Key sia diversa da quella utilizzata dalla pagina stessa (per verificare le URL Key delle pagine basta spostarsi in CMS / Pagine e visualizzare l’omonimo campo associato nella tabella);
  • le Immagini ed eventuali Thumbnail negli appositi campi;
  • il Titolo e la Descrizione meta per migliorare l’ottimizzazione;
  • la scelta Si alla voce Includi nel menu di navigazione: molto importante per consentire la visualizzazione della sottocategoria all’interno del menu principale.

creare menu personalizzati magento info

Trattandosi di un semplice link alla Home non è necessario compilare i campi presenti nelle altre schede. Facciamo quindi clic sul pulsante in alto Salva Categoria. Collegandoci al front end del sito noteremo come nel menu principale sia comparsa la voce Home.

creare menu personalizzati magento front end

A questo punto è necessario far sì che quando si clicca sulla voce Home si venga reindirizzati alla home page. Per far ciò bisogna creare un redirect che colleghi la sottocategoria ad una pagina specifica.

Menu personalizzati in Magento: come inserire link alle pagine

Per creare in Magento menu personalizzati, che contengano link alle varie pagine del CMS, bisogna agire sulla Gestione degli URL Rewrite. Dal back end del sito facciamo clic su Catalogo e quindi su Gestione URL Rewrite. Ricerchiamo all’interno della tabella l’URL Key che abbiamo creato per la sottocategoria Home. Clicchiamo su di esso per aprirlo in modalità Modifica.

creare menu personalizzati magento url rewrite

Selezioniamo il contenuto del campo Target Path e digitiamo sulla tastiera la combinazione di tasti Ctrl+C per copiare nella clipboard. Dal menu a tendina Redirect selezioniamo la voce Permanente (301). Facciamo quindi clic sul pulsante Salva.

A questo punto clicchiamo sul pulsante Aggiungi URL Rewrite in alto a destra della pagina.

Dal menu a tendina Crea URL Rewrite selezioniamo la voce Personalizzato. Nel campo Percorso ID inseriamo l’URL Key della pagina che intendiamo linkare, e dunque “home/.”. In Percorso richiesto incolliamo il target path che avevamo copiato al passo precedente (combinazione di tasti Ctrl+V). In Target Path inseriamo l’indirizzo della pagina ossia home e dal menu a tendina Reindirizzamento scegliamo la voce Permanente (301). Facciamo clic sul pulsante Salva.

A questo punto colleghiamoci al front end del sito e verifichiamo il funzionamento del pulsante Home.

Menu personalizzati in Magento: link alle categorie prodotti

Per inserire nei menu personalizzati ulteriori link alle pagine, come ad esempio Chi siamo, Dove siamo e Contattaci, basta ripetere la stessa procedura fin qui mostrata. Qualora volessimo inserire all’interno del menu link alle Categorie prodotti la procedura è molto più semplice.

Dal menu principale facciamo clic su Catalogo e quindi su Gestisci categorie. Selezioniamo la voce Default Category e facciamo clic sul pulsante Aggiungi sottocategoria. Compiliamo la scheda delle Informazioni generali come visto nei paragrafi precedenti e spostiamoci nella scheda Prodotti Categoria.

creare menu personalizzati magento categorie

Dalla tabella che compare selezioniamo i prodotti che fanno parte della categoria in questione e al termine facciamo clic sul pulsante Salva categoria.

Ritorniamo nel front end del sito e facciamo clic sulla nuova voce di menu: verremo reindirizzati in una nuova pagina contenente la lista dei prodotti appartenenti alla stessa categoria.

creare menu personalizzati magento prodotti

Creare menu personalizzati in Magento può sembrare dunque una procedura macchinosa, ma con le giuste dritte sarà un gioco da ragazzi.

 

Logo Artera Guida Magento

Questo articolo è offerto da Artera. Artera è un distributore di servizi internet di alto profilo dedicati alle aziende ed ai professionisti del web. Grazie ad un’infrastruttura di rete distribuita tra Italia e Svizzera, Artera garantisce elevatissimi standard di sicurezza, affidabilità e connettività.
Artera fornisce servizi di hosting, web marketing, sviluppo siti web e portali ecommerce e assicura soluzioni altamente professionali grazie ad uno staff specializzato e un servizio di assistenza tecnica dedicato e multicanale.