GUIDA JOOMLA - sara.unile.itsara.unile.it/~mirto/lingue/page3/files/14-joomla.pdf · Come è...

23
GUIDA JOOMLA Ing. Marco Passante Come è strutturato Joomla .......................................................................................... 2 Il pannello di amministrazione ................................................................................... 2 Organizzare i contenuti in Joomla .............................................................................. 4 Categorie e sezioni .................................................................................................. 7 Frontpage ................................................................................................................ 7 Archiviare gli articoli .............................................................................................. 8 Collegare i contenuti ai menu ................................................................................. 8 Scrivere articoli disposti su più pagine ....................................................................... 9 Gestire le immagini .................................................................................................. 10 I componenti ............................................................................................................ 12 Gestire i moduli ....................................................................................................... 14 I menu ...................................................................................................................... 16 Le estensioni ............................................................................................................ 17 La grafica e i template .............................................................................................. 18 Personalizzare il template di default ......................................................................... 20 Posizioni nel template .............................................................................................. 22

Transcript of GUIDA JOOMLA - sara.unile.itsara.unile.it/~mirto/lingue/page3/files/14-joomla.pdf · Come è...

Page 1: GUIDA JOOMLA - sara.unile.itsara.unile.it/~mirto/lingue/page3/files/14-joomla.pdf · Come è strutturato Joomla L’intero codice di Joomla può essere suddiviso in due grandi sezioni:

GUIDA JOOMLAIng. Marco Passante

Come è strutturato Joomla.......................................................................................... 2Il pannello di amministrazione ................................................................................... 2Organizzare i contenuti in Joomla .............................................................................. 4

Categorie e sezioni.................................................................................................. 7Frontpage................................................................................................................ 7Archiviare gli articoli.............................................................................................. 8Collegare i contenuti ai menu ................................................................................. 8

Scrivere articoli disposti su più pagine ....................................................................... 9Gestire le immagini .................................................................................................. 10I componenti ............................................................................................................ 12Gestire i moduli ....................................................................................................... 14I menu...................................................................................................................... 16Le estensioni ............................................................................................................ 17La grafica e i template.............................................................................................. 18Personalizzare il template di default......................................................................... 20Posizioni nel template .............................................................................................. 22

Page 2: GUIDA JOOMLA - sara.unile.itsara.unile.it/~mirto/lingue/page3/files/14-joomla.pdf · Come è strutturato Joomla L’intero codice di Joomla può essere suddiviso in due grandi sezioni:

Come è strutturato Joomla

L’intero codice di Joomla può essere suddiviso in due grandi sezioni: il lato frontend (sito) ed il lato di amministrazione. Il codice che realizza le funzionalità dell'amministrazione si trova nella cartella administrator.

Figura 1 I file del lato amministrazione

Il lato amministrazione è l’insieme di funzionalità di Joomla che si occupa di gestire i contenuti e le funzioni che sono rese disponibili attraverso il lato frontend.Troviamo nel sito dei box in cui sono visualizzate voci di menu, sondaggi, form per il login e la ricerca ed altre informazioni. Tutte queste sono informazioni che vengono fornite dai moduli, infatti ogni box è un modulo. Tutti i moduli vengono configurati utilizzando l’interfaccia di amministrazione.

Un altro meccanismo molto importante per il funzionamento di Joomla sono i menu. Come possiamo notare, ogni sito ha uno o più menu. Joomla basa il suo funzionamento sul fatto che ogni elemento di contenuto viene associato ad una voce di menu.

Il pannello di amministrazionePer accedere al pannello amministratore del nostro sito è necessario digitare l'indirizzo principale seguito da /administrator per esempio: www.miosito.it/administrator

Figura 2 Accedere come amministratore

Page 3: GUIDA JOOMLA - sara.unile.itsara.unile.it/~mirto/lingue/page3/files/14-joomla.pdf · Come è strutturato Joomla L’intero codice di Joomla può essere suddiviso in due grandi sezioni:

Come nome utente inseriremo "admin" e come password quella scelta al termine della procedura di installazione. Il Pannello di controllo ci appare suddiviso in tre aree, i vari menu a tendina nella parte superiore, le icone di accesso veloce nella parte centrale ed i messaggi e le statistiche nella parte destra.

Figura 3 Il pannello di controllo

Risulta molto utile mantenere una pagina del nostro browser posizionata in amministrazione (Back-end) di Joomla e una nuova pagina che visualizza la pagina principale accessibile ai visitatori del nostro sito (Front-end), per verificare velocemente il risultato delle modifiche effettuate. L'apposito tasto "anteprima" posizionato in alto a destra della barra del menu ci aiuta ad aprire questa nuova pagina che visualizza il Front-end.

Dal menu Sito>Configurazione si accede ai parametri di configurazione globale, solitamente non occorre apportare molte modifiche in questi parametri.

Nel riquadro "Configurazione Sito" ritroviamo il nome assegnato al sito in fase di installazione, nel riquadro Configurazione Metadata è consigliato modificare la Descrizione del sito (Meta Description) inserendo un testo non superiore ai 150 caratteri, che i motori di ricerca utilizzano per mostrare i risultati nelle cosiddette SERP.

Proprio per questo motivo una corretta scrittura del tag Meta Description è utilissima per aumentare i click al nostro sito nei risultati delle ricerche. Risulta utile per l'indicizzazione anche l'inserimento di parole chiave separate da virgola nel campo Parole chiave del sito (Meta Keywords).

Terminate queste modifiche è necessario premere sul tasto in alto a destra della pagina.

Una nuova modifica che si può ritenere subito necessaria è rivolta alla scritta centrale nella homepage "Benvenuto in Joomla!", questa può essere eseguita andando in Menu>Menu Principalepoi cliccando su Home> e poi su Parametri - Sistema.

Page 4: GUIDA JOOMLA - sara.unile.itsara.unile.it/~mirto/lingue/page3/files/14-joomla.pdf · Come è strutturato Joomla L’intero codice di Joomla può essere suddiviso in due grandi sezioni:

Figura 4 Modificare il titolo della pagina

Qui finalmente possiamo modificare il "Titolo pagina" ed inserire una nuova frase di benvenuto. È utile sottolineare che anche i titoli di pagina sono molto importanti ai fini del posizionamento.

Tutti i contenuti presenti nel nostro sito posso quindi essere modificati, disattivati, spostati o cancellati dal pannello amministratore utilizzando le apposite voci di menu.

Organizzare i contenuti in JoomlaVisualizzando il Front-end notiamo una grande quantità di testi inseriti in differenti posizioni, catalogati in categorie e accessibili in modalità differenti, questi vengono chiamati Contenuti ed è possibile gestirli dall'apposito menu di amministrazione Contenuti.

Figura 5 Pagina di esempio

Page 5: GUIDA JOOMLA - sara.unile.itsara.unile.it/~mirto/lingue/page3/files/14-joomla.pdf · Come è strutturato Joomla L’intero codice di Joomla può essere suddiviso in due grandi sezioni:

I contenuti appartenenti a determinate sezioni o categorie assumono il temine di Articoli. Si possono creare illimitate Sezioni che contengono illimitate Categorie che a loro volta possono contenere illimitati Articoli.

Figura 6 Schema dei contenuti di un sito

Risulta così estremamente semplice creare una nuova pagina del nostro sito, da menu Contenuti>Gestione Articoli. Dal tasto "Nuovo" in alto a destra si accede alla creazione dell'articolo.

Figura 7 Creazione di un nuovo articolo

È necessario inserire il "Titolo", selezionare la sezione e la categoria di appartenenza; se non è presente una sezione o una categoria adatta a questo contenuto è possibile selezionare "Nessuna categoria". Per inserire il contenuto, è necessario posizionare il cursore all'interno dell'editor e scrivere il contenuto, sia esso semplice testo o arricchito da immagini e link esterni.

Il menu dell'editor offre molte altre funzionalità che simili a quelle dei più noti programmi di elaborazione testi come Word. Terminata la compilazione del contenuto è necessario premere sul tasto "Salva" in alto a destra della pagina. L'articolo è ora salvato e ci viene mostrato nell'elenco degli articoli presenti. Da questo elenco è possibile tornare a modificare l'articolo premendo sul titolo, oppure variare lo stato dell'articolo, da pubblicato (quindi visibile dal nostro sito - Front-end)

Page 6: GUIDA JOOMLA - sara.unile.itsara.unile.it/~mirto/lingue/page3/files/14-joomla.pdf · Come è strutturato Joomla L’intero codice di Joomla può essere suddiviso in due grandi sezioni:

a non pubblicato (quindi non visibile da Front-end ma ancora presente in Back-end), mentre dalla colonna "Prima pagina" è possibile pubblicare il nostro articolo direttamente nella Homepage del sito.

In Joomla tutti i contenuti si chiamano “articoli”, ed ogni articolo appartiene ad una categoria, a sua volta contenuta in una sezione.

Figura 8 Gestione sezioni

Questa struttura non è modificabile se non attraverso l’uso di estensioni che consentano la creazione di ulteriori sottocategorie nidificate. Questo può rappresentare da un lato uno svantaggio, ma da un altro lato è utile per mantenere un certo ordine all’interno della gestione dei contenuti. Joomla ci permette di gestire il contenuto del sito attraverso il menu “Contenuti”.

Figura 9 Il menu contenuti

Questo menu offre cinque opzioni:

� Gestione articoli� Cestino articoli� Gestione sezioni� Gestione categorie� Gestione prima pagina

Page 7: GUIDA JOOMLA - sara.unile.itsara.unile.it/~mirto/lingue/page3/files/14-joomla.pdf · Come è strutturato Joomla L’intero codice di Joomla può essere suddiviso in due grandi sezioni:

“Gestione articoli” consente di visualizzare tutti gli articoli che sono presenti all’interno del sito, filtrarli in base alla categoria, alla sezione, allo stato ed in base ad altri parametri.

Categorie e sezioni

Se abbiamo installato i dati di esempio, possiamo notare che sono presenti molti articoli, sono suddivisi in 3 sezioni e 9 categorie. Possiamo gestire sezioni e categorie utilizzando le voci di menu a loro dedicate: “Gestione sezioni” e “Gestione categorie”.

Figura 10 Gestione articoli

Se un articolo non appartiene a nessuna sezione ed a nessuna categoria, si parla di contenuto statico. Questa funzionalità viene utilizzata per creare una pagina consultabile soltanto attraverso una voce di menu.

Frontpage

E’ possibile mostrare gli articoli in home page, semplicemente abilitando l’opzione “Prima pagina” dalla gestione articoli. Gli articoli in prima pagina vengono gestiti in modo diverso dagli altri, infatti esiste la voce di menu “Gestione prima pagina” che permette di gestire la presentazione, modificando l’ordine in cui questi contenuti sono presentati, sospendendo o rimuovendone la pubblicazione.

Page 8: GUIDA JOOMLA - sara.unile.itsara.unile.it/~mirto/lingue/page3/files/14-joomla.pdf · Come è strutturato Joomla L’intero codice di Joomla può essere suddiviso in due grandi sezioni:

Figura 11 Articoli archiviati e in prima pagina

Archiviare gli articoli

Da “Gestione articoli” o “Gestione prima pagina” abbiamo la possibilità di archiviare gli articolipubblicati. Selezionando la checkbox relativa ad un articolo e premendo l’icona “Archivia” il contenuto in questione viene archiviato.

Un contenuto archiviato viene tolto dalla pubblicazione, non è possibile agire su di esso modificandolo fino a che viene ripristinato usando l’apposita funzione.

Collegare i contenuti ai menu

Possiamo visualizzare tutti gli articoli contenuti in una determinata sezione o categoria collegando una voce di menu ad essa. Per fare questo apriamo ad esempio il menu “Menu | Main menu”. Premiamo il pulsante “Nuovo” e selezioniamo “Articoli”.

Figura 12 La lista degli articoli

Come possiamo vedere abbiamo la possibilità di mostrare:

Page 9: GUIDA JOOMLA - sara.unile.itsara.unile.it/~mirto/lingue/page3/files/14-joomla.pdf · Come è strutturato Joomla L’intero codice di Joomla può essere suddiviso in due grandi sezioni:

� Lista di articoli archiviati: visualizza tutti gli articoli che sono stati archiviati.� Aspetto articolo: possiamo mostrare un articolo qualsiasi tra quelli che abbiamo

memorizzato.� Aspetto invio articoli: mostra la form che permette l’invio di un nuovo articolo.� Aspetto categoria blog: mostra tutti gli articoli presenti in una categoria, usando un

particolare aspetto della pagina che mostra per primi gli ultimi articoli inseriti.� Aspetto blog prima pagina: mostra gli articoli che sono stati impostati come articoli di prima

pagina, nel formato blog.� Aspetto sezione blog: mostra tutti gli articoli di una sezione, in formato blog.� Aspetto sezione: mostra la lista delle categorie contenute in una sezione.

Scrivere articoli disposti su più pagineJoomla permette di pubblicare articoli molto lunghi e fornisce un meccanismo che ci permette di gestire articoli disposti su più pagine. Innanzitutto creiamo un nuovo articolo aprendo il menu “Contenuti | Gestione articoli” e cliccando il pulsante “Nuovo” in alto a destra.

Figura 13 Creiamo un nuovo articolo

A questo punto viene presentato il form che ci consente di inserire un nuovo contenuto nel sito. Compiliamo il campo “Titolo” inserendo “Prova di articolo multipagina“, impostiamo l’articolo pubblicato ma non in prima pagina e creiamolo come articolo della sezione “News”, categoria “Latest”.

Ora possiamo concentrarci sulla parte che ci interessa di più: il testo. Scriviamo la prima parte dell’articolo (5-6 paragrafi), quindi scorriamo la pagina e premiamo il pulsante “Pagebreak” posto in fondo all’editor di testo.

Figura 14 Il pulsante pagebreak

Viene evidenziato che si tratta della prima pagina delle due che compongono l’articolo, viene mostrato uno strumento per la navigazione sequenziale tra le pagine (Prec. - Succ.) e sulla destra è mostrato l’indice dell’articolo.

Page 10: GUIDA JOOMLA - sara.unile.itsara.unile.it/~mirto/lingue/page3/files/14-joomla.pdf · Come è strutturato Joomla L’intero codice di Joomla può essere suddiviso in due grandi sezioni:

Come detto questo indice è composto dai valori inseriti nel campo “Tabella dei contenuti” di ogni pagebreak. È possibile creare un numero infinito di pagebreak creando articoli davvero molto lunghi ma ben organizzati e leggibili.

Gestire le immaginiJoomla ci permette di avere una "gestione delle immagini" completa. Innanzitutto dobbiamo distinguere tra le immagini che compongono la grafica del sito, facenti parte del template, e le <strong>immagini che sono parte del contenuto</strong>: noi ci occupiamo della seconda tipologia di immagini.

Accediamo al backend di Joomla; selezioniamo il menu “Sito” ed apriamo il collegamento "Gestione media". Verrà mostrato il pannello di amministrazione mostrato in figura.

Figura 15 Gestione media

Questo pannello mostra i file che sono contenuti nella cartella /media della vostra installazione Joomla, directory che contiene tutte le immagini mostrate negli elementi di contenuto. Come possiamo notare il pannello è un vero e proprio file manager: cliccando le cartelle esploriamo il loro contenuto. Due sono le viste disponibili, equivalenti: “Visualizza Miniature” e “Visualizza Dettagli”.

Possiamo cancellare cartelle e file, creare nuove cartelle e caricare file sul server usando la funzione “Carica file”.

La cartella “Media” contiene diversi file in uso nel backend di Joomla. Le sottocartelle sono così organizzate:

� M_images: contiene alcune immagini da utilizzare nel frontend� banners: contiene le immagini dei banner pubblicitari, usate dal componente Banners.� smilies: contiene le immagini da utilizzare come emoticons� stories: contiene immagini utilizzate per la presentazione del contenuto, pubblicate negli

articoli di Joomla.

Page 11: GUIDA JOOMLA - sara.unile.itsara.unile.it/~mirto/lingue/page3/files/14-joomla.pdf · Come è strutturato Joomla L’intero codice di Joomla può essere suddiviso in due grandi sezioni:

E’ buona norma cercare di organizzare le immagini che si vuole inserire negli articoli, creando sottocartelle nella directory “stories”. Così sarà più semplice gestire le immagini quando la mole dicontenuti aumenterà. Caricare e gestire file usando le funzioni di questo pannello è equivalente ad usare un software FTP.

Ciò che rende indispensabile la pagina “Gestione media” è che a volte l’accesso FTP non è disponibile e questo è uno dei due modi per caricare i file sul server. Il secondo metodo lo incontriamo ogni volta che andiamo a scrivere un nuovo articolo.

Proviamo a modificare un articolo esistente, selezionando la voce di menu “Contenuti | Gestione articoli”. Selezioniamo un articolo di esempio ed accediamo alla pagina dove possiamo modificare il suo contenuto. Scorrendo sotto il form in cui è presente il testo della pagina è presente un pulsante “Immagine”.

Figura 16 L'inserimento di un'immagine

Premendolo, viene presentato un form in cui viene visualizzato il contenuto della cartella “stories”.

Figura 17 Il contenuto della cartella delle immagini

Possiamo caricare una nuova immagine o inserire nell’articolo una immagine esistente. Per compiere quest’ultima operazione selezioniamo un'immagine, riempiamo i campi “Descrizione immagine” e “Titolo”. Spuntiamo il box “Mostra didascalia” se desideriamo avere una didascalia per l’immagine.

Page 12: GUIDA JOOMLA - sara.unile.itsara.unile.it/~mirto/lingue/page3/files/14-joomla.pdf · Come è strutturato Joomla L’intero codice di Joomla può essere suddiviso in due grandi sezioni:

In questo caso, il testo contenuto nel campo “Titolo” viene usato come didascalia dell’immagine (oltre che nel campo “alt” del tag img). Per completare l’inserimento scegliamo il tipo di allineamento desiderato (Non impostato, Sinistra o Destra) e premiamo il pulsante “Inserisci”.

I componentiOltre alla semplice gestione dei contenuti con Joomla è possibile arricchire di nuove funzionalità il nostro sito. Per esempio sono disponibili componenti per la gestione dei Banner pubblicitari, sondaggi o weblink e molti altri componenti possono essere installati in seguito scaricandoli dal sito extensions.joomla.org.

Esaminiamo alcuni componenti presenti nella nuova versione 1.5, iniziando dalla gestione dei banner. Dal Back-end si accede al menu Componenti>Banner>Banner per visualizzare l'elenco dei banner di esempio già presenti di default.

Figura 18 Gestione Banner

Questo utile componente permette la visualizzazione alternata dei banner che vogliamo inserire nelle pagine del nostro sito. Dalla gestione amministrativa è possibile suddividere i banner assegnandoli a differenti clienti e controllare il numero dei click che ricevono e il numero delle impressioni che ogni immagine totalizza.

Se lo desideriamo, possiamo inserire un sondaggio o modificare quello presente come esempio, è necessario accedere a Componenti>Sondaggio. Prima di creare e pubblicare il nuovo sondaggio è necessario sospendere quello attualmente attivo, per non avere così due o più sondaggi presenti nella homepage del sito.

Page 13: GUIDA JOOMLA - sara.unile.itsara.unile.it/~mirto/lingue/page3/files/14-joomla.pdf · Come è strutturato Joomla L’intero codice di Joomla può essere suddiviso in due grandi sezioni:

Figura 19 Inserire un nuovo sondaggio

Per catalogare e gestire la raccolta dei collegamenti a siti esterni è presente il componente Web Link: Componenti>Web Link. Il link sono suddivisi in categorie e ogni collegamento può essere correlato da titolo e descrizione. Viene inoltre riportato il numero di visite che ogni link riceve.

Figura 20 Gestione dei link esterni

Un utile strumento per aggregare testi sempre aggiornati presi dai nostri siti preferiti ci viene offerto dal componente News Feed: Componenti>News Feed. Attraverso l'utilizzo degli RSS distribuiti dai più noti portali e da moltissimi altri siti, è possibile creare un nuovo Newsfeed, inserendo il nome e il link al file XML del sito sorgente e indicando quante notizie desideriamo mostrare sul nostro sito provenienti da questa fonte.

Page 14: GUIDA JOOMLA - sara.unile.itsara.unile.it/~mirto/lingue/page3/files/14-joomla.pdf · Come è strutturato Joomla L’intero codice di Joomla può essere suddiviso in due grandi sezioni:

Figura 21 Inserire un feed RSS esterno

L'ultimo componente che descriviamo tra quelli presenti nella distribuzione 1.5 risulta essere tra i più utilizzati. In ogni sito che si rispetti è presente l'apposito modulo per contattare il responsabile o la redazione del sito. Con Joomla è possibile inserire un unico contatto od un elenco di recapiti suddivisi in categorie. Dal Back-end si accede al menu Componenti>Contatti>Contatti per modificare i parametri inseriti nel contatto di esempio o inserire un nuovo contatto.

Gestire i moduliAnalizzando ora questi componenti visti con gli occhi del visitatore del nostro sito, quindi dal Front-end, possiamo apprezzare molto la struttura modulare di Joomla. Visualizzando la Homepage notiamo che grazie al componente "Sondaggi" possiamo visualizzare l'elenco delle voci da votare, questo è permesso proprio grazie al "Modulo" associato al componente "Sondaggi". Possiamo così decidere in quale posizione del nostro sito far apparire tale modulo, quando farlo apparire e se farlo apparire. Oltre al modulo dei sondaggi, è facile riconoscere sulla sinistra la colonna con i moduli di menu ed in alto i moduli delle ultime notizie e delle notizie più lette. Tutti questi moduli possono essere gestiti dal Back-end dalla gestione moduli: Estensioni>Gestione moduli.

Page 15: GUIDA JOOMLA - sara.unile.itsara.unile.it/~mirto/lingue/page3/files/14-joomla.pdf · Come è strutturato Joomla L’intero codice di Joomla può essere suddiviso in due grandi sezioni:

Figura 22 Il pannello di gestione dei moduli

Ad ogni modulo viene assegnata una posizione, questo permette di individuare precisamente in quale parte del nostro sito tale modulo appare. Nella parte bassa di questo elenco è facile visualizzare il modulo "Sondaggi" pubblicato nella posizione "right", che quindi appare come primo modulo nella colonna di destra del nostro sito, con sotto i moduli "Chi è Online" e "Pubblicità".

Utilizzando le comode frecce verdi è possibile modificare l'ordine di visualizzazione dei moduli pubblicati nella medesima posizione. Premendo sul nome del modulo si accede ai parametri dello stesso. Dall'area "Assegnazione Menu" si possono selezionare una o più voci di menu (tenete premuto il tasto Ctrl per effettuare selezioni multiple). Il modulo apparirà solo quando da Front-end si clicca su questa voci di menu. L'esempio del modulo "Sondaggi" ci conferma che questo è visibile sono nella Homepage.

Figura 23 Esempio di modifica di un modulo

Page 16: GUIDA JOOMLA - sara.unile.itsara.unile.it/~mirto/lingue/page3/files/14-joomla.pdf · Come è strutturato Joomla L’intero codice di Joomla può essere suddiviso in due grandi sezioni:

I menuUna delle caratteristiche più interessanti di Joomla è costituita dai menu. Il nostro sito può essere dotato di più menu, solitamente uno nella colonna di destra (o sinistra) ed uno in alto. Ad ogni menu viene associato il rispettivo modulo, così da permetterci il pieno controllo della sua posizione.

Figura 24 Corrispondenza modulo-menu

Aggiungere nuove voci a questi menu è estremamente semplice e intuitivo. Prendendo ad esempio il menu principale, andiamo ad inserire la voce "Contattaci" che permette la visualizzazione del componente "contatti". Da Back-end posizionarsi in Menu>Menu principale e premere su "Nuovo".

Figura 25 Creare una nuova voce di menu

Dalla schermata "Seleziona tipo voce di menu" selezionare "Contatti" e successivamente "Layout contatto". Inserire nel Titolo "Contattaci" e premere sul tasto "Salva".

Page 17: GUIDA JOOMLA - sara.unile.itsara.unile.it/~mirto/lingue/page3/files/14-joomla.pdf · Come è strutturato Joomla L’intero codice di Joomla può essere suddiviso in due grandi sezioni:

Figura 26 Modificare il layout della voce di menu

In questo modo abbiamo aggiunto la nuova voce di menu che permette ai visitatori del sito di contattarci facilmente. Con questa procedura è possibile costruire i nostri menu e personalizzarne le funzioni agendo sui numerosi parametri.

Le estensioniAmpliare e potenziare le caratteristiche del sito è importante per mantenere sempre alta l'attenzione dei visitatori e offrire nuovi ed interessanti servizi e funzionalità. Con Joomla questo è possibile grazie alla grande quantità di "estensioni" a disposizione e alla grande semplicità di integrazione di queste nella struttura del nostro sito.

Esiste una grande fonte per reperire queste estensioni: extensions.joomla.org, dove sono catalogate migliaia di nuove componenti e moduli da utilizzare liberamente o acquistandone la relativa licenza d'utilizzo.

Queste estensioni vengono distribuite in formato compresso (un unico file solitamente di piccole dimensioni, pochi KB). Per installarle sul nostro sito è necessario accedere al Back-end e, da Estensioni>Installa/Disinstalla, all'area di installazione.

Tramite il tasto "sfoglia" è possibile selezionare il file compresso dell'estensione scaricata e premere sul tasto "Carica file e Installa". Al termine del caricamento visualizzeremo una serie di informazioni fornite dallo sviluppatore dell'estensione.

Page 18: GUIDA JOOMLA - sara.unile.itsara.unile.it/~mirto/lingue/page3/files/14-joomla.pdf · Come è strutturato Joomla L’intero codice di Joomla può essere suddiviso in due grandi sezioni:

Figura 27 Installare un'estensione

Possiamo ora procedere alla prima configurazione di questo nuovo componente (o modulo). Dal menu "Componenti" è presente la nuova voce che ci permette di accedere al componente. Risultano molto utili le estensioni per la gestione di gallerie fotografiche, altre per creare un vero e proprio carrello elettronico o per l'integrazione di un forum o di una chat. Terminata la prima configurazione del componente è necessario creare la nuova voce di menu che ne permetta la visualizzazione sul nostro sito.

La grafica e i templateUna delle prerogative di Joomla! è la gestione dei temi grafici o template. Grazie alla notevole flessibilità di questi temi, costruiti con layout totalmente differenti, i moltissimi siti realizzati con questo CMS non risultano mai simili. Prima di cimentarsi nella realizzazione di un proprio template è bene provare e modificare a proprio piacere uno dei molti template gratuiti disponibili in rete. È possibile scaricarne anche dalla sezione template del sito italiano.

Page 19: GUIDA JOOMLA - sara.unile.itsara.unile.it/~mirto/lingue/page3/files/14-joomla.pdf · Come è strutturato Joomla L’intero codice di Joomla può essere suddiviso in due grandi sezioni:

Figura 28 Scaricare un template

I template sono considerati a tutti gli effetti come estensioni, quindi hanno caratteristiche del tutto simili a queste ultime: sono distribuiti in un unico file compresso e devono essere inseriti nel CMS attraverso il pannello di installazione delle estensioni del back-end (Estensioni>Installa/Disinstalla).

Figura 29 Installare il template

Per attivare il template precedentemente caricato è sufficiente cliccare sul segno di spunta a fianco del nome e premere sul tasto "Predefinito" in alto a destra.

Page 20: GUIDA JOOMLA - sara.unile.itsara.unile.it/~mirto/lingue/page3/files/14-joomla.pdf · Come è strutturato Joomla L’intero codice di Joomla può essere suddiviso in due grandi sezioni:

Figura 30 Modificare il template predefinito

Visitando ora il Front-end del nostro sito questo ci appare graficamente e strutturalmente modificato secondo le specifiche di questo nuovo tema grafico. Possiamo ripetere questa operazione molte volte, fino a riconoscere quello che riteniamo il template più adatto alle caratteristiche del nostro sito.

La personalizzazione del template scelto avviene modificando le immagini presenti nella relativa cartella accessibile via FTP seguendo questo percorso:

template/nometemplate/images

Ai più esperti è consigliata anche la modifica del file index.php presente nella cartella del template ed il relativo foglio di stile presente nella sottocartella CSS.

Personalizzare il template di defaultL'uso di un CMS come Joomla fa sì che la grafica possa essere modificata e cambiata attraverso pochi click. Vediamo come possiamo usare il template di default e "cammuffarlo" per rendere il nostro sito un po' diverso dagli altri.

Accediamo al backend di Joomla e selezioniamo il menu "Estensioni | Gestione template".

Page 21: GUIDA JOOMLA - sara.unile.itsara.unile.it/~mirto/lingue/page3/files/14-joomla.pdf · Come è strutturato Joomla L’intero codice di Joomla può essere suddiviso in due grandi sezioni:

Figura 31 Gestione template

Supponiamo di usare rhuk_milkyway, il template di default, anche se le seguenti istruzioni si applicano a qualunque template dotato di parametri.

Figura 32 La modifica del template

Assicuriamoci che nel box “Parametri” sia evidenziato come il file params.ini sia scrivibile. In caso contrario, dobbiamo agire sui permessi di tale file usando CPanel. Ora possiamo modificare i colori del template: il colore usato per i moduli quello per lo sfondo.

Il box “Larghezza Template” ci permette di scegliere la dimensione occupata dal template: fluida (si ingrandisce a seconda della larghezza della finestra del browser), piccola, media o grande.

Fatto questo, vediamo come modificare la grafica per adattarla al nostro sito: immaginiamo di avere un logo e di volerlo sostituire al logo di Joomla. Apriamo il nostro client FTP e colleghiamoci al sito Joomla. Dobbiamo caricare nella cartella templates/rhuk_milkyway/images l’immagine che abbiamo intenzione di usare come logo.

Ora apriamo il menu “Estensioni | Gestione template”. Selezioniamo il template in uso (rhuk_milkyway) e nella pagina successiva premiamo il pulsante "Mod. CSS". Dall’elenco dei file CSS che compongono il template selezioniamo il principale, ovvero template.css, e premiamo il pulsante "Modifica".

Page 22: GUIDA JOOMLA - sara.unile.itsara.unile.it/~mirto/lingue/page3/files/14-joomla.pdf · Come è strutturato Joomla L’intero codice di Joomla può essere suddiviso in due grandi sezioni:

Figura 33 Editor CSS

La pagina visualizzata è un form che consente di modificare il file CSS del nostro template. Usiamo la funzione "Trova" del browser cercando la parola “logo”.

Figura 34 Cerchiamo la parola logo

Ora modifichiamo la definizione di div#logo, scrivendo all’interno della proprietà “background” il percorso del nostro nuovo logo.

Premiamo il pulsante “Applica” in alto a destra ed apriamo l’anteprima del sito. Aggiornando la pagina vedremo come il logo è cambiato.

Possiamo tornare alla pagina di modifica del file CSS per apportare ulteriori modifiche al file CSS e perfezionare la visualizzazione del nuovo logo: margini, altezza ed ogni altra impostazione utile.

Posizioni nel templateCiascuna pagina del nostro sito Joomla è composta da una parte centrale, gestita da un componente, dai menu e da altre zone in cui sono fornite informazioni importanti. I menu e le informazioni “di contorno” sono gestite dai moduli.

Page 23: GUIDA JOOMLA - sara.unile.itsara.unile.it/~mirto/lingue/page3/files/14-joomla.pdf · Come è strutturato Joomla L’intero codice di Joomla può essere suddiviso in due grandi sezioni:

Per capire come Joomla organizza i moduli apriamo il menu “Estensioni | Gestione moduli”.

Figura 35 Gestione moduli

Viene visualizzato l’elenco dei moduli presenti nel sito. Come possiamo notare esiste una colonna “Posizione” che identifica la posizione di ogni modulo all’interno del template. Le posizioni possono essere pensate come aree in cui possiamo inserire uno o più moduli.

Ogni template gestisce le posizioni mostrandole all’interno della pagina in modo differente, senza una regola precisa a parte una comune denominazione di parti standard come “left”, “top”, “footer”. E’ per questo che cambiando template a volte non compaiono dei moduli, oppure compaiono ma in posizioni completamente sballate.

Per vedere quali sono le posizioni che vengono fornite da un template apriamo la pagina “Gestione template”; selezionando il menu “Estensioni | Gestione template”. Selezioniamo il template che ci interessa, quindi premiamo il pulsante “Anteprima” in alto a destra.

Verrà mostrata una pagina in cui sovrapposto al template viene mostrata una maschera che elenca le posizioni utilizzate da ogni modulo.

La stessa schermata si ottiene inserendo nella URL della home del sito il suffisso: ?tp=1