Content Manager System - Typo 3 Sistema per la gestione dei contenuti di un sito web

Transcript

1 Content Manager System - Typo 3 Sistema per la gestione dei contenuti di un sito web Manuale di utilizzo Versione personalizzata per il sito dell ACI- Automobile Club d Italia Manuale_typo.doc Pagina 1 di 27

2 Indice dei contenuti 1. Introduzione Utenza personalizzata Strumenti Indice icone di servizio Log in Funzioni principali Gestione lista file / immagini Come si crea una nuova cartella Come caricare un file o un'immagine sul server Albero dei contenuti Struttura delle pagine Procedimenti Gestione contenuti pagine web interne Modifica/inserisci un contenuto di testo Modifica/inserisci link e allegati Title, didascalie e testi alternativi Inizia ciclo di approvazione...26 Manuale_typo.doc Pagina 2 di 27

3 1. Introduzione Questo manuale ha lo scopo di guidare l utente nell utilizzo di Typo 3, il CMS (Content Manager System) destinato alla gestione dei contenuti del sito web realizzato per ACI. Al fine di offrire una guida che supporti l operatore destinato alla manutenzione del sito sono stati descritti nel dettaglio tutti i procedimenti consentiti, illustrando passo dopo passo le operazioni salienti. 2. Utenza personalizzata Per ogni editor viene creata un utenza personalizzata, relativa alla gestione delle pagine di competenza. Attraverso le credenziali di accesso (nome utente e password) assegnate si entra nel sistema di gestione dei contenuti delle pagine. Manuale_typo.doc Pagina 3 di 27

4 3. Strumenti 3.1. Indice icone di servizio Funzioni rapide Indica la pagina. Al clik consente la scelta delle funzioni rapide di modifica associate alle pagine web. Strumento mostra. Al clik consente la visualizzazione rapida della pagina o delle modifiche apportate. Salva. Consente di salvare le modifiche apportate. Salva e visualizza. Consente di salvare le modifiche apportate e di visualizzarle direttamente. Salva e chiudi. Consente di salvare le modifiche apportate e chiudere direttamente il documento lavorato. Chiudi. Consente di chiudere il documento in lavorazione senza salvare le eventuali modifiche apportate. Elimina. Consente di eliminare l intero contenuto di riferimento. Attenzione: se eliminato un contenuto non può essere ripristinato. Modifica. Consente di modificare il contenuto relativo. Crea nuovo contenuto. Consente di creare nella pagina un nuovo contenuto. Nascondi. Consente di rendere non visibile nella pagina web il contenuto relativo. Sposta. Consente di modificare l ordine degli item (immagini caricate, record di contenuto, ecc). Sfoglia. Consente di sfogliare i file da caricare. Ricarica. Consente di ricaricare i dati dal server. (Funzione aggiorna). Manuale_typo.doc Pagina 4 di 27

5 Strumenti di testo Strumento taglia. Consente di tagliare il contenuto. Strumento copia Consente di copiare il contenuto. Strumento incolla. Consente di incollare il contenuto copiato o tagliato. Stili di testo. Consente di impostare il testo inserito secondo gli stili di sottotitolo o normale. Grassetto e corsivo. Definiscono lo stile del carattere. Rimuovi formattazione. Elimina la formattazione al testo inserito. Allineamento. Consente di allineare il testo a sinistra. Elenchi. Definiscono la disposizione del testo ad elenco: per punti o numerico. Indentatura. Attribuiscono l indentatura al testo selezionato. Link. Aggiungi link/rimuovi link. Attribuisce link al testo selezionato o li elimina (url, pagine interne, file allegati, indirizzi ). Immagine. Consente di inserire o modificare un immagine Manuale_typo.doc Pagina 5 di 27

6 3.2. Log in La schermata di log in accoglie l utente e ne consente l accesso alla gestione dei contenuti. Figura 1. Schermata di log in. Bisogna aprire il browser e aggiungere /typo3 al dominio: Si apre la finestra di log in e l utente inserisce negli appositi campi di testo i dati richiesti: - Username: nome utente assegnato - Password: chiave di accesso assegnata Cliccando sul pulsante [Log In] viene consentito l ingresso nel sistema. Manuale_typo.doc Pagina 6 di 27

7 3.3. Funzioni principali La schermata successiva al log in presenta all utente le principali azioni consentite dal sistema di gestione. Da qui l utente può scegliere il tipo di intervento che desidera effettuare anche grazie ad una breve descrizione delle funzioni. Figura 2. Schermata iniziale. Manuale_typo.doc Pagina 7 di 27

8 3.4. Gestione Lista file/immagini Le immagini e i file allegati (nei diversi formati) devono essere caricati sul server prima di venire linkati dalle varie pagine ed essere visualizzati nel sito. È possibile creare delle cartelle specifiche in cui caricare i file. Questa operazione consente di catalogare i file, ad esempio, per tipologia o estensione. Figura 3. Schermata parziale: la Lista File. Dal menu di sinistra, nella sezione File, è possibile accedere alla gestione di tutti i file già caricati nel server ed inserirne di nuovi. La voce [Lista File] si riferisce a tutti i file presenti sul server: immagini e documenti. Manuale_typo.doc Pagina 8 di 27

9 Come si crea una nuova cartella Cliccando sull icona del server si apre un menu a tendina. Scegliere [Nuovo] che consente di creare una nuova cartella. Figura 4. Schermata parziale: menu a tendina A questo punto si visualizza una nuova schermata (v. fig. 5) in cui l utente imposta il numero delle cartelle che desidera creare (menu a tendina) e assegna il nome alla nuova cartella (campo di testo). Figura 5. Schermata parziale: creare una nuova cartella. Le altre funzioni del menu a tendina (v. fig. 4) corrispondono a: - Rinomina. Consente di rinominare il file o le singole cartelle - Upload Files. Consente di caricare un nuovo file nel server, o di inserirlo direttamente in una cartella - Info. Fornisce le informazioni relative al server, alla cartella o al singolo file - Copia e Taglia. Permettono le tradizionali operazioni di taglia e copia, consentendo di spostare i file da una cartella all altra - Cancella. Elimina definitivamente un elemento. Manuale_typo.doc Pagina 9 di 27

10 Come caricare un file o un immagine sul server Una volta creata la cartella in cui raccogliere i file, cliccare sull icona della cartella e selezionare dal menu a tendina la voce [Upload Files]. Figura 6. Schermata parziale: menu a tendina - caricare un file. Figura 7. Schermata parziale: caricare un file. A questo punto si visualizza una nuova schermata (v. fig. 7) in cui l utente imposta il numero dei file che desidera caricare (menu a tendina), definisce se il nuovo file andrà a sostituirsi ad uno già esistente e ricerca il file da caricare sfogliando le varie directory sino a giungere al file da prelevare. Una volta selezionato il file da caricare, conclude l operazione attraverso il pulsante [Upload Files]. Può altrimenti annullare l operazione attraverso il pulsante [Annulla]. Attenzione: se la voce Sovrascrivi i file esistenti non viene selezionata, il sistema trovando già un file con lo stesso nome lo caricherà aggiungendo al nome _1. Manuale_typo.doc Pagina 10 di 27

11 3.5. Albero dei contenuti L albero dei contenuti rappresenta le pagine del sito. La struttura ripropone la catalogazione tipica dei sistemi operativi, ordinando gli elementi in livelli di appartenenza. Cliccando sul modulo Pagina (a sinistra della schermata) viene visualizzata (a destra della schermata) la sezione del sito sulla quale l utente loggato è autorizzato ad intervenire. Figura 8. Schermata parziale: l'albero dei contenuti. Manuale_typo.doc Pagina 11 di 27

12 Nell interfaccia del CMS questa schermata è sempre presente sulla sinistra dello schermo e consente all utente di visualizzare l intera struttura dei contenuti e di individuare i livelli di profondità di ogni singola pagina/sezione. Questo sistema consente di reperire in modo semplice ed immediato, attraverso il sistema classico di esplorazione, la pagina su cui intervenire. Il nome assegnato alle pagine (intestazione) corrisponde al naming della voce di menu/pagina visualizzata nel sito. Per esplodere ogni singola voce, e visualizzare il contenuto ad essa associato, basta cliccare sul + posizionato accanto ad ogni cartella. Ogni pagina è formata da due elementi: l icona, che ne contraddistingue il tipo, e il nome o titolo. Entrambi gli elementi sono linkabili e hanno due funzioni diverse. Manuale_typo.doc Pagina 12 di 27

13 Cliccando sul titolo della pagina nella colonna di destra si attivano le funzioni relative ai contenuti della pagina stessa (v. fig. 9). Figura 9. Schermata parziale: l'albero dei contenuti. Manuale_typo.doc Pagina 13 di 27

14 Cliccando invece sull icona gialla (v. fig. 10) si attiva il menù contestuale che consente in modo rapido di procedere con le operazioni di modifica della pagina. Figura 10. Schermata parziale: l'albero dei contenuti. Manuale_typo.doc Pagina 14 di 27

15 3.6. Struttura delle pagine I contenuti delle pagine vengono divisi in moduli: sinistra, normale, destra e bordo. Il modulo normale è destinato ad ospitare i contenuti centrali delle pagine web del sito. Figura 11. Struttura di una pagina. Manuale_typo.doc Pagina 15 di 27

16 4. Procedimenti 4.1 Gestione contenuti pagine web interne Modifica/inserisci contenuto di testo Per modificare il contenuto di una pagina ci sono due modi: 1. cliccare sul titolo della pagina della colonna di sinistra; 2. dal menù contestuale selezionare [Modifica]. L utente seleziona il contenuto che intende modificare cliccando su un qualsiasi punto dell anteprima attraverso il pulsante Modifica in Rich Text Editor. A questo punto viene visualizzata la pagina di lavoro attraverso la quale è possibile effettuare le modifiche desiderate e procedere al salvataggio delle stesse. Figura 12. Struttura della pagina di lavoro. Manuale_typo.doc Pagina 16 di 27

17 La pagina di lavoro contiene: - campo Tipo : è impostato su Normale e non deve essere modificato. - campo di inserimento del testo. In questo campo viene visualizzato il testo della pagina. In caso di un nuovo inserimento è il campo in cui viene inserito il nuovo contenuto. Nota: è necessario che il testo venga inserito all interno di questa finestra senza alcun tipo di formattazione. In caso di inserimento manuale (testo scritto direttamente all interno del campo di questo campo) non è necessaria alcuna operazione. Se invece si copia e incolla un testo già esistente è necessario selezionare il testo e spuntare l opzione rimuovi formattazione presente nella barra degli strumenti. Al campo di testo sono associati una serie di pulsanti (toolbar) che consentono di effettuare determinate operazioni e di attribuire al testo inserito delle caratteristiche specifiche: - definire lo stile grassetto o corsivo del testo; - consente di eliminare la formattazione ad un testo copiato e incollato; - strumenti taglia, copia e incolla che consentono di copiare e incollare parte del testo; - inserire elenchi nel testo; - impostare l indentatura; - assegnare o eliminare un link; - inserire o modificare un immagine. Per applicare queste funzioni bisogna evidenziare il testo su cui si vuole intervenire e attribuirgli le caratteristiche cliccando sui relativi pulsanti. Manuale_typo.doc Pagina 17 di 27

18 Una volta effettuate le modifiche, o ultimato il nuovo inserimento, si può procedere al salvataggio della pagina scegliendo tra le varie possibilità: - salvataggio semplice; - salva le modifiche e visualizza la pagina web in anteprima; - salva le modifiche e chiudi direttamente la pagina di lavoro; - chiudi la pagina senza salvare l intervento. Manuale_typo.doc Pagina 18 di 27

19 Modifica/inserisci link e allegati Link al testo In alcuni casi vengono assegnati agli elementi della pagina (testo e immagini) degli attributi ulteriori e a volte indispensabili. Una volta raggiunta la pagina di lavoro è possibile assegnare ad un testo link interni, link esterni, link a documenti allegati, link ad indirizzi (v. fig 13). Figura 13. Dettaglio delle funzioni Una volta selezionato il testo a cui si vuole associare un collegamento ipertestuale, cliccando sul pulsante [assegna/rimuovi link], si apre una finestra che consente diverse operazioni: a) Rimuovi link. Consente di eliminare un collegamento già assegnato. Basta selezionare il testo/link e dal pulsante [assegna/rimuovi link] scegliere la voce [Rimuovi link]. Il collegamento verrà automaticamente eliminato. Manuale_typo.doc Pagina 19 di 27

20 b) Pagina. Una volta selezionato il testo a cui si vuole assegnare il collegamento ad un altra pagina interna del sito (cross link) dal pulsante [assegna/rimuovi link] (v. fig 14). scegliere la voce [Pagina] Figura 14. Funzione assegna link ad una pagina interna. Viene visualizzato l intero albero dei contenuti, da cui l utente può scegliere la pagina di destinazione del link e in basso alcune indicazioni fondamentali da compilare prima di assegnare la pagina. Il campo del Title è molto importante (soprattutto in base ai requisiti di accessibilità di un sito web) e assegna ad un link un testo alternativo, che ne commenta la destinazione. Dopo aver compilato questi campi l utente può procedere all assegnazione della pagina di destinazione. Manuale_typo.doc Pagina 20 di 27

21 La pagina scelta verrà evidenziata come appare nella figura 15. Figura 15. Dettaglio funzione assegna link ad una pagina interna. Manuale_typo.doc Pagina 21 di 27

22 c) File. Consente di assegnare ad un testo un link ad un file allegato. Una volta selezionato il testo a cui far corrispondere l oggetto, dal pulsante [assegna/rimuovi link] scegliere la voce [File] (v. fig 16). Figura 16. Dettaglio funzione assegna link ad un file. Nota: da qui è possibile inserire li file prelevandoli dal server. È quindi necessario che il file sia stato precedentemente caricato. Manuale_typo.doc Pagina 22 di 27

23 d) Url esterno. Oltre che alle stesse pagine del sito un link può rivolgersi anche a pagine esterne (url esterne) di altri siti. In questo caso, dopo aver selezionato il testo a cui si vuole attribuire il collegamento, dal pulsante [assegna/rimuovi link] scegliere la voce [Url esterno] (v. fig. 17). Figura 17. Dettaglio funzione assegna link ad url esterna. Qui l utente deve compilare i campi inserendo l indirizzo della pagina web a cui il link deve puntare (url), impostando target, dimensioni finestra e title. Il salvataggio dell intervento è automatico attraverso il pulsante [Imposta link]. Manuale_typo.doc Pagina 23 di 27

24 e) . Si può decidere di collegare un testo direttamente ad un indirizzo . Dopo aver selezionato il testo a cui si vuole attribuire il collegamento, dal pulsante [assegna/rimuovi link] voce [ ] (v. fig. 18). scegliere la Figura 18. Dettaglio funzione assegna link ad . L utente deve compilare i campi di testo con i dati richiesti: indirizzo di posta elettronica a cui collegare il testo e descrizione alternativa del collegamento (title). Il salvataggio dell intervento è automatico attraverso il pulsante [Imposta link]. Manuale_typo.doc Pagina 24 di 27

25 Title, didascalie e testi alternativi Per rispettare i requisiti di base di usabilità e di accessibilità del prodotto è opportuno compilare i campi relativi ai title, alle didascalie e ai testi alternativi ogni qual volta essi si presentino. - I title riguardano soprattutto i link È il testo alternativo che viene visualizzato sul sito quando si passa con il mouse su un link senza cliccare. Esempio: - link ad un sito: link esterno: visita il sito - link ad un immagine: il logo di - link ad un file: leggi il documento - link ad una pagina: vai alla pagina - scrivi a. Didascalie e testi alternativi si riferiscono soprattutto alle immagini. - Didascalia. Compilando questo campo si visualizza nella pagina la didascalia relativa all immagine. - Alt/title options. In questo campo va inserito un testo alternativo che viene visualizzato nel caso in cui il browser non riesca a mostrare l immagine - Alt and title tag options. Qui va inserito un testo che commenti l immagine e che, in caso di una navigazione alternativa (attraverso strumenti di lettura vocale delle pagine web screen reader) renda possibile informare l utente sul contenuto dell immagine. Questo è uno strumento utilissimo per gli utenti disabili e indispensabile ai fini di mantenere il requisito di accessibilità del prodotto. Manuale_typo.doc Pagina 25 di 27

26 5. Inizia ciclo di approvazione Una volta effettuati cambiamenti, modifiche o nuovi inserimenti l operatore deve iniziare il ciclo di approvazione dei contenuti, inviandone notifica al caporedattore. Per fare questo, dopo aver effettuato tutti i salvataggi, può selezionare la voce [Versioni] presente sul lato sinistro della schermata. A questo punto nel corpo della pagina comparirà una schermata che elenca tutti gli ultimi interventi effettuati. Figura 19. Dettaglio della schermata da cui scegliere l intervento da far approvare L operatore può: a) inviare una notifica unica per tutti gli interventi effettuati cliccando sul pulsante [Send all to review] b) Inviare un commento/notifica singolarmente per ogni intervento, cliccando sulle freccette che compaiono sotto la voce [Controls]. Utilizzando questa funzione è importante che l operatore indichi nel commento l id delle pagine che ha modificato/creato, in modo da dare una indicazione precisa al coordinatore in fase di Review. Dopo aver fatto questa operazione l approvatore riceverà una con l indicazione degli interventi effettuati. Manuale_typo.doc Pagina 26 di 27