Come creare una galleria di foto o di miniature su Blogger.

Ci sono molti widget che mostrano una carrellata di immagini del blog anche con effetti speciali. L'obiettivo di questo articolo è quello di illustrare come si possa realizzare una galleria fotografica manualmente inserendo le miniature delle immagini in modo ordinato e immettendo un collegamento a una determinata pagina in ciascuna di esse.

Può essere un modo per mostrare in una singola pagina statica tutto l'archivio dei post che si sono pubblicati attraverso le varie miniature. Se siete pigri o la vostra produzione di articoli è così vasta che non vi consente di fare questa operazione, potete sempre ripiegare creando una mappa del sito testuale o una mappa del sito con miniature.

Per la realizzazione della galleria di immagini si utilizza Windows Live Writer che è un software gratuito per Windows che ci consente di confezionare articoli per il blog in modo ottimale. In questo caso lo utilizzeremo solo come Editor WYSIWYG che è l'acronimo di una espressione inglese che può essere tradotta come "ottieni quello che vedi". In sostanza opera una conversione dell'aspetto del layout in linguaggio HTML che poi sarà letto dai browser.

WLW può anche essere sostituito da altri programmi più professionali ma in questo caso mi rivolgo esclusivamente ai blogger dilettanti che non hanno molta pratica di linguaggio di programmazione. Occorre innanzitutto postare le foto della galleria su Picasa Web Album per poi ottenerne l'hotlink. Ho pubblicato su Youtube un video tutorial che poi illustrerò anche testualmente

Dopo aver aperto WLW si può iniziare a scrivere nel corpo del post il nome della Galleria. Questo può essere utile se per esempio vogliamo inserire nella stessa pagina più gallerie che si riferiscono ciascuna a una certa etichetta del blog. Per un sito di motori per esempio si può creare una galleria per le moto, una per le auto commerciali e un'altra per le auto sportive. Una caratteristica di WLW è quella che consente di inserire delle tabelle che sono l'ideale per mettere le immagini in una griglia predeterminata

In ciascuna cella della tabella va inserita una immagine andando su Inserisci > Immagine > Dal Web. Si incolla l'URL della immagine ottenuta da Picasa e si va nuovamente su Inserisci

Ciascuna immagine va collegata a un determinato URL che può essere quello del post a cui si riferisce. Si seleziona l'immagine e si va su Collegamento ipertestuale. Si incolla l'URL e si termina andando su Inserisci. La Galleria di foto prenderà quindi forma. Per portarla in una pagina statica si deve andare in basso su Origine e copiare l'HTML della galleria andando sul destro del mouse quindi su Seleziona tutto e su Copia. Il codice va incollato nella pagina statica o nel post in modalità HTML. Infine si pubblica.

E' opportuno anche inserire dei titoli per ciascuna miniatura e eventualmente fare il modo che il collegamento si apra in un'altra scheda. Si può anche creare uno sfondo alla galleria utilizzando un attributo delle tabelle. E' anche opportuno usare l'HTML in Origine per calibrare bene l'altezza e la larghezza di ciascuna miniatura operando sui numeri di width e height

Il codice per inserire un colore di sfondo nella galleria è

bgcolor="#ddddff;"

che deve essere incollato prima del tag di chiusura di table come mostrato nello screenshot. Il codice del colore può naturalmente essere scelto a piacere. Per centrare le immagini nel layout basta incollare prima di <table … il codice <div align="center"> e il codice </div> dopo </table>.

Si può anche fare a meno di usare la tabella e inserire le immagini una di seguito all'altra intervallate da un certo numero di spazi. Per l'inserimento della immagine va scelta la modalità In linea con il testo.