Release MOVIO SCMS. Versione Tutorial. Commenti Dichiarazione di copyright

Dimensione: px

Iniziare la visualizzazioe della pagina:

Download "Release MOVIO SCMS. Versione Tutorial. Commenti Dichiarazione di copyright"

Umberto Gagliardi
6 anni fa
Visualizzazioni

Dichiarazione di copyright Abstract Questo documento descrive il front-end e il back-end

1 Titolo Tutorial MOVIO: Pagetype Imagehotspot Release MOVIO SCMS 1.00 Versione Tutorial 1.00 Data 16/02/14 Autori e affiliation Rubino Saccoccio (Gruppometa) Commenti Dichiarazione di copyright Abstract Questo documento descrive il front-end e il back-end di MOVIO. E illustrato il pagetype Imagehotspot. MOVIO PageType: imagehotspot - v.1.00 del 17/03/14 1

2 Sommario Sommario... 2 Pagetype: Imagehotspot... 3 Descrizione... 3 Campi generali della Pagina... 3 Campi specifici della Pagina... 4 Esempio di pagina Imagehotspot in Front-end Cosa accade se posiziono il mouse sui vari hotspot: MOVIO PageType: imagehotspot - v.1.00 del 17/03/14 2

3 Pagetype: Imagehotspot Descrizione Il Pagetype Imagehotspot consente di associare a parti di una immagine delle informazioni di approfondimento oppure dei link ad altre pagine. Creiamo quindi una nuova pagina di tipo Imagehotspot scegliendo Imagehotspot dal menu dei Tipi di pagina. Scelta del pagetype Imagehotspot MOVIO ci mostra un modulo dove si richiede di specificare i seguenti campi: Campi generali della Pagina Titolo, è il titolo che avrà la nuova pagina all interno del sito, il campo è già compilato, ma è ancora modificabile dall utente. URL, è la URL parlante della pagina, il campo è compilabile dall utente e serve a poter raggiungere facilmente la pagina digitando nella barra degli indirizzi del browser direttamente questo: <indirizzo_sito>/<url_parlante> NOTA: la URL parlante non può contenere spazi Testo, testo presente nella schermata che spiega il servizio di ricerca. MOVIO PageType: imagehotspot - v.1.00 del 17/03/14 3

Finestra dell Archivio media Dopo aver fatto click su Carica immagine, si apre la finestra dell Archivio media, cerchiamo l immagine da

4 Campi specifici della Pagina Sono disponibili due pulsanti: Carica immagine Aggiungi tracciato Il pulsante Carica immagine consente di selezionare dall archivio media l immagine che si vuole associare agli hotspot. Finestra dell Archivio media Dopo aver fatto click su Carica immagine, si apre la finestra dell Archivio media, cerchiamo l immagine da mostrare nella pagina e facciamo click su di essa. La finestra si chiude e l immagine viene mostrata nell area di lavoro del pagetype Imagehotspot. MOVIO PageType: imagehotspot - v.1.00 del 17/03/14 4

Immagine caricata nell area di lavoro del pagetype Imagehotspot Ogni volta che si fa click sul pulsante Aggiungi tracciato si aggiunge un nuovo riquadro che serve a

Riquadro di definizione di un tracciato Per ogni tracciato è possibile definire: La Forma, ossia la forma che dovrà avere il tracciato da generare, a scelta tra:

5 Immagine caricata nell area di lavoro del pagetype Imagehotspot Ogni volta che si fa click sul pulsante Aggiungi tracciato si aggiunge un nuovo riquadro che serve a definire un nuovo tracciato sull immagine. Riquadro di definizione di un tracciato Per ogni tracciato è possibile definire: La Forma, ossia la forma che dovrà avere il tracciato da generare, a scelta tra: quadrangolare o circolare Il Tipo, ossia il comportamento che si avrà quando dal front-end si accede all hotspot definito dal tracciato, a scelta tra: o Link esterno, se si farà click sull hotspot si accederà ad una pagina web esterna a MOVIO MOVIO PageType: imagehotspot - v.1.00 del 17/03/14 5

o Link interno, se si farà click sull hotspot si accederà ad una pagina web di MOVIO o Tooltip, se si passa con il mouse sull hotspot verrà mostrato un testo in una nuvoletta Una Descrizione, ossia

6 o Link interno, se si farà click sull hotspot si accederà ad una pagina web di MOVIO o Tooltip, se si passa con il mouse sull hotspot verrà mostrato un testo in una nuvoletta Una Descrizione, ossia il testo da mostrare nel caso si sia scelto il Tipo Tooltip Una URL, ossia o la url della pagina web da caricare, nel caso si sia scelto il Tipo=Link esterno, o il titolo della pagina di MOVIO da caricare, nel caso si sia scelto il Tipo=Link interno NOTA: su una immagine possono essere aggiunti più tracciati, ognuno rappresenta un diverso hotspot e ognuno può avere Forma, Tipo, Descrizione e URL diversi. Inseriamo tre hotspot sull immagine di esempio: 1) Hotspot di Forma quadrangolare con Tipo Link esterno facciamo click sul pulsante Aggiungi tracciato e lo compiliamo come nella figura Forma: Quadrangolare Tipo: link esterno Descrizione: Link Wikipedia Url: Esempio tracciato per Hotspot 1 Passiamo quindi all immagine e con il mouse puntiamo ad uno dei bordi del quadrato che vogliamo tracciare e quindi lo trasciniamo fino a disegnare l hotspot NOTA: l icona a forma di posta in alto a dx del riquadro che definisce il tracciato serve per rimuovere sia il riquadro del tracciato sia l eventuale tracciato disegnato sull immagine. MOVIO PageType: imagehotspot - v.1.00 del 17/03/14 6

Esempio tracciato per Hotspot 1 disegnato sull immagine Trascinando le maniglie è possibile modificare

7 Esempio tracciato per Hotspot 1 mentre viene disegnato sull immagine Non appena il mouse viene rilasciato viene disegnato sull immagine un riquadro con maniglie. Esempio tracciato per Hotspot 1 disegnato sull immagine Trascinando le maniglie è possibile modificare la forma del riquadro Esempio di modifica del tracciato per Hotspot 1 disegnato sull immagine MOVIO PageType: imagehotspot - v.1.00 del 17/03/14 7

NOTA: Si suggerisce di fare click sul pulsante per salvare la Pagina, anche se non è ancora completato l inserimento degli hotspot per evitare di perdere il lavoro svolto in caso di problemi di rete

8 NOTA: Si suggerisce di fare click sul pulsante per salvare la Pagina, anche se non è ancora completato l inserimento degli hotspot per evitare di perdere il lavoro svolto in caso di problemi di rete o errore accidentale. Passiamo quindi ad inserire l hotspot successivo 2) Hotspot di Forma circolare con Tipo Link interno facciamo click sul pulsante Aggiungi tracciato e lo compiliamo come nella figura Esempio tracciato per Hotspot 2 NOTA: la cornice gialla intorno al riquadro che definisce il tracciato indica quale è l hotspot che si sta editando in quel momento. Forma: Circolare Tipo: link interno Descrizione: Link a pagina interna Url: Galleria fotografica Passiamo quindi all immagine e con il mouse puntiamo ad uno dei bordi della figura che vogliamo tracciare e quindi trasciniamo fino a disegnare l hotspot MOVIO PageType: imagehotspot - v.1.00 del 17/03/14 8

Tipo Tooltip facciamo click sul pulsante Aggiungi tracciato e lo compiliamo come nella

9 Esempio tracciati per Hotspot 1 e 2 disegnati sull immagine Passiamo quindi ad inserire il terzo ed ultimo hotspot del nostro esempio 3) Hotspot di Forma quadrangolare con Tipo Tooltip facciamo click sul pulsante Aggiungi tracciato e lo compiliamo come nella figura Esempio tracciato per Hotspot 3 MOVIO PageType: imagehotspot - v.1.00 del 17/03/14 9

Forma: Quadrangolare Tipo: tooltip Descrizione: Testo del tooltip testo del tooltip testo del tooltip testo del tooltip testo del tooltip testo del tooltip Passiamo quindi all immagine e con il mouse

10 Forma: Quadrangolare Tipo: tooltip Descrizione: Testo del tooltip testo del tooltip testo del tooltip testo del tooltip testo del tooltip testo del tooltip Passiamo quindi all immagine e con il mouse puntiamo ad uno dei bordi della figura che vogliamo tracciare e quindi trasciniamo fino a disegnare l hotspot Esempio tracciati per Hotspot 1, 2 e 3 disegnati sull immagine Facciamo click sul pulsante per salvare la Pagina di tipo ImageHotspot, MOVIO PageType: imagehotspot - v.1.00 del 17/03/14 10

11 Esempio di pagina Imagehotspot in Front- end MOVIO PageType: imagehotspot - v.1.00 del 17/03/14 11

12 Cosa accade se posiziono il mouse sui vari hotspot: MOVIO PageType: imagehotspot - v.1.00 del 17/03/14 12

Documenti analoghi

Release MOVIO SCMS. Versione Tutorial. Commenti Dichiarazione di copyright

Release MOVIO SCMS. Versione Tutorial. Commenti Dichiarazione di copyright Titolo Tutorial MOVIO: Pagetype Home Page Release MOVIO SCMS 1.00 Versione Tutorial 1.00 Data 02/03/14 Autori e affiliation Rubino Saccoccio (Gruppometa) Commenti Dichiarazione di copyright Abstract Questo