Web Content Management System. Corso avanzato

Transcript

1 Web Content Management System Corso avanzato

2 Lezione 1 Evoluzione del web, Open Source e formati proprietari Sistema Client/Server, Sistema L.A.M.P. Registrazione su Client FTP, installazione CMS Joomla! Lezione 2 Il CMS Joomla!, Pannello di controllo Gestione dei contenuti Lezione 3 Template, Moduli, Componenti, Mambot Lezione 4 Template, Usabilità, Accessibilità Lezione 5 Gestione Lingue Applicativo Joom!fish per la creazione di un sito multilingua Lezione 6 Personalizzazione Cenni di: HTML PHP CSS

3 Programmazione del CORE Programmazione degli applicativi Conoscenza di HTML, PHP e grafica per adattare il sito alle proprie esigenze Installazione e assemblaggio di applicativi e grafica Semplice installazione degli applicativi

4 Template Componenti Moduli Plugin o Mambot

5 primo concetto da assimilare è che TUTTI gli elementi base

6 disinstallare un applicazione si deve scegliere prima la famiglia alla le appartiene (se componente, modulo, etc..), selezionare quindi

7 Template: è lastruttura di un sito web. Ossia come è strutturato lo scheletro del sito per essere completato/arricchito tramite le applicazioni di Joomla! Layout: è l aspetto di un sito web. Può essere soggettivamente bello, ben disegnato, elegante, oppure troppo pesante, troppo animato, etc. Template + Layout: danno corpo al front-end. Può essere oggettivamente conforme o meno a determinati standard circa l usabilità e l accessibilità (norme W3C).

8 estione template è il pannello che i consente di accedere all elenco ei Template caricati nel sito.

9 elezioniamo il late sul quale eseguire erta operazione Qui troviamo l indicazione del Template predefinito ossia di quello che sta dando forma al nostro sito Cliccando qui si attribuisce il valore di Predefinito al Template che abbiamo selezionato Cliccando qui si entra

10 tto alla voce Parametri troviamo a serie di impostazioni base del plate che possiamo modificare r meglio adattarlo alle nostre esigenze. Selezionando la voce Anteprima possiamo vedere sia le modifiche apportate ai parametri base sia la posizione blocchi modulo

11

12

13 Template gratuiti e di buona fattura sono reperibili nel sito cliccando sulla voce Template. Ciò non significa che non ne possiate trovare di diversi e migliori in altri siti presenti nel web.

14 Nel caso in cui io abbia trovato nel calderone dei Template alcuni particolarmente ben realizzati ed idonei alle mie esigenze, Joomla! prevede un opzione avanzata che consente di assegnare diversi template a diverse voci di menu. Clicchiamo su un template (che non sia ovviamente il

15 Noteremo che il parametro Assegnazione al menu si è completato con le opzioni Voci di menu e Seleziona voci di menu. Queste opzioni ci consentono di scegliere una o più pagine di Joomla! alle quali assegnare (per quindi visualizzare) un template differente da quello predefinito.

16 omponenti: sono applicazioni sofisticate che onsentono di avere sul proprio sito una ricca gamma di soluzioni ia lato front-end che lato back-end. el front-end la loro disposizione è fissa, nel corpo centrale ella pagina (quello dei contenuti), e sono sempre richiamati da una oce di menu. anno un proprio pannello di amministrazione e di onfigurazione e a volte utilizzano dei plugin per funzioni ggiuntive

17 a di fare degli esempi vediamo come si presenta una comune applicazione in w.joomla.org e il significato di alcuni simboli. L applicazione è molto popolare tra gli utilizzatori L applicazione è tra le migliori della sua categoria (secondo gli esperti) Media dei voti ricevuti dagli utilizzatori La versione di Joomla! per cui è sviluppata principalmente Finalità commerciale o meno dell applicazione Link per il download, diretto o previa registrazione, gratuito o a pagamento L applicazione prevede un componente

18 a finalità di questa lezione è di spiegare in maniera dettagliata la reazione di articoli in Joomla! tramite l utilizzo di estensioni pecifiche che possono essere componenti, moduli e plugin. n applicativo estremamente valido e fondamentale è il JComments he consente di scrivere commenti per ogni articolo con modalità ifferenti a seconda delle categorie di utenti interessate.

19 Jcomments è un applicativo che una volta installato presenta un componente che da back end si occupa della gestione dei commenti e della impostazione dei parametri e da front end agisce tramite un plugin (che si installa automaticamente).

20 Jcomments è un applicativo che una volta installato presenta un componente che da back end si occupa della gestione dei commenti

21 Plugin o Mambot: i mambot sono porzioni di codice che possono potenziare le funzionalità di base del CMS mediante l inserimento nel contenuto di istruzioni speciali all interno di parentesi graffe, es. {comando}.{/comando}, o semplicemente a seguito dell installazione. Possono avere un pannello di controllo che permette di configurare il loro operato.

22 Prima di vedere qualche esempio di plugin scaricato da analizziamo quelli nativi in Joomla! Il primo è l editor (TinyMCE) che tramite il suo pannello di controllo può essere impostato in modalità normale, avanzata, estesa (quella in foto). Per quanto riguarda la creazione di contenuti è

23 La funzione Pagebreak consente di dividere un articolo in più pagine dal punto in cui si decide di inserirlo. Per motivi di ottimizzazione dello spazio la sua funzionalità è disattivata nella visualizzazione dei contenuti in formato blog.

24 La funzione Leggi tutto consente di dividere un articolo in due parti dal punto in cui si decide di inserirlo.

25 Un Plugin molto utile e al tempo stesso semplice da utilizzare è il mavik Thumbnails che consente di ridimensionare le immagini che carichiamo all interno dei nostri articoli e cliccando su di esse di vederle nella dimensione originale all interno di un pop up stilisticamente gradevole. Il download è immediato.

26 Ovviamente anche i Plugin seguono la procedura di installazione prevista per tutte le altre applicazioni. Vediamo in figura evidenziato in giallo il plugin appena installato. Una volta attivato e se necessario impostando qualche parametro tra quelli previsti, l applicativo funziona senza dover inserire ulteriori codici ma intervenendo direttamente

27 Se clicchiamo su una foto all interno del nostro articolo noteremo la comparsa di un contorno che la delimita con dei puntatori per lato che servono per ridimensionarla manualmente. Effettuando questa operazione con il plugin installato avremo 2 risultati: Un ridimensionamento migliore (meno sgranato ) (In front page) la

28 Altro Plugin di probabile interesse per la creazione professionale di un articolo è il mosiframe che consente di inserire pagine di altri siti all interno del nostro contenuto tramite un iframe. Il download si esegue dal sito del produttore.

29 Questo plugin a differenza del precedente implica invece l inserimento di un comando all interno dell articolo. Questo comando è come definito in precedenza contenuto all interno di parentesi graffe. Vogliamo ad esempio inglobare nell articolo un forum esterno dove si parla di moto. Il comando

30 Se tutto è stato eseguito correttamente il risultato dovrebbe essere simile a quello in figura. L iframe viene inserito in corrispondenza del punto esatto nel quale abbiamo inserito il codice all interno dell articolo.

31 Per completare l articolo in questione desidero inserire un video per meglio sottolineare le caratteristiche della moto nella descrizione. Un Plugin come il precedente semplice e gratuito è AllVideos. Il download si esegue dal sito del produttore.

32 Anche questo plugin come il precedente prevede l inserimento di un comando all interno del contenuto. Questo comando varia a seconda della provenienza del nostro video. Nel caso in questione, essendo il video residente su youtube il comando è il seguente:

33 Se tutto è stato eseguito correttamente il risultato dovrebbe essere simile a quello in figura. Il video viene inserito in corrispondenza del punto esatto nel quale abbiamo inserito il codice all interno dell articolo.

34 oduli: sono pacchetti software scritti in PHP che consentono di vere sul proprio sito una ricca gamma di applicazioni. a loro caratteristica è l indipendenza dal resto del sito ma a volte nno da complemento ad un componente in quanto ne ampliano la nzione. alorodisposizione dipende da quanto previsto da colui che ha critto/disegnato il template che definisce le posizioni blocchi odulo all interno dello stesso.

35 Notare la non casuale ma anzi tipica disposizione dei moduli in Joomla! intorno al corpo centrale del sito.

36 Posizione blocco modulo e tipologia di pagine nelle quali essere pubblicato si Basta un click per attivare o meno un modulo Basta un click per cambiare l ordinamento di un modulo all interno di una posizione blocco modulo Basta un click per cambiare Il livello di accesso (Public, Registered, Special) consentito per il modulo

37 Cliccando su Copia si esegue una copia di un modulo. Ciò può essere utile quando si utilizzano moduli che, ad esempio, presentano un sommario delle notizie presenti nel sito e quindi se ne possono creare diversi per ogni tipo di sezione/categoria. Cliccando su Nuovo si può creare un nuovo modulo. Sostanzialmente è una procedura molto simile al Copia tranne che per la voce HTML personalizzato dove ci viene consentito di inserire un contenuto in una posizione blocchi modulo.

38 nterno della famiglia dei moduli bisogna prestare attenzione ai Menu in quanto lora ne volessimo creare uno nuovo il percorso è differente rispetto a quanto ena visto per gli altri moduli. Ossia cliccando o su Copia o su Nuovo rremmo semplicemente un menu doppione di un altro già esistente e quindi le stesse voci. se il nostro intento è di creare un nuovo Menu per potervi collegare voci che sono presenti negli altri allora il nuovo Menu va creato nella Gestione menu.

39 Cliccando su Nuovo si accede al pannello per la creazione di un nuovo Menu. Per creare un nuovo Menu bisogna completare 4 voci tra le quali Titolo Modulo in quanto Joomla! crea in automatico il modulo

40 Cliccando su un modulo si accede al pannello di controllo nnello di configurazione è uguale per tutti i moduli, ossia si compone di rti delle quali Dettagli e Assegnazione menu sono standard per tutti

41 La migliore raccolta di moduli si trova all interno del sito Basta cliccare su Extensions e poi su All Categories per accedere alla totalità delle applicazioni (3582 al momento della creazione di questa slide).

42 anto abbiamo visto fino ad ora sono tutta una serie di applicazioni per integrare stri articoli con funzionalità che si vanno ad aggiungere alla gestione dei tenuti nativa in Joomla! uardo questo aspetto esistono soluzioni integrate che tramite un unica tallazione provvedono a fornire una piattaforma gestionale completa mposta da componente, moduli e plugin) per la creazione dei contenuti (e non o) in Joomla! 2 è una di queste.

43

44 o gli articoli ategorie (che vanno create prima degli articoli) sente di creare Tags da associare ai contenuti sente di inserire Commenti come con il Jcomments A differenza del gestionale nativo in Joomla! K2 consente di creare infiniti gruppi per infiniti utenti in base a determinati permessi sui contenuti

45 Tramite questa operazione tutti gli articoli in Joomla! vengono importati nel gestionale del K2 A differenza di Joomla!, in K2 gli articoli seguono le preferenze impostate all interno delle categorie mentre la voce Preferenze si occupa degli altri aspetti dell articolo (commenti, video, immagini, Tags, etc.) Addirittura è presente un editor grafico per elaborare le immagini Gli articoli possono essere segnalati come featured

46 iamo un articolo simile a quello precedentemente creato senza l utilizzo del K2 L area di editing è simile a quella classica di Joomla! ma attenzione al top menu in alto che contiene i fields (Immagine Image gallery Video Extra Fields Attachments) che determineranno il layout del nostro articolo e ai quali corrispondono opzioni aggiuntive nella colonna di sinistra.

47 iamo un articolo simile a quello precedentemente creato senza l utilizzo del K2 Consente di inserire un immagine esterna al contenuto Consente di inserire una galleria di immagini Consente di inserire un video esterno al contenuto Consente di inserire Informazioni addizionali (menu a tendina, caselle di spunta, aree di editing etc.) al contenuto

48 ro di testo: CHIMENTI, Costruire siti dinamici con Joomla! 1.5, epli, 2007 des e dispense: ntatti: f.passarini@tin.it