Agro-Start Web Constructor. User Guide

Transcript

1 Agro-Start Web Constructor User Guide 1

2 AGRO-START PROJECT Agro-Start Web Constructor Guida Utente This publication was prepared under the Transnational network for SME support in the animal breeding and horticulture sector AGRO-START Project Priority: Facilitation of Innovation and Entrepreneurship Area of intervention: Develop the enabling environment for innovative entrepreneurship South East Europe Transnational Cooperation Programme 2

3 Sommario Sommario... 3 Descrizione generale... 5 Obiettivi... 5 Tecnologia utilizzata... 6 Tipi di utenti... 7 Administrator (di seguito indicato anche Admin)... 7 Network Administrator (di seguito indicato anche NetAdmin)... 7 Site Administrator (di seguito indicato anche SiteAdmin)... 8 Guest... 8 Accesso al sistema... 9 Funzionalità Network Administrator...11 Amministrazione network...11 Gestione siti...12 Creazione nuovo sito...12 Attività su siti esistenti...13 Gestione utenti...14 Gestione temi grafici...15 Funzionalità Site Administrator...18 Richiesta account...18 Amministrazione sito...18 Impostazioni generali...20 Profilo utente...21 Temi grafici...21 Libreria degli elementi multimediali...23 Gestione delle pagine...24 Creazione e modifica di una pagina...25 Inserimento di un video youtube in pagina...26 Inserimento di un elemento multimediale in pagina...27 Un caso di studio...28 Accesso al sistema (utente Network Administrator)

4 Attivazione sito e utenza...29 Accesso al sistema (utente Site Administrator)...31 Selezione di un tema grafico...32 Eliminazione delle pagine di esempio...34 Creazione di una nuova pagina...35 Gestione del menu di navigazione...36 Visita al sito

5 Descrizione generale Obiettivi Il sistema informatico qui descritto (di seguito anche piattaforma o Web contructor) permette ad un numero illimitato di utenti (di tipo Site administrator) di realizzare e pubblicare online un sito web composto da un menù di navigazione e da un insieme di pagine html. L attività di realizzazione dei siti web avviene in piena autonomia e libertà, include la possibilità di inserire componenti multimediali nelle pagine html e permette illimitate modifiche successive. Viene consentito agli amministratori dei siti di scegliere tra diversi temi grafici precaricati da applicare ai contenuti realizzati. Un nuovo sito web viene istanziato sulla piattaforma da un utente di tipo Network administrator, che ha la capacita e responsabilità di gestione dei siti e dei relativi Site administrator. La piattaforma è di tipo Web application, ossia è installata su un web server ed è accessibile agli utenti attraverso Internet tramite un comune web browser. L utilizzo delle funzionalità offerte è reso molto semplice dall interfaccia grafica semplice ed intuitiva. Il sistema è stato progettato per essere facilmente utilizzabile da chiunque, grazie ad un interfaccia grafica semplice e intuitiva: la progettazione ha mirato ad offrire all utente soltanto le funzionalità strettamente necessarie, consentendo al tempo stesso la possibilità di inserire nuove funzionalità in futuro. Nella presente guida gli argomenti vengono presentati in maniera modulare e con complessità crescente, passando gradualmente dalla descrizione dei concetti base alle sezioni dove tutte le operazioni disponibili vengono accompagnate con esempi dettagliati e screenshot. Gli utenti di tipo Site administrator possono leggere il capitolo Funzionalità Network Administrator per avere una conoscenza completa della piattaforma, ma tale capitolo non è necessario per le attività di gestione che questi utenti devono svolgere. Nell ultimo capitolo viene presentato un caso di studio reale, descrivendo in sequenza tutte le operazioni che gli utenti devono compiere per la realizzazione di un nuovo sito web partendo da zero. 5

6 Tecnologia utilizzata Il sistema informatico è basato sulla diffusa e collaudata piattaforma CMS (Content Management System) WordPress v3.9.1, un software open source, liberamente utilizzabile e distribuibile anche in ambito commerciale e professionale. Il suddetto CMS si presta all utilizzo in innumerevoli campi applicativi e, grazie ad una accurata configurazione e personalizzazione, permette di raggiungere il risultato descritto in questo documento, nascondendo all utente ogni complessità non necessaria. È presente sulla piattaforma un unico utente di tipo Administrator che ha le autorizzazioni necessarie per modificare la configurazione del sistema fino ai minimi particolari. Per le normali attività descritte nella guida non è mai necessario utilizzare questo utente. La progettazione e realizzazione del sistema informatico, con gli obiettivi qui descritti, è stato molto complesso, richiedendo accurate configurazioni e anche lo sviluppo di componenti non esistenti. La piattaforma, come detto anche nel precedente paragrafo, si presta all implementazione di eventuali nuove funzionalità: l utenza Administrator è utilizzabile a questo scopo, ma esclusivamente da parte di personale qualificato data la potenziale pericolosità delle autorizzazioni possedute sul sistema informatico. 6

7 Tipi di utenti In questo capitolo vengono descritti i tipi di utenti disponibili sulla piattaforma; si tenga presente che gli utenti sono qui presentati in ordine decrescente di autorizzazioni, nel senso che, ad esempio, Administrator possiede, oltre alle proprie, anche tutte le autorizzazioni possedute da Network administrator, ma non vale il contrario. Administrator (di seguito indicato anche Admin) Sul sistema esiste un unico utente di questo tipo e possiede tutte le autorizzazioni che consentono di modificare la piattaforma in ogni minimo dettaglio. Questo utente, durante il normale utilizzo della piattaforma, non è mai necessario poiché agli altri utenti vengono già esposte tutte le funzionalità necessarie per compiere il proprio lavoro di gestione siti e pubblicazione. Tutte le informazioni necessarie per eseguire le operazioni di gestione della piattaforma Wordpress esulano dallo scopo della presente guida e sono facilmente reperibili online, riferendosi ad esempio dalla documentazione ufficiale, partendo dal seguente link: WordPress Codex. Network Administrator (di seguito indicato anche NetAdmin) Sul sistema esiste un unico utente di questo tipo e possiede le autorizzazioni che permettono di gestire la piattaforma nel normale flusso di lavoro. Questo utente può creare, modificare e eliminare siti web. Contestualmente alla creazione di un nuovo sito web viene creato il relativo utente di tipo Site administrator. Il NetAdmin ha i permessi per la gestione dei temi grafici selezionabili dagli utenti di tipo Site administrator per la creazione dei siti, ossia può inserire, eliminare e rendere non disponibile un numero illimitato di temi. Come indicato nel concetto generale riportato in testa a questo capitolo, l utente NetAdmin, in caso di necessità, può anche effettuare operazioni di modifica su tutti i siti web presenti sulla piattaforma, assumendo di fatto le capacità di un Site Administrator. Elenco sintetico delle autorizzazioni: Gestione siti 7

8 Gestione utenti Gestione temi grafici Site Administrator (di seguito indicato anche SiteAdmin) Sul sistema possono esistere un numero illimitato di utenti di questo tipo e possiedono le autorizzazioni che permettono di gestire il proprio sito web. Questo tipo di utente può creare, modificare ed eliminare un numero illimitato di pagine html che, posizionate graficamente nella parte centrale del sito, rappresentano i contenuti che si vogliono pubblicare. In tali pagine possono essere presenti contenuti multimediali. Ogni pagina realizzata è raggiungibile tramite una voce di menù. Per il proprio sito, l utente SiteAdmin può creare, modificare ed eliminare un numero illimitato di voci di menù che appaiono a sinistra, a destra o sulla barra superiore del sito, a seconda del tema grafico impostato. Queste voci rappresentano i link tramite i quali si raggiungono le singole pagine html create, oltre ad eventuali link che portano a siti esterni. Infine, per il proprio sito, l utente SiteAdmin può creare, modificare (nel nome e nella descrizione) ed eliminare un numero illimitato di contenuti multimediali (es.: immagini, grafici, suoni, filmati) che possono essere inclusi in una o più pagine html. Elenco sintetico delle autorizzazioni: Gestione pagine Gestione menu di navigazione Gestione della libreria multimediale Selezione di un tema grafico Guest Questo utente può visualizzare tutti i siti web presenti sulla piattaforma, oltre alle pagine pubbliche della piattaforma stessa. In una pagina del Web constructor è presente un elenco completo dei siti online. 8

9 Accesso al sistema Escludendo il tipo Guest, per tutti gli utenti è necessario il login al sistema (con username e password) per effettuare le operazioni descritte. La pagina di login è raggiungibile da un link presente nella home page della piattaforma, come rappresentato in figura: Il link porta alla pagina di login, comune per tutti i tipi di utente: 9

10 Il link evidenziato Lost your password? permette di accedere, in caso di necessità, ad una pagina di recupero password: è sufficiente indicare la propria o username e il sistema genererà una nuova password temporanea che verrà inviata alla mail dell utente. Questa funzionalità è disponibile per ogni tipo di utente della piattaforma: 10

11 Funzionalità Network Administrator Amministrazione network La pagina di amministrazione per l utente NetAdmin si presenta come in figura: A sinistra si possono notare le tre voci principali di menu tramite le quali effettuare le operazioni di gestione descritte in questo capitolo. Tramite il link rappresentato nella figura seguente si può tornare velocemente a questa schermata principale, ad esempio dopo aver eccezionalmente modificato una pagina di un sito: 11

12 Gestione siti La voce Sites presente nella pagina principale di amministrazione porta l utente alla pagina di gestione siti, dove si può trovare l elenco completo dei siti presenti sulla piattaforma: La prima voce in elenco rappresenta il sito stesso Web constructor, la seconda il modello dal quale derivano i nuovi siti creati. Di queste due voci il NetAdmin non deve curarsi. La terza voce nell immagine è un sito di esempio, creato tramite la funzionalità Add New, visibile a sinistra nel menu e in alto nella pagina, descritta nel prossimo paragrafo. Creazione nuovo sito La creazione di un nuovo sito comincia facendo click sulla voce del menu Add New ; il link porta alla pagina di creazione qui rappresentata: 12

13 Come si vede dalla schermata di esempio, è sufficiente indicare i seguenti dati: Site Address L indirizzo del nuovo sito, che viene accodato all indirizzo principale del Web constructor. Nell esempio, indicando examplesite, l indirizzo completo sarà Site Title Il nome del sito, che apparirà nella parte superiore di ogni pagina e sarà modificabile successivamente dal SiteAdmin; Admin L indirizzo del nuovo utente di tipo SiteAdmin, che sarà l amministratore sel sito. A questo indirizzo verrà inviata, dopo aver cliccato sul pulsante Add Site in basso a sinistra, una mail contenete una password temporanea per accedere alla piattaforma. Il nuovo SiteAdmin, una volta avuto accesso al pannello di amministrazione, potrà cambiare la password a proprio piacimento; Template Di questa voce, preimpostata come in figura, il NetAdmin non dovrà curarsi: rappresenta il modello che verrà copiato per la creazione del nuovo sito. Attività su siti esistenti Nella pagina di amministrazione siti, passando con il mouse vicino al nome di ogni sito è possibile compiere su di esso alcune attività di gestione. 13

14 Alcune di queste (Edit e Dashboard) competono direttamente ai SiteAdmin ma, come detto sopra, anche i NetAdmin per questioni di sicurezza vi hanno accesso. Le altre attività sono specifiche di un NetAdmin poiché sono strettamente legate alla gestione di eventuali situazioni non desiderate, ad esempio per disattivare o eliminare completamente un sito dalla piattaforma (Deactivate e Delete). Gestione utenti La voce Users presente nella pagina principale di amministrazione porta l utente alla pagina di gestione utenti, dove si può trovare l elenco completo degli utenti presenti sulla piattaforma: Questa schermata ha un importanza marginale poiché gli utenti presenti sulla piattaforma coincidono con i siti creati, quindi non vi sono attività i rilievo che il NetAdmin debba svolgere, ad esclusione del cambio password e descritto di seguito. Nonostante ogni utente possa cambiare le proprie e password in autonomia e la piattaforma preveda la procedura di recupero password direttamente dal pannello di login, potrebbe essere necessario compiere questa attività da parte del NetAdmin, ad esempio nel caso in cui un utente SiteAdmin non abbia più accesso alla propria mail. Occorre fare click sulla voce Edit in corrispondenza dell utente dal modificare: 14

15 Nella schermata successiva occorre inserire quindi i nuovi dati per l utente, in fondo alla pagina, e fare click su Update User : Gestione temi grafici La voce Themes presente nella pagina principale di amministrazione porta l utente alla pagina di gestione temi, dove si può trovare l elenco completo dei temi grafici disponibili sulla piattaforma, tra i quali gli utenti SiteAdmin possono scegliere per il proprio sito: 15

16 Facendo click sul link evidenziato in figura è possibile disattivare un tema: in questo modo non sarà più disponibile per i SiteAdmin ma non verrà comunque eliminato. Nel caso si voglia eliminare completamente un tema, occorre selezionarlo tramite la checkbox accanto al nome, selezionare Delete dal menu Bulk Actions e fare click sul pulsante Apply : Occorre fare molta attenzione all utilizzo di queste funzioni: eliminando un tema che è utilizzato da uno o più siti potrebbero verificarsi errori di visualizzazione fino alla selezione di un nuovo tema grafico. Facendo click sulla voce di menu Add New, subito sotto Themes, si accede alla seguente schermata: 16

17 Da qui è possibile selezionare un nuovo tema da installare sulla piattaforma, rendendolo quindi disponibile ai SiteAdmin. Quelli che si vedono in figura sono i temi disponibili per il download dal sito di Wordpress. Per caricare sulla piattaforma un tema completamente personalizzato occorre fare click sul link Upload Theme, visibile in alto nella figura precedente. Si accede così alla schermata qui sotto riportata dove, facendo click sul pulsante Choose File si può selezionare sul proprio computer il file zip contenente il nuovo tema grafico, e installarlo definitivamente facendo click su Install Now. 17

18 Funzionalità Site Administrator Richiesta account Per gli utenti non ancora registrati e che vogliono pubblicare un proprio sito, la piattaforma mette a disposizione un modulo per richiedere l attivazione di un nuovo account. Facendo click sul link Access Request presente sul sito principale si accede ad una schermata che permette di inviare una richiesta al NetAdmin, il quale la riceve per mezzo mail: Amministrazione sito La pagina di amministrazione per l utente SiteAdmin si presenta come nella figura seguente. A sinistra si possono notare le cinque voci principali di menu tramite le quali effettuare le operazioni di gestione descritte in seguito. 18

19 Tramite il link Site admin, rappresentato nella figura seguente si può tornare velocemente a questa schermata principale di amministrazione, mentre con il link Visit Site si può passare velocemente alla visualizzazione del sito che si sta realizzando: Mentre si modifica il sito dal pannello di amministrazione si consiglia di mantenere su un altra finestra del browser il sito vero e proprio, per vedere velocemente, con un refresh, l effetto delle modifiche effettuate. Nei paragrafi seguenti non viene presentato l effetto delle modifiche effettuate, poiché potrebbe variare a seconda del tema grafico selezionato dall utente. 19

20 Impostazioni generali La voce Settings presente nella pagina principale di amministrazione permette all utente di modificare alcuni parametri generali del sito. I più importanti sono rappresentati nella figura seguente e sono rispettivamente il titolo e sottotitolo del sito, che appaiono nella parte superiore di ogni pagina pubblicata: La pagina di impostazioni Media, visibile nel menu, permette di modificare i parametri che riguardano i contenuti multimediali che l utente può inserire e che costituiscono la Libreria multimediale (descritta dopo). 20

21 La piattaforma, per ogni elemento multimediale inserito, oltre al file originale, memorizza tre ulteriori versioni dello stesso file, di dimensioni inferiori. In questa pagina il SiteAdmin può impostare queste dimensioni, che ritroverà come opzione all inserimento dell immagine in una pagina. Profilo utente La pagina Profile permette al SiteAdmin di modificare alcune preferenze relative alla propria utenza, ad esempio il colore preferito per l interfaccia di amministrazione. Tra queste opzioni le più importanti a livello funzionale sono di riferimento e password, che è possibile modificare come indicato nella figura seguente: Temi grafici La voce di menu Appearance porta l utente SiteAdmin ad una schermata che permette, con un solo click sul pulsante Activate, di cambiare il tema grafico al proprio sito, selezionando tra quelli resi disponibili dal NetAdmin: 21

22 La voce Menu, sotto Appearance conduce alla pagina di gestione del menu di navigazione del sito: Possiamo distinguere due zone importanti: 1. Qui è rappresentato il menu presente sul sito; nell esempio, questo è costituito da link che portano tutti a pagine del sito stesso. È possibile ordinare le voci del menu semplicemente trascinandole più sopra o più sotto. Infine l opzione Auto add pages permette l aggiunta automatica di una voce di menu ad ogni nuova pagina realizzata. 22

23 2. Da qui è possibile inserire nuove voci di menu, che puntano sia a pagine del sito stesso ( Pages ) che a link esterni ( Links ). Alla fine del lavoro è necessario premere il pulsante Save Menu per memorizzare e pubblicare le modifiche effettuate. Libreria degli elementi multimediali La voce di menu Media permette all utente SiteAdmin di gestire la Libreria dei Media, dove vengono elencati tutti gli elementi multimendiali presenti sulla piattaforma. Si tenga a mente che la presenza di un elemento multimediale nella libreria non significa che questo sia stato pubblicato, poiché per questo occorre inserirlo in una (o più) pagine del sito. Dalla figura si nota la presenza di due link, visibili passando con il mouse in corrispondenza di ogni immagine: Delete Permanently e View, dal chiaro significato. Facendo click sulla voce di menu Add New, sotto Media, oppure sul link Add New presente nella pagina della Libreria Media, è possibile caricare un nuovo elemento multimediale sulla piattaforma: 23

24 Da qui è sufficiente trascinare un file dal proprio filesystem alla pagina web per causarne il caricamento automatico sulla piattaforma. Gestione delle pagine La voce Pages conduce alla sezione che permette la visualizzazione e gestione delle pagine html presenti sul sito: Come nelle altre pagine di gestione, anche qui passando con il mouse in corrispondenza di un elemento è possibile effettuare alcune attività: Edit: modifca della pagina; Quick Edit: modalità veloce di modifica della pagina; Trash: spostamento della pagina nel cestino. Le pagine cestinate si visualizzano facendo click sul link Trash in alto; View: visualizzazione della pagina nel formato di pubblicazione sul sito. 24

25 Creazione e modifica di una pagina Facendo click sulla voce di menu Add New, oppure sul link Add New in alto nella pagina di gestione, è possibile creare una nuova pagina html. All utente viene quindi presentata l interfaccia di modifica della pagina stessa: Di seguito la descrizione delle cinque sezioni importanti della pagina. 1. Titolo della pagina: appare in alto nella pagina e come voce nel menu di navigazione del sito; 2. Area di editing: qui l utente SiteAdmin inserisce il testo e gli eventuali elementi multimediali da pubblicare nella pagina; 3. Strumenti di editing: la piattaforma incorpora una serie di strumenti che permettono con facilità di attribuire al testo e agli altri elementi della pagina lo stile preferito; è possibile modificare tipo di carattere, grandezza, allineamento, colore, stile, inserire tabelle di dati, elenchi, etc. Nonostante l utilizzo di questi strumenti sia molto semplice e intuitivo, per una descrizione completa degli strumenti di editing si faccia riferimento alla documentazione ufficiale, rintracciabile partendo dalla seguente pagina online: TinyMCE Advanced. 25

26 4. Pubblicazione: è qui disponibile lo stato di pubblicazione della pagina ed è possibile cambiare tale stato se ad esempio la pagina deve essere messa momentaneamente offline. Il link Move to Trash rimuove la pagina e la colloca nel cestino (vedi paragrafo precedente). 5. Attributi di pagina: qui è possibile stabilire la gerarchia della pagina che si sta modificando, posizionandola ad esempio come figlia di un altra pagina, indicando la pagina padre tramite il menu a tendina Parent : in questo modo, nel menu di navigazione, la pagina corrente viene posizionata ad un livello interno rispetto alla pagina padre. Inserimento di un video youtube in pagina Per inserire un video youtube in una pagina è sufficiente copiare e incollare il link come nell immagine seguente: Facendo click sul pulsante Preview Changes si può guardare l anteprima come nell immagine seguente, mentre facendo click sul pulsante Update si rendono effettive le modifiche e la pagina modificata diventa pubblicamente accessibile. 26

27 Inserimento di un elemento multimediale in pagina Ipotizziamo di aver caricato nella Libreria Media un immagine (vedi paragrafi precedenti). Per inserire questa immagine nella pagina che si sta creando è sufficiente premere il pulsante Add Media, selezionare l elemento desiderato e premere il pulsante Insert into page. Inoltre, dalla finestra di selezione, facendo click su Upload Files è possibile caricare al volo un nuovo elemento grafico: in questo modo non c è la necessità di passare prima dalla funzionalità Media. 27

28 Un caso di studio Accesso al sistema (utente Network Administrator) Immaginiamo che l utente NetAdmin abbia ricevuto una richiesta per un nuovo sito e voglia quindi predisporre la piattaforma. Dalla home page della piattaforma occorre fare click sul link evidenziato: Il link porta alla pagina di login dove è necessario inserire username e password dell utente NetAdmin e fare click sul pulsante Log In : 28

29 Attivazione sito e utenza Una volta effettuato l accesso al sistema occorre fare click sul link evidenziato in figura: Questo link porta alla pagina di creazione sito dove occorre compilare i campi richiesti e fare click sul pulsante Add Site ; di seguito alcuni dati di esempio: Un messaggio di conferma avvisa l utente che la procedura è stata completata senza errori: 29

30 A questo punto risulterà immediatamente attivo e pubblico il nuovo sito creato; accedendo infatti con un browser all indirizzo si può osservare il risultato: 30

31 Si noti che è stato creato un sito con alcuni contenuti di esempio: una home page, due pagine html e il menu di navigazione. Vedremo nei prossimo paragrafi come eliminare i dati di esempio e creare nuove pagine. Accesso al sistema (utente Site Administrator) Il nuovo utente appena creato insieme al sito, di tipo SiteAdmin, con username uguale al nome del sito (exampleagrosite) avrà ricevuto una mail contenente username e password. Da una pagina qualunque della piattaforma occorre fare click sul link evidenziato. Abbiamo scelto la pagina Site List per far notare che nell elenco dei siti compare anche quello nuovo: Il link conduce alla pagina di login dove è necessario inserire username e password dell utente di tipo SiteAdmin e fare click sul pulsante Log In : 31

32 Effettuato correttamente il login, all utente viene presentata la schermata principale di gestione sito: Selezione di un tema grafico Per modificare il tema grafico impostato di default alla creazione del sito occorre fare click sulla voce di menu Appearance e, nella schermata successiva selezionare il tema grafico preferito facendo click sul pulsante Activate : 32

33 Facendo click sul link Visit Site si può verificare il risultato ottenuto: 33

34 Eliminazione delle pagine di esempio Per eliminare le pagine di esempio create di default con il sito occorre fare click sulla voce di menu Pages e nella schermata di gestione delle pagine cliccare sul link Trash in corrispondenza delle due pagine da eliminare Page 02 e Page 03 : 34

35 Dopo aver effettuato le due operazioni, la schermata di gestione pagine avrà questo aspetto (da notare il messaggio di conferma eliminazione e il link per annullare l operazione): Creazione di una nuova pagina Per creare una nuova pagina occorre fare click sulla voce di menu Add New, sotto Pages, inserire nelle aree apposite il titolo e il contenuto, e infine fare click sul pulsante Publish : Terminata la procedura di creazione possiamo verificare, facendo click su All Pages, che la pagina compare nell elenco completo: 35

36 Gestione del menu di navigazione Accediamo adesso alla gestione menu, facendo click sulla voce di menu Menus, subito sotto Appearance. Nella schermata successiva possiamo notare come siano ancora presenti le voci di menu relative alle due pagine di esempio eliminate, Page 02 e Page 03 : dobbiamo eliminare anche queste. Facciamo click su Page come indicato di seguito: 36

37 Il sistema presenta all utente le proprietà della voce di menu selezionata, permettendo quindi di modificarle. A noi interessa eliminare definitivamente l elemento, facendo click sul link Remove : Occorre eseguire questa operazione anche con l altra voce di menu Page 03. Al termine delle modifiche occorre fare click sul pulsante Save Menu per pubblicare la nuova versione del menu: 37

38 Visita al sito Facendo click sul link veloce Visit Site si può verificare che le modifiche effettuate sono online: Qui vediamo la home page: E qui la pagina appena creata: 38

39 This publication is edited by Confagricoltura Puglia under the Transnational network for SME support in the animal breeding and horticulture sector AGRO-START Project Priority: Facilitation of Innovation and Entrepreneurship Area of intervention: Develop the enabling environment for innovative entrepreneurship South East Europe Transnational Cooperation Programme 39