Griglia immagini/video

Sebbene la griglia, quando viene inizialmente posizionata sull'area di lavoro, mostri solo una griglia con una singola riga di tre segnaposto, si espanderà per adattarsi a tutto il contenuto che aggiungi. Ad esempio, se aggiungi sei immagini, vedrai la griglia espandersi in tre colonne e due righe; se aggiungi dodici immagini, la tua griglia crescerà a tre colonne per quattro righe. Per aggiungere contenuti dal tuo disco, clicca sul pulsante Aggiungi Immagini/Video. Per aggiungere contenuti ospitati su YouTube o Vimeo, clicca sui pulsanti appropriati. Hai anche l'opzione di aggiungere pagine PDF - di questo parleremo tra un momento. Dopo aver aggiunto alcuni contenuti, la griglia potrebbe apparire più o meno così:

Ora puoi regolare le singole celle della griglia per creare un aspetto più estetico. Seleziona ciascuna cella della griglia a turno, sia direttamente sull'area di lavoro, sia dal pannello dei layer. Assicurati di selezionare la cella della griglia e non l'immagine stessa. La differenza è visibile qui sotto. Le maniglie bianche indicano che l'immagine è stata selezionata. Le 'X' grigie pallide indicano che la cella è selezionata.

Con la cella selezionata, vai al pannello di stile e imposta il numero di righe e/o colonne che desideri che quella cella occupi. Ecco come appare l'opzione:

Nell'esempio sopra, la prima cella è stata impostata per occupare 2 colonne e 1 riga. Continua a spostarti attraverso ciascuna cella fino a quando la tua griglia non è stilizzata secondo il tuo gusto. Nella nostra griglia di esempio qui sotto, abbiamo modificato la griglia e l'abbiamo stilizzata con colori di sfondo e bordi per apparire in questo modo - abbiamo mostrato le dimensioni delle celle per ciascuna cella della griglia in modo che tu possa comprendere meglio come è stata creata.

Creare una Presentazione

Per default, cliccando su qualsiasi immagine all'interno della griglia, questa si aprirà in una lightbox. Tipicamente, l'immagine si ingrandirà su uno sfondo oscurato, che può essere chiuso cliccando in qualsiasi punto dello sfondo o cliccando su un pulsante di chiusura sull'immagine (proprio come le immagini su questa pagina). Tuttavia, con la Griglia Immagini/Video, hai anche l'opzione di creare una presentazione dal contenuto della tua griglia. Questo significa essenzialmente che cliccando su qualsiasi contenuto all'interno della griglia si aprirà una lightbox come al solito, ma con la possibilità aggiuntiva di scorrere attraverso tutti i contenuti della griglia mentre la lightbox è aperta. Ecco come appare su una pagina web:

Fatti Creativo con i PDF

Grazie alla capacità di Sitely di importare documenti PDF nel blocco di layout Immagini/Video, ora puoi fare cose che prima erano piuttosto difficili da realizzare. Ad esempio, puoi importare una brochure multi-pagina o una copia PDF di una presentazione Keynote. Farlo popolerà la tua griglia con ciascuna pagina del tuo documento (1 pagina per cella della griglia). Chiaramente, questo potrebbe creare molte celle della griglia che non vuoi necessariamente che i visitatori del tuo sito vedano. Invece, potresti voler che vedano solo la prima pagina e poi lasciarli aprire la presentazione per vedere le altre pagine. Questo è facile da fare in Sitely. Di seguito c'è un esempio di una presentazione di 20 pagine esportata da Keynote come file PDF multi-pagina. Vogliamo che gli utenti vedano solo la diapositiva di apertura e solo il resto quando aprono la presentazione. Per fare questo, cambiamo le dimensioni della griglia e il layout. Ecco come appare la nostra griglia dopo aver applicato un po' di stile.

Il risultato sopra è stato ottenuto regolando le celle a 50px di larghezza, 50px di altezza e spaziando verticalmente e orizzontalmente di 10px - tutto impostato nel pannello di stile.

La prima cella è stata selezionata e impostata per occupare 20 colonne e 9 righe. Questo crea l'illusione di un'immagine principale con un insieme di miniature sottostanti, come illustrato sopra. Mentre le miniature possono rimanere in vista, potresti volerle nascondere in modo che solo l'immagine principale sia visibile. Le persone che vedono le miniature potrebbero semplicemente presumere che l'immagine principale cambierà quando viene cliccata una miniatura, il che potrebbe non essere l'impressione che desideri dare. Per nascondere le miniature, seleziona ciascuna cella miniatura a turno e impostala per NON essere visualizzata su questo dispositivo nel pannello di DISPOSIZIONE. Ora, quando l'immagine principale viene cliccata, inizia la presentazione, consentendo agli utenti di muoversi avanti e indietro attraverso la presentazione.