Manuale d'uso del CMS (Content Management System) 1 Web
Il CMS (Content Management System) 1 Web permette la gestione (creazione - modifica - eliminazione) di pagine web statiche e dinamiche in un numero illimitato di lingue straniere.
L'utilizzo del CMS 1 Web è molto semplice.
La creazione di un nuovo profilo lingua, di una nuova categoria, di una gerarchia fra le categorie o di una nuova pagina può avvenire secondo l'ordine preferito dal cliente.
Per esempio, il cliente può preferire di creare all'inizio le lingue, e successivamente organizzare le proprie categorie, infine creare le pagine; viceversa può immaginare di creare il proprio sito in una lingua, partendo da semplici pagine, ed in un secondo momento dare una struttura più complessa al proprio sito, ed in un terzo momento decidere di clonare il sito in nuove lingue.
Tutto questo è possibile tramite il CMS 1 Web.
La parte di creazione pagine prevede infatti la costituzione di una struttura master che viene clonata secondo le necessità. In fase di clonazione verrà proposta una replica della struttura all'interno della quale l'operatore, cui non è richiesta alcuna competenza informatica particolare (utilizzo di Microsoft Word o di altro editor analogo), potrà sostituire i testi scritti nella lingua scelta per la struttura master nella lingua nuova da clonare.
Tutte queste operazioni sono possibili all'interno dell'area riservata.
Questi i punti trattati in questo manuale:
1. inserimento di una nuova lingua;
2. aggiunta struttura
3. creazione pagine master
4. clonazione
5. modifica - cancellazione struttura
6. pagine orfane
7. gestione menu
8. aggiungi link
9. editor
10. Struttura cornice della pagina - imposta gli elementi della pagina
Per inserire una nuova lingua:
1. da login scegliere GESTIONE PAGINE, LINGUE E MENU, e qui la voce inserisci nuova lingua
2. all'interno della pagina gestione lingue scegliere la voce "aggiungi nuova lingua"
3. inserire il nome della lingua come vogliamo appaia a menu (si consiglia di scriverlo nella lingua madre, cioè English, Deutsch, Francais, Espanol, ecc…, per permettere al navigatore di riconoscerla immediatamente), ed il suo codice a due cifre (p.e. it per Italiano, en per inglese, ecc…)
4. la nuova lingua inserita apparirà nel menu a tendina laterale e nella pagina di struttura;
5. per modificarla o cancellarla selezionare dalla pagina delle lingue rispettivamente il tasto modifica o quello cancella a fianco della lingua oggetto dell'operazione.
Per inserire o modificare una pagina o una categoria:
1. da login scegliere GESTIONE PAGINE, LINGUE E MENU, e qui la voce pagine CMS (crea, clona, modifica, elimina);
2. in questa pagina si potrà inserire o una nuova pagina o una nuova categoria, oppure, se esistono già, clonarle nelle lingue.
Di fianco alla scritta struttura appariranno due collegamenti:
· aggiungi struttura
· aggiungi pagina master.
aggiungi struttura
Aggiungi struttura permette di inserire una nuova categoria. Scegliendo questa opzione ci troveremo in una pagina che ci chiede di dare un nome alla categoria, un codice di ordinamento, e di scegliere una categoria padre.
Il nome della categoria serve ad identificarla all'interno della struttura; in fase di clonazione nelle varie lingue sarà possibile modificarlo a piacere. Il codice di ordinamento serve per dare una priorità nell'ordine di visualizzazione alla categoria rispetto alle proprie categorie "sorelle" (ovvero quelle che hanno medesimo padre); la categoria padre serve per raggruppare in maniera organica le proprie pagine.
Per esempio, dovendo realizzare un sito di un'azienda, potrei decidere di realizzare le seguenti categorie di primo livello: "azienda", "prodotti", "contatti". Poi, sotto "azienda", potrei inserire le categorie "storia" e "qualità": in qualità potrei mettere le pagine "politica della qualità" e "certificazioni".
Le categorie "storia" e "qualità" sono "sorelle", in quanto hanno lo stesso padre "azienda"; tramite il codice di ordinamento potrò decidere di far apparire prima "storia" oppure "qualità".
Analogamente, a livello superiore, se sposterò i codici di ordinamento delle categorie "azienda", "prodotti", "contatti", tutte le categorie figlio saranno trascinate: questo sia nella struttura sia nelle categorie e pagine clonate nelle lingue.
NOTA: sebbene sia possibile inserire sottocategorie per infiniti livelli, si consiglia di limitarne l'uso a due, massimo tre livelli: questo per migliorare al massimo la navigazione.
Creazione pagine master
· Categoria: propone una lista da cui scegliere in quale categoria inserire la pagina master che si sta creando;
· Se la categoria non è presente: permette di creare la nuova categoria direttamente in fase di creazione della pagina, qualora non esista la categoria necessaria fra quelle previste al punto precedente;
· Categoria padre per la nuova categoria: nel caso in cui si crei una nuova categoria in questa fase, è possibile dare alla stessa una categoria padre (che, se non diversamente definita, è "nessuna")
· Nome Pagina: è il nome che la nostra pagina acquisirà.
A questo punto si incomincia ad editare il testo, ad inserire immagini, collegamenti ipertestuali, tabelle e quanto desideriamo inserire nella nostra pagina. Sul corretto uso dell'Editor (utilizziamo FCK Editor), peraltro d'utilizzo abbastanza immediato si rimanda ad un passaggio successivo di questo manuale d'uso.
Una volta terminato 'editing della pagina procederemo con l'immissione (facoltativa) degli ultimi dati:
· Titolo Pagina: è quello che comparirà in alto sulla finestra del browser nel momento in cui visiteremo la pagina;
· Descrizione: raccoglie le informazioni che saranno riportate dal motore di ricerca
· Stylesheet: riporta il foglio di stile CSS utilizzato, e viene indicato per permettere l'eventuale modifica;
· Stylesheet Alternativo: permette di inserire un foglio di stile alternativo, per eventuali necessità;
· Stylesheet No-Flash: permette di inserire un foglio di stile per chi non ha installato il plugin di Flash,
· Stylesheet Print: permette di inserire un foglio di stile dedicato alla stampa.
Terminate le operazioni descritte, sarà possibile scegliere "conferma", e, successivamente, "Esci". Si tornerà alla pagina iniziale, con la nuova pagina (ed eventualmente la nuova categoria) che appaiono nella struttura.
Clonazione
Sarà ora possibile clonare pagine e categorie nelle differenti lingue.
Nella pagina appariranno: nella colonna della struttura i nomi delle categorie, caratterizzate da uno sfondo di colore grigio, che diventa sempre più chiaro con l'abbassarsi del livello, e con un trattino che indica allo stesso modo il livello. Quindi: nessun trattino, nessun padre, e così via. Le pagine appariranno con sfondo bianco.
Se è già stata creata almeno una lingua la gerarchia sarà mostrata con una serie di colori di tonalità decrescente dall'arancione scuro al giallo pallido.
Non sarà possibile clonare una pagina se non è stata clonata la categoria superiore: in tale caso nella casella della pagina apparirà la scritta su fondo grigio "categoria assente".
Dopo aver clonato la categoria superiore, questa scritta scomparirà, e al suo posto apparirà la scritta clona su campo bianco. Cliccando su questa scritta si aprirà la pagina da modificare, sulla quale opereremo le modifiche di contenuto necessarie.
Modifica - cancellazione struttura
Nella pagina appariranno di fianco alle categorie le scritte "modifica" ed "elimina". Con il tasto modifica sarà possibile modificare il nome, il codice di ordinamento e la categoria padre di ogni categoria. Tutte le modifiche relative a codice di ordinamento e di categoria padre si riverseranno sulle eventuali pagine e categorie già clonate nelle lingue.
Per modificare categorie o pagine già clonate nelle lingue sarà sufficiente ciccare sul nome della categoria o della pagina. Scegliendo il nome della categoria ci sarà richiesto di modificarne il nome; ciccando sulla scritta "mod" a fianco del nome della pagina ci troveremo all'interno dell'editor della pagina stessa, ove potremo fare le modifiche necessarie come già illustrato nei punti precedenti.
Pagine orfane
Come abbiamo avuto modo di scrivere, sarà possibile cancellare categorie, anche qualora siano già state create sottocategorie o pagine al di sotto di queste. In tale caso ci verrà fatto notare, e, se vorremo continuare, nel caso della presenza di pagine, ci verrà detto che queste pagine rimarranno "orfane". Non perderemo nessun dato: semplicemente le pagine che hanno perso la propria categoria di appartenenza finiranno nella lista denominata "Orfani" al di sotto delle categorie esistenti.
Da qui sarà possibile scegliere nella colonna pagina master il comando "categoria" e tramite questo affidarle a una nuova categoria. In questa stessa operazione sarà possibile o scegliere una categoria esistente, oppure creare una nuova categoria, come già illustrato.
Vale la pena di ripetere che anche in questo caso categorie e pagine clonate seguiranno la sorte della categoria o pagina master modificata, sia per quanto riguarda la struttura gerarchica sia per il codice di ordinamento.
Gestione menu
Le pagine che abbiamo creato o modificato verranno automaticamente inserite nel menu di navigazione. Qui saranno riportate con il nome di menu provvisorio uguale al nome della pagina.
Per visualizzare il menu proposto (ed apportare le modifiche necessarie) occorre, dalla pagina di login scegliere GESTIONE PAGINE, LINGUE E MENU, e qui la voce aggiorna menu (inserisci voci, modifica, elimina).
Qui comparirà un menu ordinato per lingua, che farà apparire tutte le voci di collegamento esistenti per ogni lingua.
Cliccando sul pulsante "modifica" presente di fianco alla categoria ci apparirà una pagina ove sarà possibile modificare il nome della categoria e il codice di ordinamento (nell'ambito del menu).
Cliccando su l pulsante "modifica" presente di fianco al nome della pagina si aprirà una pagina nella quale sarà possibile modificare o aggiungere alcuni cambi. In particolare:
Titolo: il nome che apparirà nell'html del menu, come descrizione aggiuntiva (da utilizzarsi, per esempio, per necessità di accessibilità)
Nome: il nome del collegamento (viene proposto come predefinito il nome della pagina).
Link: viene proposto il collegamento ipertestuale alla pagina, che può essere modificato. Il consiglio è di non modificare tale collegamento a meno di necessità particolari (p.e. reindirizzamento a una pagina under construction se il sito è in fase di rifacimento);
Ord: codice di ordinamento. Per mostrare il collegamento prima o dopo rispetto ad altri
Immagine: per inserire una pagina da riportare nel menu (in fase di implementazione)
Tipologia: se si desidera dare una formattazione html particolare alla voce di menu (normale, Titolo 1, Titolo 2, Titolo 3, Titolo 4, Titolo 5, Titolo 6)
Categoria: se si vuole gestire una categoria in maniera differente rispetto a quelle di struttura (p.e. se si vogliono utilizzare le categorie di struttura per raggruppare le pagine in maniera ordinata, ad esempio per aree di competenza, e visualizzarle con altra metodologia di raggruppamento)
Se la categoria non è presente: permette di inserire una categoria di menu se non esiste.
Target: stessa pagina se si vuole che la pagina che si apre sia nella stessa finestra che si sta utilizzando, altra pagina se si vuole lasciare in primo piano la pagina esistente ed aprirne una nuova. Questo è utilizzato in particolare per collegamenti a siti web esterni.
Aggiungi link
Da questa pagina di gestione menu sarà anche possibile inserire link di menu manualmente (particolarmente utile se si vogliono inserire collegamenti a siti esterni). Scegliendo la voce in oggetto, che si trova di fianco al nome di ogni lingua, si aprirà una finestra analogo a quella già vista per la modifica, con i seguenti comandi, sul cui significato abbiamo già dato spiegazione:
· Categoria
· Se la categoria non è presente
· Nome Link
· Titolo link
· Collegamento
· Tipologia
· Destinazione pagina
· Posizione
· Immagine
Editor:
L'Editor di testo utilizzato dal nostro CMS è l'unico componente del nostro CMS di produzione non interna. Abbiamo scelto FCK Editor, Editor Open source, di comprensione immediata.
I comandi sono di comprensione immediata per chiunque sia abituato ad utilizzare un editor di testi quale p.e. Microsoft Word
 |
cliccando questa icona sarà possibile visualizzare (e modificare) l'HTML della pagina |
| Nota: consigliato ad utenti esperti | |
 |
cliccando questa icona sarà possibile salvare il lavoro svolto |
 |
cliccando questa icona sarà possibile aprire un nuovo documento |
 |
cliccando questa icona sarà possibile avere una preview del documento |
 |
cliccando questa icona sarà possibile utilizzare comodi modelli per impaginare la propria pagina |
 |
|
 |
cliccando questa icona sarà possibile tagliare il testo selezionato, rendelo disponibile per essere incollato ove necessario |
 |
cliccando questa icona sarà possibile copiare il testo selezionato negli appunti, rendendolo disponibile ad essere incollato nella pagina ove ritenuto necessario |
 |
cliccando questa icona sarà possibile incollare nel punto scelto con il puntatore il testo tagliato o copiato |
 |
cliccando questa icona sarà possibile incollare nel punto scelto con il puntatore il testo tagliato o copiato da Microsoft Word o da altri programmi ripulendolo dalle formattazioni |
 |
cliccando questa icona sarà possibile incollare nel punto scelto con il puntatore il testo tagliato o copiato da Microsoft Word mantenendone le formattazioni |
 |
cliccando questa icona sarà possibile stampare (eventualmente in PDF) le parti selezionate |
 |
icona non abilitata al momento |
 |
cliccando questa icona sarà possibile annullare l'ultima (le ultime) operazioni effettuate |
 |
cliccando questa icona sarà possibile ripetere l'ultima operazione fatta o ripristinare l'ultima (le ultime) operazioni annullate grazie al tasto precedente |
 |
cliccando questa icona sarà possibile trovare una determinata parola all'interno del testo della finestra |
 |
cliccando questa icona sarà possibile sostituire un testo con un altro all'interno della finestra |
 |
cliccando questa icona sarà possibile selezionare l'intero contenuto della finestra (seleziona tutto) |
 |
cliccando questa icona sarà possibile rimuovere la formattazione dal testo selezionato |
 |
cliccando questa icona sarà possibile inserire un form per gestire moduli di immiossione dati |
| Nota: consigliato ad utenti esperti | |
 |
cliccando questa icona sarà possibile inserire un check box per un form di immissione dati |
| Nota: consigliato ad utenti esperti | |
 |
cliccando questa icona sarà possibile inserire un "radio button" campo di scelta alternativa |
| Nota: consigliato ad utenti esperti | |
 |
cliccando questa icona sarà possibile inserire una casella di testo per un modulo, specificandone le caratteristiche |
| Nota: consigliato ad utenti esperti | |
 |
cliccando questa icona sarà possibile inserire una casella di textarea per un modulo, specificandone le dimensioni |
| Nota: consigliato ad utenti esperti | |
 |
cliccando questa icona sarà possibile inserire dati in un menu a tendina di un form |
| Nota: consigliato ad utenti esperti | |
 |
cliccando questa icona sarà possibile inserire un tasto di invio dati per il modulo creato, indicandone le caratteristiche |
| Nota: consigliato ad utenti esperti | |
 |
cliccando questa icona sarà possibile inserire un bottone immagine (immagine con un collegamento ipertestuale) |
| finestra di dialogo "bottone immagine" |  |
 |
cliccando questa icona sarà possibile inserire un campo nascosto |
 |
cliccando questa icona sarà possibile formattare il testo selezionato in grassetto |
 |
cliccando questa icona sarà possibile formattare il testo selezionato in corsivo |
 |
cliccando questa icona sarà possibile formattare il testo selezionato in sottolineato |
 |
cliccando questa icona sarà possibile formattare il testo selezionato in barrato |
 |
cliccando questa icona sarà possibile formattare il testo selezionato in pedice |
 |
cliccando questa icona sarà possibile formattare il testo selezionato in apice (per esempio esponente di una potenza) |
 |
cliccando questa icona sarà possibile creare un elenco numerato (lista ordinata) applicandola al testo selezionato |
 |
cliccando questa icona sarà possibile creare un elenco puntato (lista non ordinata) applicandola al testo selezionato |
 |
cliccando questa icona sarà possibile ridurre l'indentazione del testo selezionato |
 |
cliccando questa icona sarà possibile aumentare l'indentazione del testo selezionato |
 |
cliccando questa icona sarà possibile formattare il testo selezionato con allineamento a sinistra |
 |
cliccando questa icona sarà possibile formattare il testo selezionato con allineamento al centro |
 |
cliccando questa icona sarà possibile formattare il testo selezionato con allineamento a destra |
 |
cliccando questa icona sarà possibile giustificare l'allineamento il testo selezionato |
 |
cliccando questa icona sarà possibile inserire un collegamento ipertestuale |
| finestra di dialogo "collegamento ipertestuale" |  |
 |
cliccando questa icona sarà possibile rimuovere il collegamento ipertestuale dal testo selezionato |
 |
cliccando questa icona sarà possibile inserire un punto di ancoraggio interno alla pagina (per creare dei collegamenti ipertestuali interni) |
 |
cliccando questa icona sarà possibile inserire una immagine caricandola dalle risorse del proprio computer, ridimensionandola, allineandola secondo il desiderio, assegnandole una spaziatura orizzontale e verticale |
| 1. si apre la finestra di dialogo "immagini" |  |
| 2. ci si porta sul terzo pulsante in alto della finestra |  |
| 3. si sfoglia sulle risorse del proprio computer |  |
| 4. una volta selezionata l'immagine, si clicca su "invia al server" |  |
| 5. l'immagine appare nella nostra finestra nelle sue dimensioni originali |  |
| 6. l'immagine viene modificata in alcuni attributi (dimensioni, allineamento, bordi, spaziature) e si ha una visualizzazione in finestra di come apparirà |  |
 |
cliccando questa icona sarà possibile inserire un inserto animato Flash nella pagina, prelevandolo dalle risorse del computer in maniera analoga a quanto visto per le immagini |
| finestra di dialogo "Flash" |  |
 |
cliccando questa icona sarà possibile inserire una tabella |
| finestra di dialogo "tabella" |  |
 |
cliccando questa icona sarà possibile inserire un riga orizzontale di divisoria |
 |
cliccando questa icona sarà possibile inserire un "emoticon" prelevandola dalla libreria |
| finestra di dialogo "smile" |  |
 |
cliccando questa icona sarà possibile inserire un carattere speciale |
| finestra di dialogo "caratteri speciali" |  |
 |
cliccando questa icona sarà possibile inserire un comando di "a capo" |
 |
scegliendo da questo menu a tendina sarà possibile scegliere una formattazione predefinita per il nostro testo |
 |
scegliendo da questo menu a tendina sarà possibile scegliere una formattazione consona con i dettami dell'XHTML, che sarà visualizzata secondo quanto previsto dal foglio di stile |
 |
scegliendo da questo menu a tendina sarà possibile scegliere un determinato carattere per formattare il nostro testo |
| Nota: si sconsiglia l'utilizzo di questa opzione. Infatti i browser riconoscono normalmente 4 caratteri (Arial, Courier, Times e Verdana) e, non trovando un font nel proprio computer, potrebbe essere rimpiazzato da quello predefinito con risultati graficamente sgradevoli | |
 |
scegliendo da questo menu a tendina sarà possibile scegliere una determinata dimensione per formattare il nostro testo |
 |
scegliendo da questo menu a tendina sarà possibile scegliere un determinato colore per formattare il nostro testo |
 |
scegliendo da questo menu a tendina sarà possibile scegliere un determinato colore di sfondo per formattare il nostro testo |
 |
cliccando questa icona sarà possibile massimizzare la visualizzazione dell'editor, compatibilmente con la dimensione dello schermo |
 |
cliccando questa icona sarà possibile avere informazioni sull'editor utilizzato |
Struttura cornice della pagina - imposta gli elementi della pagina
La pagina di settaggio (settingpage) permette di modificare dinamicamente gli elementi di cornice della pagina.
Sottolineiamo che nessuna delle pagine create fa uso dei frames, considerati assolutamente deprecabili dal consorzio mondiale del web.
Gli elementi di cornice sono quelli che compaiono in tutte le pagine.
Fra questi consideriamo:
1. testata;
2. menu principale di navigazione;
3. eventuali menu secondari tematici ovvero links a siti esterni;
4. breadcrumbs (briciole di pane) ovvero l'informazione circa il punto del sito in cui ci troviamo gerarchicamente;
5. il "cerca nel sito";
6. la ricerca ragionata dei prodotti;
7. il selettore delle lingue;
8. eventuali banner, immagini, filmati flash;
9. eventuali offerte speciali da proporre ai nostri clienti, in maniera eventualmente ragionata (tipo collegamenti sponsorizzati Google);
10. autenticazione per area riservata (login - logout quando previsto);
11. news;
12. altri articoli qui non considerati.
Per attivare queste modifiche è sufficiente aprire dal menu di amministratore (quello che ci compare dopo l'autenticazione - login) la voce imposta gli elementi della pagina (cerca, breadcrumbs, menu, testata, banner, ecc...) , che compare in GESTIONE PAGINE, LINGUE E MENU alla quarta posizione.
Da qui si verificano le impostazioni di base.
Per spostare all'interno di un'area (per esempio la sezione sinistra della pagina) è sufficiente cambiare il codice di ordinamento.
Per cancellare è sufficiente spuntare la casella "cancella"
Per non renderlo visibile è sufficiente togliere il segno di spunta dalla casella visibile. Questa funzione è particolarmente importante quando, per esempio, vogliamo utilizzare due testate, una per il web e una per la stampa. In questo caso la seconda viene segnata come non visibile.
Al termine di queste operazioni è necessario cliccare sul pulsante "modifica". Per poter visualizzare la pagina così come è stata modificata è necessario un refresh della pagina (pulsante F5).
Per inserire un nuovo articolo si passa alla sezione aggiungi;
si seleziona la voce da inserire; si seleziona il collocamento; si dà un numero di ordinamento. A tal fine occorre considerare che il codice di ordinamento 0 avrà la precedenza sul codice 1 e così via.
Pertanto, per modificare gli ordinamenti, sarà necessario cambiare quelli dei vari articoli all'interno della sezione.
Per inserire un banner o una immagine si seleziona dall'area Aggiungi Banner
l'immagine o il file swf dalle risorse del proprio computer, si stabilisce collocamento (testata, destra, sinistra) ed ordinamento in maniera perfettamente analoga a quanto visto per gli altri articoli e si da clic su aggiungi.