- Alessandra Salvaggio - Joomla! 3.3 Guida all uso Installazione di Joomla e gestione del lato amministrativo >> Installazione di XAMPP per il test locale dei propri siti >> Creazione di template personalizzati >> Uso di moduli ed estensioni di terze parti >>
Joomla! 3.3 Guida all uso Alessandra Salvaggio
Joomla! 3.3 Guida all uso Autrice: Alessandra Salvaggio Collana: Editor: Marco Aleotti Progetto grafico: Roberta Venturieri Immagine di copertina: Kesu01 Thinkstock ISBN: 978-88-6895-065-1 Copyright 2014 LSWR Srl Via Spadolini, 7-20141 Milano (MI) - www.lswr.it Finito di stampare nel mese di ottobre 2014 presso Press Grafica s.r.l., Gravellona Toce (VB) Nessuna parte del presente libro può essere riprodotta, memorizzata in un sistema che ne permetta l elaborazione, né trasmessa in qualsivoglia forma e con qualsivoglia mezzo elettronico o meccanico, né può essere fotocopiata, riprodotta o registrata altrimenti, senza previo consenso scritto dell editore, tranne nel caso di brevi citazioni contenute in articoli di critica o recensioni. La presente pubblicazione contiene le opinioni dell autore e ha lo scopo di fornire informazioni precise e accurate. L elaborazione dei testi, anche se curata con scrupolosa attenzione, non può comportare specifiche responsabilità in capo all autore e/o all editore per eventuali errori o inesattezze. Nomi e marchi citati nel testo sono generalmente depositati o registrati dalle rispettive aziende. L autore detiene i diritti per tutte le fotografie, i testi e le illustrazioni che compongono questo libro, salvo quando diversamente indicato.
Sommario INTRODUZIONE...11 1. L AMBIENTE DI LAVORO...13 Creare un database MySQL con phpmyadmin...21 Configurare XAMPP in modo che il sito possa inviare e-mail...22 2. INSTALLAZIONE DI JOOMLA...25 Scaricare Joomla...25 Installare Joomla...26 Layout adattivo...34 3. CONFIGURAZIONI GENERALI E LA STRUTTURA DI JOOMLA...37 La struttura di Joomla...43 4. CREARE GLI UTENTI...49 Gruppi di utenti... 49 Creare nuovi utenti...54 Modificare le opzioni relative a un utente...58 Creazione di un utente lato Front-end...58 Le note utenti... 60 Le opzioni per la creazione degli utenti... 64 Comunicare con gli utenti... 66 Gli utenti connessi...67 5. LE IMMAGINI E I MEDIA...69 Inserire immagini nella cartella immagini...70 6. CREARE LE CATEGORIE...77 7. CREARE UN ARTICOLO...85 L editor degli articoli...95 Creare articoli da Front-end...105 Modificare il contenuto e lo stato di un articolo da Front-end...109 La versione mobile dell editor...109 5
Joomla! 3.3 Guida all uso 8. GESTIRE GLI ARTICOLI...111 Filtrare gli articoli...112 Archiviare gli articoli...112 Cestinare gli articoli...114 Ordinare gli articoli...115 Azioni multiple...117 9. I LIVELLI DI ACCESSO...119 Nascondere contenuto agli utenti loggati... 124 10. CONTROLLARE L ASPETTO DELLA HOME PAGE... 125 Layout...129 Altre opzioni per la gestione della home page... 133 Mantenere un articolo sempre fisso sulla home page... 135 11. I MENU... 139 Aggiungere un nuovo menu... 139 Aggiungere nuove voci a un menu...148 Menu in rapporto fra loro...160 12. MENU UTENTE... 165 Le voci di menu relative alla gestione degli utenti... 167 Le voci di menu relative alla Gestione configurazione...170 13. ALTRI MODULI... 171 Articoli archiviati... 173 Articoli correlati... 174 Articoli più letti... 174 Articoli recenti... 174 Banner... 175 Cerca... 175 Chi è online... 176 Elenco articoli... 177 Elenco categorie... 178 Footer... 178 Generatore feed...179 HTML personalizzato...181 Immagine casuale...181 Informazioni di sistema...181 Lingua...182 Link web...182 Login...182 Modulo Motore di ricerca...184 Newsflash...184 6
Sommario Percorso...184 Tag popolari e Tag simili...185 Ultimi utenti registrati...185 Visualizzazione feed...186 Wrapper...186 14. I COMPONENTI... 187 Aggiornamento di Joomla...188 Banner...189 Contatti...195 Link web...200 Messaggi...202 News feed...204 Redirect...205 Statistiche ricerche... 207 15. TAG...209 Creare i tag...210 Assegnare i tag agli elementi di un sito... 212 Creare voci di menu con i tag... 212 Moduli Tag popolari e Tag simili...216 16. STRUMENTI DI RICERCA... 219 Una pagina di ricerca... 222 17. GESTIONE AVANZATA DEGLI UTENTI...223 Far sì che gli utenti accettino le condizioni di uso del sito e raccogliere più informazioni sugli utenti... 223 Verifica in due passaggi... 225 18. LINGUE... 231 Installare le lingue... 231 Creare una lingua per i contenuti... 235 Creare i contenuti multilingua... 237 I menu per le diverse lingue... 239 Il plugin System - Language Filter... 243 Il modulo Lingua...244 19. I TEMPLATE... 247 Applicare un template ad alcune pagine di un sito... 248 Modificare un template con i parametri... 249 Modificare un template via codice... 251 Scaricare e installare nuovi template... 253 7
Joomla! 3.3 Guida all uso 20. L OVERRIDE... 255 L override di un componente... 256 L override di un modulo... 259 L override della lingua...260 21. CLONARE E MODIFICARE UN PLUGIN... 263 22. SEO... 269 Titoli e meta tag per il sito e le sue pagine... 269 Ottimizzazione dei menu e dei link... 271 Leggi tutto con titolo articolo... 273 Mappa del sito...274 Navigazione breadcrumb...274 URL SEF...274 23. LE ESTENSIONI DI JOOMLA: JCE... 281 Usare JCE...286 Aggiornare le estensioni...291 24. JCK... 293 Link a PDF e file in genere... 295 Inserire le immagini...298 Audio e Video HTML 5...298 Stili...300 Codice sorgente, div contenitori e visualizzazione blocchi...300 Android...301 Caricare le immagini da ipad...301 Video YouTube... 303 Editor Switcher...304 25. AKEEBA BACKUP... 307 Creare il backup...310 Permettere di effettuare il backup a utenti non Super User...311 Ripristinare il sito con Kickstart... 312 26. GOOGLEMAPS PLUGIN: UNA MAPPA DI GOOGLE IN UN SITO JOOMLA... 317 Googlemaps Plugin... 317 Procurarsi i dati (latitudine e longitudine) per costruire la mappa...320 27. CREARE UNA MAPPA DEL SITO...323 Inserire la mappa nel sito... 326 8
Sommario 28. SOCIAL NETWORK... 329 Facebook... 329 Pulsante Mi piace e condivisione su altri social network... 332 29. FEEDBURNER...337 30. UNA NEWSLETTER... 343 31. GOOGLE ANALYTICS... 349 32. AGGIORNARE IL PROPRIO SITO DA UN TELEFONO ANDROID...353 33. AGGIORNARE UN SITO DA JOOMLA 2.5... 359 Installare i file della lingua italiana... 363 INDICE ANALITICO... 365 9
Introduzione Joomla è il CMS attualmente più diffuso. Un CMS (Content Management System) è un sistema di gestione dei contenuti. Questi sistemi sono sempre più diffusi e permettono di gestire in modo automatico i contenuti di un sito Internet. Una volta creata la struttura del sito, con gli strumenti messi a disposizione dal CMS stesso, i contenuti possono essere forniti in modo semplice attraverso una pratica interfaccia anche da utenti non molto esperti. Il sistema permette di creare utenti abilitati a fornire contenuti e a gestirli; permette anche di stabilire quando un contenuto va pubblicato (non necessariamente un contenuto deve essere pubblicato al momento della creazione) e quando, eventualmente, la sua pubblicazione deve finire. Oltre ai contenuti base è possibile integrare in un sito Joomla diverse funzionalità realizzate mediante estensioni commerciali e non. Esistono estensioni di tutti i tipi e per tutte le necessità: ce ne sono per integrare un calendario interattivo nel sito, per la gestione del commercio elettronico, per la creazione della mappa di un sito, per creare menu interattivi e così via. Insomma, Joomla è, a tutti gli effetti, un sistema che permette la gestione e la creazione di siti Internet completi e ricchi di funzionalità, alla portata di tutti gli utenti. Chi crea e amministra il sito non dovrà poi occuparsi anche di inserire i contenuti, ma potrà affidare questo compito ad altri utenti, che, attraverso una pratica interfaccia, che non richiede particolari competenze, potranno svolgere questo compito. Joomla è la soluzione per molti utenti che desiderano creare un sito efficace in maniera semplice e sfruttando le notevoli possibilità messe a disposizione dalle molteplici estensioni disponibili. È perfetto anche per chi vuole demandare ad altri utenti l immissione di contenuti e in generale per tutte quelle situazioni in cui un sito va aggiornato di frequente senza l esigenza dell intervento di un tecnico. Il nuovo Joomla 3, poi, grazie al supporto per il framework Bootstrap, permette di costruire siti con layout adattivo perfettamente fruibili da dispositivi mobili, il che oggi è vitale. 11
Joomla! 3.3 Guida all uso Booksite A corredo del testo, è disponibile un booksite, all indirizzo: http://www.sos-office.it/librojoomla3.html da cui scaricare i file degli esempi riportati nel libro. 12
1 L ambiente di lavoro Prima di cominciare a lavorare con Joomla, occorre definire l ambiente in cui questo sistema opera. Vedremo anche come creare un installazione locale di un ambiente adatto a lavorare con Joomla, che è la soluzione perfetta per fare i propri esperimenti. Trattandosi di un sistema per la creazione di siti Internet, per poter usare Joomla occorre un web server. Il web server più adatto a Joomla è Apache con un sistema operativo Linux; è comunque possibile utilizzare anche un web server IIS. Oltre al web server, a un sito Joomla serve un sistema di gestione dei dati, ossia un programma database che possa memorizzare la struttura stessa del sito e i suoi contenuti. Nello specifico, Joomla utilizza tradizionalmente il database MySQL, che deve essere ospitato sul web server, ma sono supportati anche SQL Server e PostgreSQL. Per completare l ambiente in cui vive un sito Joomla, è necessario un interprete per il linguaggio PHP. Naturalmente, i componenti necessari devono essere presenti nella giusta versione. Potete usare la Tabella 1.1 come riferimento. 13
Joomla! 3.3 Guida all uso Tabella 1.1 - Requisiti per Joomla 3. Software Versione minima Versione raccomandata PHP (Magic Quotes GPC off) 5.3.10 + 5.4 + Database supportati: MySQL (InnoDB support required) 5.1 + 5.1 + SQL Server 10.50.1600.1+ 10.50.1600.1+ PostgreSQL 8.3.18 + 8.3.18 + Web server supportati: Apache (con mod_mysql, mod_xml, e mod_zlib) 2.x + 2.x + Nginx 01.00 01.01 Microsoft IIS[5] 7 7 Riepilogando quanto detto fin qui, possiamo dire che Joomla richiede (preferibilmente) un ambiente di tipo LAMP. LAMP è un acronimo per Linux, Apache, MySQL e PHP, che indica una macchina Linux, con un web server di tipo Apache, un database MySQL e l interprete per il linguaggio PHP. Se ci si rivolge a un provider di servizi Internet, è abbastanza semplice trovare questa combinazione anche con un costo non eccessivo (esistono soluzioni a partire da circa 10 euro all anno). Insomma, quando si acquista lo spazio Internet per il proprio sito che userà Joomla, occorre verificare che esso abbia i requisiti indicati sopra. Data la sempre maggiore diffusione di Joomla, non è difficile individuare provider che offrano servizi ottimizzati per questo strumento e quindi non avrete difficoltà a trovare il vostro server di lavoro. Certo, in fase di studio può far comodo poter lavorare in locale, creare e disfare diversi siti, fare prove e prove senza preoccupazioni. Alle volte potrebbe anche essere necessario studiare non connessi a Internet, cosa impossibile se si usa lo spazio di un provider. Per questo problema esistono diverse soluzioni; qui vi proponiamo quella attualmente più diffusa e che risulta piuttosto semplice da usare: si tratta di XAMPP. Installare XAMPP. Potete scaricare gratuitamente XAMPP dal sito http://www.apachefriends.org. Scegliete la versione che fa per voi (Windows, Linux o Mac) e scaricate il pacchetto di installazione. Alla fine del download, avviate l installazione. 14
L ambiente di lavoro Capitolo 1 XAMPP vi informa che è opportuno disattivare l antivirus durante l installazione. Fatelo, poi procedete con l installazione. Se state installando XAMPP su Windows, un avviso (Figura 1.1) vi informa che, essendo attivo il controllo dell account dell utente sul sistema, alcune funzionalità di XAMPP potrebbero essere limitate. Basterà non installare XAMPP nella cartella dei programmi (ma direttamente in C) per risolvere i problemi. Fate clic su Ok per proseguire. Figura 1.1 - XAMPP avvisa che UAC potrebbe causare problemi. A questo punto, partirà la vera e propria installazione di XAMPP. La prima schermata vi chiede quali elementi installare. Nel dubbio, potete lasciare i componenti predefiniti. Per quanto riguarda Joomla, sono strettamente necessari MySQL e PHP (che, comunque non può essere disabilitato). Andate ancora avanti e scegliete la cartella di installazione di XAMPP. La proposta predefinita C:\xampp va benissimo. La schermata successiva vi informa che sul sito Bitani potete trovare materiale per installare popolari CMS fra cui Joomla, procedete senza soffermarvi troppo: una nuova schermata vi informerà che tutto è pronto per installare XAMPP. Premete il pulsante Next per avviare effettivamente l installazione. L operazione richiederà un po di tempo. Al termine dell installazione vedrete il pannello di controllo di XAMPP (Figura 1.2). In alcuni casi, e questo avverrà sicuramente se usate Skype, il pannello di controllo, come avviene nella Figura 1.2, mostrerà un errore: il problema è dovuto al fatto che, per impostazione predefinita, i protocolli HTTP e HTTPS, utilizzano le porte 80 e 443. Queste porte possono essere esse usate da altre applicazioni e fra queste applicazioni c è proprio Skype. 15
Joomla! 3.3 Guida all uso Figura 1.2 - Il pannello di controllo di XAMPP. NOTA In realtà potete anche avviare XAMPP prima di Skype. In questo modo le porte saranno usate da XAMPP e Skype non le occuperà, ma non mi sembra una soluzione molto comoda. Ci sono diverse possibili soluzioni. Se usate il programma Skype (sia su Windows 7 che Windows 8) potete cambiare le porta usata da Skype, mentre, se usate la App Skype preinstallata su Windows 8, questo non è possibile. Bisognerà, dunque, intervenire su Apache. Procediamo con ordine e analizziamo le due possibili soluzioni, cominciando dalla modifica della configurazione del programma Skype. Aprite Skype e scegliete Strumenti > Opzioni. Nella finestra Opzioni, premete il pulsante Opzioni avanzate, quindi Collegamento. Nella scheda che si presenta occorre deselezionare l opzione Usa le porte 80 e 443 come alternative per le 16
L ambiente di lavoro Capitolo 1 connessioni in ingresso (Figura 1.3). Perché questa impostazione abbia effetto, occorre uscire da Skype e rientrare. Figura 1.3 - Evitare che Skype usi le porte 80 443. Questa operazione non è possibile con la App per Windows 8. Bisogna quindi intervenire modificando le impostazioni XAMPP. Individuate il file C:\xampp\apache\conf\httpd.conf e apritelo con un editor di testi. Anche Blocco Note andrà bene. Potete aprire questo file da file system oppure dal pannello di controllo di XAMPP, facendo clic sul pulsante Config posto accanto ad Apache e scegliendo httpd.conf dal menu che si presenta (Figura 1.4). 17
Joomla! 3.3 Guida all uso Figura 1.4 - Aprire il file di configurazione di Apache. Una volta aperto il file, individuate la riga: Listen 80 e correggetela come segue: Listen 8080 Individuate, poi, la riga: ServerName localhost:70 e correggetela in: ServerName localhost:7070 Salvate il file e chiudetelo. A questo punto dobbiamo gestire la porta 443, anche se, ha influenza solo quando si usa il protocollo HTTPS, cosa che non faremo in questo libro. Per modificare la porta usata per il protocollo HTTPS dobbiamo lavorare sul file C:\xampp\apache\conf\httpd-ssl.conf. Come prima, potete aprirlo da file system o dal menù del pulsante Config (Figura 1.4). 18
L ambiente di lavoro Capitolo 1 Una volta aperto il file, individuate la riga: Listen 443 e sostituitela con: Listen 3443 o qualcosa di simile. Tenete conto che, per convenzione, le porte sotto la 1024 sono utilizzate dal sistema operativo e dai suoi servizi mentre quelle sopra sono utilizzabili dall utente, quindi una porta qualunque andrà bene. Utilizzate lo stesso numero di porta anche nelle righe: <VirtualHost _default_:443> ServerName localhost:443 Fatto questo, salvate il file e tornate al pannello di controllo di XAMPP (Figura 1.2) e fate clic sul pulsante Config in alto a destra. Nella nuova finestra (Figura 1.5) fate clic sul pulsante Service and Port Settings. Figura 1.5 - Configurare il pannello di controllo di XAMPP. 19
Joomla! 3.3 Guida all uso NOTA Nella casella Editor, la prima in alto della finestra della Figura 1.5 potete scegliere un programma diverso per aprire dal pannello di XAMPP i file di configurazione. Basta fare clic sul pulsante a forma di cartella gialla posta accanto a questa casella e quindi individuare il file eseguibile del programma che si desidera utilizzare al posto del predefinito Blocco Note. Vedrete la finestra Service Settings alla scheda Apache (Figura 1.6). Figura 1.6 - Specificare la nuova porta usata da Apache. Qui, nella casella Main Port, sostituite al predefinito 80 in nuovo valore 7070 e, nella casella SSL Port sostituite al predefinito 443 il numero della porta che avete deciso di utilizzare. Salvate le opzioni di questa finestra e della precedente a cui sarete riportati per tornare al pannello di controllo di Apache (Figura 1.2). A questo punto, potete avviare il server con il pulsante Start posto in corrispondenza della voce Apache. NOTA I messaggi di errore non scompaiono. Ma tutto funzionerà regolarmente. Al prossimo riavvio di XAMPP anche i messaggi di errore non si vedranno più. 20
L ambiente di lavoro Capitolo 1 Creare un database MySQL con phpmyadmin Vedremo come costruire un database MySQL con phpmyadmin. Noi lo mostreremo all interno del server XAMPP. La procedura dovrebbe essere simile anche sul server del provider che avete scelto di usare. Potete richiamare phpmyadmin in due modi: o direttamente da browser o dal pannello di controllo di XAMPP. Per richiamate via browser XAMPP e quindi phpmyadmin basta digitare localhost o, se avete cambiato il nome della porta in uso per http, localhost:7070 nella barra dell indirizzo oppure inserire il percorso completo http://localhost/xampp/ o http://localhost:7070/xampp/. Nella prima pagina che vi si presenta scegliete la vostra lingua, quindi, nel pannello laterale arancione, nella sezione Tools, scegliere phpmyadmin. Sarete portati a phpmyadmin. Se preferite usare il pannello di controllo di XAMPP, fate clic sul pulsante Admin in corrispondenza di MySQL (Figura 1.7). Figura 1.7 - Avviare phpmyadmin dal pannello di controllo di XAMPP. 21
Joomla! 3.3 Guida all uso Comunque abbiate scelto di arrivarci, vedrete la schermata di configurazione di phpmyadmin (Figura 1.8). Figura 1.8 - phpmyadmin. Prima di creare un nuovo database, è bene precisare che XAMPP dispone già di un utente con tutti i privilegi che potete usare per creare il nostro database (se ne potrebbe anche creare uno nuovo). Potete verificarlo facendo clic sulla scheda Utenti, dalla quale, eventualmente, potreste creare un altro utente. L utente predefinito si chiama root. Potete quindi passare a creare un nuovo database. Fate clic sulla scheda Database, quindi nella casella Crea un nuovo database, scrivete il nome che volete assegnare al nuovo database, poi premete il pulsante Crea. Non dovete fare nient altro. Potete chiudere phpmyadmin. Configurare XAMPP in modo che il sito possa inviare e-mail Il sito Joomla può comunicare con i suoi utenti attraverso delle e-mail. Per poter sperimentare anche queste funzionalità in XAMPP (di norma sono già disponibili sui server dei diversi provider), occorre configurare il server XAMPP in modo che esso sia in grado di inviare e-mail. XAMPP è già configurato per farlo. L unica cosa necessaria è correggere una riga del file php.ini, il file di configurazione di PHP. 22
L ambiente di lavoro Capitolo 1 Se avete installato XAMPP in C:, trovate php.ini in questa posizione: C:\xampp\php. Aprite questo file con un qualsiasi editor di testi e cercate la riga: ;sendmail_path = "\"C:\xampp\sendmail\sendmail.exe\" -t" Occorre eliminare il punto e virgola iniziale in modo da de-commentare questa riga, che deve presentarsi come segue: sendmail_path = "\"C:\xampp\sendmail\sendmail.exe\" -t" Una volta apportata questa correzione, salvate il file. A questo punto, per poter spedire effettivamente e-mail, occorre specificare un server SMTP valido. Potreste usare il server del vostro gestore di posta. Occorrerà anche fornire il nome utente e la password per l accesso a quel server. NOTA Se la connessione al server SMPT avviene in maniera protetta, questa operazione potrebbe non riuscire. Queste informazioni vanno fornite nel file sendmail.ini che trovate all indirizzo C:\xampp\sendmail\sendmail.ini. Qui dovete individuare le righe: ;smtp_server=localhost ;auth_username ;auth_password e correggerle come segue: smtp_server=nomeserversmpt auth_username=nomeutente auth_password=password dove nomeserversmpt è il nome del vostro server SMTP, nomeutente è il nome utente per l accesso a questo server e password è la password per questo utente. Ricordatevi di eliminare il punto e virgola iniziale di ogni riga. Fatte queste correzioni, salvate anche il file sendmail.ini. Per concludere, se il server Apache è attivo (cioè se nel pannello di controllo vedete la scritta Running), spegnetelo e riattivatelo. 23