Content Management Systems e

Transcript

1 AA 2010/2011 Content Management Systems e Corso di Progetto di Sistemi Web Based Università degli Studi di Roma Tor Vergata

2 Argomenti della lezione 1. Breve evoluzione storica dei siti internet cos è un sito statico cos è un sito dinamico il CMS 2. Cos'è un (Web) Content Management System caratteristiche generali CMS blog e site oriented: Wordpress e Joomla 3. Joomla funzionalità di base componenti moduli e plugin template Demo

3 Siti web statici I siti definiti statici costituiscono la prima generazione di siti web, tali per cui il contenuto delle pagine non può essere modificato in termini di struttura e informazioni visualizzate agli utenti a meno di modifica del codice. Come sono fatti? In generale sono realizzati come collezioni di pagine statiche collegate tra di loro da link incrociati realizzate dai webmaster sulla base di un progetto iniziale e successivamente modificate utilizzando direttamente il linguaggio HTML oppure tramite programmi appositi di tipo WYSIWYG. Non accedono ad alcuna base di dati esterna per ottenere i contenuti

4 WYSIWYG editor frontpage, wysiwyg

5 Siti web statici - Vantaggi e svantaggi Vantaggi controllo totale su oggetti grafici: l aspetto di ogni singola pagina può essere progettato indipendentem modello adatto per siti aggiornati raramente hosting a basso prezzo: non hanno bisogno di caratteristiche aggiuntive (supporto PHP, MYSQL...) in generale: costi più bassi se realizzati da professionisti Svantaggi modifiche ad hoc, costose scarsa interazione con gli utenti, non è possibile realizzare forum, chat, guestbook, mailing list... vincolo struttura semplice Esempio: realizzazione di una vetrina Realizzare un sito web statico per l acquisto di prodotti online, significava produrre singolarmente ogni pagina relativa ad ogni singolo prodotto e doverla modificare individualmente e manualmente ogni volta che c era una variazione al listino.

6 Siti web dinamici Le pagine di un sito web dinamico hanno la caratteristica di essere generate in tutto o in parte in modo dinamico, nel momento in cui vengono visitate. Caratteristiche principali Le pagine, sviluppate con linguaggi appositi di scripting, sono quindi "create al volo" fondendo una parte fissa (di solito il layout grafico, i menu, i link principali) con quella prelevata da una base di dati a seconda della sezione nella quale ci si trova e/o eventualmente di alcune informazioni specifiche relative all'utente che le sta visitando (browser, paese di provenienza..)

7 Siti web dinamici (II) Vantaggi rispetto al primo schema sono: manutenzione più semplice minor numero di pagine effettive: poche pagine possono essere opportunamente riempite con vari contenuti diversi possibilità di modificare i contenuti senza modificare materialmente le pagine Tipici sistemi dinamici sono i portali, i siti vetrina di aziende con molti prodotti/servizi, i motori di ricerca. Analogia del sito vetrina Nel caso del listino dei prodotti una scheda con struttura fissa può essere riempita volta per volta con i dati di ogni prodotto, dando la sensazione di migliaia di pagine disponibili.

8 IL CMS Ad un sito dinamico, cosa aggiunge il CMS? Un Content Management System, letteralmente "sistema di gestione dei contenuti", è uno strumento software installato su un server web studiato per facilitare la gestione di contenuti e di siti web, svincolando in tutto o in parte l'amministratore da conoscenze tecniche di programmazione Web e di gestione di database. Utilizzando un CMS, anche una figura non esperta nel campo dello sviluppo web può amministrare con facilità un portale web arbitrariamente complesso. Alcuni concetti chiave 1. separazione tra presentazione e contenuti 2. trasparenza d uso da parte dell utente 3. gestione centralizzata

9 1. Content Management Web CMS: caratteristiche generali Creazione, manipolazione e suddivisione dei contenuti in categorie e sezioni. Editor di tipo WYSIWYG integrati permettono di inserire articoli, voci, contatti, ecc. in modo semplice

10 Web CMS: caratteristiche generali 2. Registrazione e Gestione di Utenti e Gruppi Funzionalità di autoregistrazione di utenti al sito (login form con inserimento credenziali) Permette di definire gruppi di utenti con relativi ruoli e regole di accesso e interazione con i contenuti del sito. 3. Versioning delle pagine Permette di mantenere una cronologia delle precedenti versioni di un contenuto in modo da poter scegliere in ogni momento di di ripristinarne una copia precedente.

11 Web CMS: caratteristiche generali (III) 4. Restyling istantaneo: template La veste grafica del sito è realizzata tramite template (HTML/CSS/XML) applicabili automaticamente all intero sito in modo separato dai contenuti separazione presentazione/contenuti-dati

12 Web CMS: caratteristiche generali (IV) 5. Collaboratività e supporto alla gestione del workflow Il CMS può essere usato come piattaforma collaborativa per permettere a più utenti di creare e modificare o commentare contemporaneamente i contenuti. I cambiamenti applicati possono essere tracciati e autorizzati per la pubblicazione da parte di un amministratore oppure ignorati, ripristinando una versione precedente. workflow insieme di cicli di compiti da eseguire in modo parallelo o sequenziale per la produzione dei contenuti. Esempio i redattori di articoli possono inserire una bozza, tuttavia questa non verrà pubblicata come articolo finale finchè questa non sia stata revisionata e approvata dall editor.

13 Web CMS - Estensioni 6. Estensioni E possibile tramite le estensioni aumentare le funzionalità del CMS rispetto a quelle core. Alcuni esempi forum, chat, guestbook calendari gestione newsletter banner gallerie di immagini e multimedia altro.. In generale, la creazione e la distribuzione delle estensioni per i vari CMS può essere controllata dagli stessi produttori del CMS, oppure, queste possono essere liberalizzate come nel caso della maggior parte dei CMS open source, per i quali esistono siti di terze parti contenenti collezioni di estensioni scaricabili gratuitamente o a pagamento a seconda della specifica licenza software.

14 Web CMS: caratteristiche generali (V) 7. Sistemi di pubblicazione alternativa Generazione feed RSS, versioni accessibili, eventualmente invio per agli utenti registrati 8. Supporto multilingua Supporto alla realizzazioni di versioni localizzate dei contenuti, visualizzate agli utenti sulla base dello stato di provenienza

15 Web CMS: frontend e backend Un CMS è costituito da due parti fondamentali: la sezione di amministrazione (back end), che serve ad organizzare e supervisionare la produzione dei contenuti, e l interfaccia disponibile alla fruizione (front end), che l utente web usa per navigare fra i contenuti e le funzionalità del sito. front end back end La separazione tra queste due aree può essere più o meno marcata a seconda di una differenza di implementazione logica (modifiche al sito vengono svolte da un amministratore registrato interagendo sulla stessa interfaccia visualizzabile dagli utenti web) o fisica (accesso ad un vero e proprio pannello amministrativo, separato)

16 CMS Hall of Fame

17 Google Trends: i principali CMS a confronto (World)

18 Google Trends: i principali CMS a confronto (Italia)

19 Joomla! Joomla! nacque nell'agosto del 2005, come fork di Mambo, un CMS open source preesistente; Distribuito gratuitamente, su licenza open source (GNU GPL), è sviluppato in linguaggio PHP. E' installabile su qualsiasi sistema operativo e web server avente supporto PHP. Al momento è supportato solo il sistema di gestione database MySQL.

20 Alcuni esempi di siti che usano Joomla

21 United Nations (Governmental organization)

22

23

24

25 Joomla! - accedere al backend Per accedere al pannello di amministrazione è necessario recarsi all url ed inserire le credenziali di accesso (username e password, specificate in fase di installazione o fornite dall hosting provider in caso di acquisto di pacchetto inclusivo di CMS) gestione centralizzata

26 Joomla! - pannello administrator

27 Configurazione globale: sito Anzitutto è importante verificare e personalizzare la configurazione globale del CMS, suddivisa in tre schede, cliccando sul pulsante Configurazione. Nella prima scheda (Sito) è possibile modificare il titolo del sito web, l'impostazione dei metadata cioè una descrizione ed una lista di parole chiave, analizzate dai motori di ricerca, e l'attivazione facoltativa delle funzionalità SEO relative agli indirizzi.

28 Configurazione globale: sistema Dalla scheda Sistema è possibile accedere alla configurazione della registrazione di utenti, che è possibile abilitare o disabilitare, ed eventualmente sottoporre ad attivazione tramite mail, per verificarne l'indirizzo.

29 Configurazione globale: server Le opzioni della scheda Server generalmente non hanno necessità di essere modificate; tra esse potrebbe risultare necessario correggere la configurazione , in base alle indicazioni del proprio provider, affinché i messaggi generati da Joomla vengano spediti correttamente.

30 Funzionalità base: contenuti e menù In Joomla! le pagine di contenuto sono chiamate articoli, e sono raggruppate in sezioni e categorie. Ogni sezione può contenere più categorie, ed ogni categoria più articoli. Ogni articolo pubblicato nel sito, viene assegnato ad una ed una sola categoria. Per definire le sezioni e le categorie si accede, dal pannello di amministrazione, alle voci Gestione sezioni e Gestione categorie del menu Contenuti. Per inserire un articolo è possibile utilizzare invece la voce Gestione articoli.

31 Esempio di suddivisione in Sezioni e Categorie Sezioni Categorie Materiale didattico Informazioni sul corso Notizie e avvisi Lezioni Esercitazioni Manuali Info generali FAQ Corso Esami

32 Funzionalità base: contenuti e menù Nella barra degli strumenti di queste ed altre pagine di gestione rivestono particolare importanza i comandi Pubblica e Sospendi, che permettono di controllare lo stato di visibilità al pubblico dell'elemento sul sito web, Cancella (Cestina nella gestione articoli), Modifica e Nuovo, per rispettivamente eliminare, aggiornare un elemento, ed aggiungere uno nuovo. E' sempre presente anche il pulsante Aiuto, che apre in una nuova finestra una mini-guida, riguardo la pagina corrente.

33 Inserire un nuovo articolo In figura è mostrato un esempio di inserimento di nuovo articolo; in questo caso la sezione scelta è Informazioni sul corso, e la categoria al suo interno è Generali.

34 Editor dei contenuti Ogni articolo è composto principalmente da un titolo e da un testo formattato, modificabile tramite un editor WYSIWYG integrato. La linea tratteggiata visibile all'interno del immagine indica la funzionalità Leggi tutto: la porzione di testo antecedente ad essa verrà utilizzata come testo introduttivo, cioè generalmente visibile anche nella pagina principale della sezione o categoria; tutto ciò che segue la linea di divisione verrà visualizzato solo accedendo alla pagina specifica dell'articolo. Quando un articolo viene inserito e pubblicato, esso risulta subito visibile nella sezione di riferimento, generalmente in prima posizione, a seconda delle impostazioni scelte.

35 I menù Nella costruzione di un sito con Joomla! il secondo passaggio fondamentale, dopo la definizione della struttura dei contenuti, è la creazione dei menu di collegamento. E' possibile creare più menu, ed ognuno può contenere più voci diverse, ma di base è obbligatoria la presenza di un menu principale, e al suo interno una voce impostata come pagina principale del sito

36 Nuova voce di menù Le voci di menu possono collegare a svariate funzionalità in particolare riguardo la visualizzazione dei contenuti, tra le quali: Aspetto articolo, che mostra il testo completo di un singolo articolo; Aspetto sezione blog e Aspetto categoria blog, che mostrano il titolo e il testo introduttivo di un numero desiderato di articoli, in base alla data di inserimento o ad altre opzioni, prelevandoli rispettivamente da un'intera sezione selezionata o da una determinata categoria; Aspetto sezione, che elenca le categorie collegate alla sezione specificata, e cliccando su ogni categoria mostra gli articoli contenuti, sotto forma tabellare (solo titolo); Aspetto categoria, che elenca gli articoli di una determinata categoria, sotto forma tabellare (solo titolo); cliccando su ogni articolo è possibile accedere al testo completo; Aspetto blog prima pagina, che mostra il titolo e il testo introduttivo di un numero desiderato di articoli, contrassegnati dall'opzione Prima pagina.

37 Gestione utenti

38 Joomla! - Estensioni La struttura di Joomla! poggia su un insieme di librerie di oggetti riutilizzabili, denominato core framework, che contengono le funzionalità di base per il controllo del CMS. Tutte le altre funzionalità di Joomla! vengono fornite tramite estensioni, di cui alcune già incluse nel pacchetto base, ed altre installabili successivamente; esse si dividono in cinque tipologie: Componenti, Moduli, Plugin, Template e Lingue, e sono tutti installabili dal menu Estensioni del pannello di amministrazione, alla voce Installa/Disinstalla.

39 Tipi di estensioni Componenti, che generalmente creano vere e proprie sezioni e tipologie di contenuto. Tra i componenti di base vi sono la gestione e visualizzazione di articoli, la gestione utenti e moduli di contatto; esempi di componenti aggiuntivi sono gallery, gestione download, forum. Moduli, cioè blocchi posizionabili nella pagina, per la visualizzazione di informazioni o l'accesso a funzionalità. Sono esempi di moduli un riquadro per l'accesso degli utenti, i menu, un elenco con gli ultimi articoli. Plugin, funzioni che operano a vari livelli, innestandosi all'interno dei componenti. I plugin possono operare filtraggi, elaborazioni, aggiunta di funzionalità nei contenuti, o mettere a disposizione editor di testo avanzati. Template, che definiscono i modelli di presentazione grafica delle pagine, sono costituiti principalmente da file PHP (in formato HTML) e CSS, oltre ad immagini e altri materiali. Lingue, che aggiungono il supporto per lingue specifiche.

40 Alcuni componenti integrati in Joomla 1.5 La parte di gestione e visualizzazione dei contenuti è proprio un primo esempio di componente, cioè un insieme di pagine di controllo nel pannello di amministrazione. Tra i componenti base Contatti permette di creare pagine con le informazioni per il contatto, come indirizzo e numeri telefonici, e mettere a disposizione un modulo per l'invio diretto di un messaggio di posta elettronica; Web Link consente la pubblicazione di link a siti web, suddivisi per categorie, ed il tracciamento del numero di visite; sono inclusi anche un componente per la gestione di sondaggi (Sondaggi), ed uno per offrire ai visitatori funzionalità di ricerca nel sito (Cerca). Componente per la gestione dei sondaggi (com_polls) Modulo per la per la visualizzazione di un sondaggio (mod_poll)

41 Moduli e posizionamento nel template I moduli, al contrario dei componenti, non sviluppano intere sezioni funzionali; sono invece dei blocchi con particolare contenuto, posizionabili a scelta all'interno della pagina. Nel pacchetto base sono disponibili moduli per la visualizzazione dei menu, per la registrazione e l'accesso degli utenti, per mostrare in modo compatto gli ultimi articoli pubblicati o quelli di una particolare categoria, oppure i sondaggi, un modulo per la ricerca rapida nel sito, e altri ancora. Dalla voce Gestione moduli del menu Estensioni è possibile attivare o disattivare i moduli, spostarli e configurarli. In alcuni casi i moduli si appoggiano a determinati componenti per ottenere le informazioni e fornire le funzionalità, come nel caso del modulo Sondaggi.

42 Moduli e posizionamento nel template (II) Le posizioni di pubblicazione disponibili dipendono dal template grafico in uso, ed ognuna ha un nome ben preciso, come left (colonna di sinistra), right (colonna di destra), top (spazio in alto) e così via. Per ogni modulo è anche possibile specificare in quali pagine debba essere visualizzato, con un metodo di selezione basato sulle voci di menu. Per visualizzare l insieme di posizioni utilizzabili per un certo template è possibile appendere all url corrente la stringa?tp=1

43 Cenni sui template I Template in Joomla! sono i modelli grafici che regolano la presentazione di qualunque sezione del sito. Il punto centrale dei template è il file index.php, una combinazione di codice HTML e PHP che definisce la struttura della pagina, mentre la formattazione vera e propria è gestita da file CSS. I template sono installabili allo stesso modo delle altre estensioni, quindi dalla voce Installa/ Disinstalla del menu estensioni, mentre l'attivazione e la configurazione è possibile dalla voce Gestione template dello stesso menu. In figura è possibile vedere la pagina di gestione, con elencati i template contenuti nel pacchetto base. L'elemento attivo come predefinito per il sito è contrassegnato da una stella nella seconda colonna.

44 Dove reperire nuove estensioni Ulteriori componenti ed altre estensioni si possono trovare sul sito ufficiale Joomla Extensions Directory, reperibile all indirizzo extensions.joomla.org. Molte di queste estensioni sono scaricabili gratuitamente, altre sono invece disponibili a pagamento, su licenza commerciale.

45 Un componente molto utilizzato, distribuito gratuitamente con licenza opensource, è VirtueMart, che permette di integrare nel CMS una piattaforma completa di e-commerce, comprendendo quindi catalogo prodotti, carrello acquisti, registrazione avanzata degli utenti, gestione degli ordini, di pagamenti, spedizioni e altro ancora. L'integrazione con Joomla! comporta il vantaggio di poter fornire, in un unico sito, altri servizi e contenuti oltre alle funzionalità di catalogo e acquisto; inoltre i dati degli utenti registrati potranno essere condivisi anche da eventuali altri componenti, ad esempio per l'invio di newsletter, o per l'accesso a documentazione riservata. Il catalogo prodotti, gli ordini, gli utenti e tutta la configurazione sono accessibili sempre del pannello di amministrazione di Joomla, alla voce VirtueMart del menu Componenti

46 Altre estensioni: JCE ed Exposé4

47 Mi hai convinto, da dove inizio?

48 Free Joomla Hosting

49 Grazie!