Guida Magento Lezione 9 – Tema e creazione pagine

In questa lezione vedremo come installare un nuovo tema in Magento e come creare delle pagine statiche per il nostro portale di e-commerce

Nelle precedenti lezioni della guida abbiamo visto come configurare e personalizzare Magento al fine di sviluppare un portale di e-commerce che possa soddisfare al meglio le proprie esigenze di vendita. Dopo aver popolato il catalogo prodotti, aver impostato le tasse secondo quanto previsto dalla normativa, definito i metodi di pagamento e quelli di spedizione è giunto il momento di avviare la vera e propria attività di vendita online.

E’ importante, quindi, in questa fase occuparsi del front end del sito valorizzando non soltanto il lato estetico ma anche e soprattutto quello contenutistico. Come ogni sito che si rispetti, anche il nostro portale realizzato con Magento dovrà essere costituito da una home page, da pagine interne che descrivono l’azienda, i prodotti e così via e da almeno un menu che faciliti la navigazione all’interno del portale. La struttura del sito, ossia la disposizione dei contenuti all’interno delle pagine, viene definita da quello che va sotto il nome di template o tema grafico. Si tratta di un modello sul quale vengono realizzate le varie pagine del sito.

In Rete sono disponibili tantissimi template pronti all’uso, alcuni gratuiti altri a pagamento. In fase di installazione Magento applica un tema di default. Qualora decidessimo di cambiare la grafica del nostro sito dovremmo installare un nuovo tema. Magento offre numerosi temi gratuiti che è possibile visionare all’indirizzo www.magentocommerce.com/magento-connect nella sezione Themes. Vediamo di seguito, quindi, come scaricare e installare un tema grafico che soddisfi i nostri gusti.

Magento: come installare un tema

Dopo aver visionato nella sezione Themes di Magento Connect tutti i temi ed aver scelto quello che più ci aggrada, per installarlo facciamo clic sul pulsante Install Now, applichiamo il segno di spunta ad I agree… e facciamo clic sul pulsante Get Extension Key.

magento ricerca tema

A questo punto selezioniamo e copiamo il link indicato e ritorniamo nel back end del nostro portale. Dal menu principale facciamo clic su Sistema e quindi su Magento Connect e Magento Connect Manager. Inseriamo nuovamente le credenziali di accesso di amministratore e dalla scheda Extension, che compare nella nuova pagina, portiamoci nella sezione Install New Extensions. Incolliamo al punto 2 il link copiato in precedenza e facciamo clic sul pulsante Install e quindi Proceed.

magento installazione tema

Attendiamo qualche secondo. Se l’installazione è andata a buon fine vedremo comparire in basso alla pagina la schermata di seguito riportata.

magento tema installato

Effettuiamo il logout dal Magento Connect Manager e ritorniamo nel back end del sito. Dal menu principale portiamoci nella sezione Sistema e quindi Design. Nella pagina che compare facciamo clic sul pulsante in alto a destra Aggiungi modifica al design. In Impostazioni generali, alla voce Design personalizzato, selezioniamo hellowired (ovvero il nome del template che abbiamo appena installato). Facciamo quindi clic sul pulsante Salva.

magento scelta tema

A questo punto abbiamo installato e attivato il nuovo tema grafico. Per visualizzarlo colleghiamoci al front end del sito.

Come creare pagine in Magento

Definito l’aspetto grafico del portale iniziamo ad occuparci dei contenuti. Ogni sito è caratterizzato in genere da due differenti tipologie di pagine: quelle statiche e quelle dinamiche. Per pagine statiche si intendono quelle pagine che non variano mai nel tempo, a meno di piccole modifiche. Ad esempio le pagine del Chi Siamo, Dove siamo, Contattaci, in genere vengono create nella fase iniziale di progettazione del sito e non vengono mai modificate o eliminate, da qui l’aggettivo statico. Altre pagine che riguardano invece articoli, prodotti, categorie ecc. sono in continua evoluzione e spesso si trovano anche ad essere sostituite con delle nuove.

Vediamo di seguito come generare una pagina statica, in particolare ci soffermeremo sulla creazione della pagina Chi siamo, dove inseriremo tutte le informazioni che riguardano la nostra azienda.

Dal menu principale del back end, in CMS facciamo clic sulla voce Pagine. Avremo così accesso alla tabella che elenca tutte le pagine statiche già presenti in Magento. Per aggiungerne una nuova facciamo clic sul pulsante in alto a destra Aggiungi una nuova pagina.

magento informazioni pagina

Nella scheda Informazioni pagina indichiamo:

  • il Titolo della pagina: Chi siamo;
  • l’URL key (ossia le parole da associare all’URL della pagina): chi-siamo;
  • lo Stato: lasciamo pure la voce Abilitato.

Spostiamoci quindi nella scheda Contenuto.

magento contenuto pagina

Inseriamo quindi il Titolo del contenuto (ad esempio Storia aziendale) e, sfruttando il comodo ed intuitivo editor, inseriamo il testo che vogliamo venga visualizzato nella pagina Chi siamo. Al termine spostiamoci nella scheda Design.

In questa sezione possiamo indicare il layout, ossia la struttura grafica che la pagina deve rispettare. Dal menu a tendina Layout possiamo scegliere tra le opzioni 1 colonna (pagina a tutto schermo), 2 colonne con barra laterale sinistra, 2 colonne con barra laterale destra e 3 colonne.

magento layout personalizzato

Sfruttando la sezione Design personalizzato possiamo scegliere di associare alla pagina un tema diverso da quello scelto per l’intero sito Magento (Tema personalizzato) e indicare eventualmente anche il periodo durante il quale questo tema dovrà essere attivo (utile ad esempio per il periodo natalizio, periodo estivo, ecc.).

A questo punto spostiamoci nell’ultima scheda Meta Dati ed indichiamo la Parola chiave e una breve Descrizione da circa 150 caratteri. Al termine facciamo clic sul pulsante Salva pagina in alto a destra.

Non ci resta quindi che creare tutte le pagine statiche cui necessita il sito seguendo esattamente la stessa procedura. Nella prossima lezione vedremo come creare il menu principale e come strutturare la home page. Continuate a seguirci!

 

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.