Come inserire il widget degli ultimi articoli con miniature sopra l'area del post.

Mi sono già occupato di questo gadget in altri due articoli

• Widget degli ultimi post con miniature -
• Widget degli ultimi articoli con miniature in orizzontale -

adesso ho tradotto lo script e lo ripropongo nella versione per inserirlo in orizzontale subito sotto all'header. La particolarità di questo gadget è che non bisogna andare in Layout > Modifica HTML per modificare il modello ma si fa tutto attraverso l'inserimento di un elemento pagina HTML/Javascript.
Widget degli ultimi articoli con miniature in orizzontale -
Considerate il seguente codice

<table style="background-color: #ffffff;">
<tr>
<td style="margin-left: 20px; margin-top: 10px;" align="left"><script language="JavaScript">
imgr = new Array();
imgr[0] = "http://tinyurl.com/oj827g";
imgr[1] = "http://tinyurl.com/qzptmk";
imgr[2] = "http://tinyurl.com/ok629f";
imgr[3] = "http://tinyurl.com/omglru";
imgr[4] = "http://tinyurl.com/q4wtpo";
showRandomImg = false;
tablewidth = 900;
cellspacing = 7;
borderColor = "#ffffff";
bgTD = "#ffffff";
imgwidth = 113;
imgheight = 100;
fntsize = 12;
acolor = "#666";
aBold = true;
icon = " ";
text = "comments";
showPostDate = true;
summaryPost = 0;
summaryFontsize = 11;
summaryColor = "#666";
icon2 = "  ";
numposts =5;
home_page = "http://miosito.blogspot.com/";
</script>
<script src="http://sites.google.com/site/ideepercomputeredinternet/script-1/scriptminiatureorizzontali.js" type="text/javascript"></script>
</td>
</tr>
</table>
<a href='http://parsifal32.blogspot.com/2010/01/come-inserire-il-widget-degli-ultimi.html' style='display:none;'>Widget ultimi articoli con miniature</a><a href='http://parsifal32.blogspot.com/' style='display:none;'>Idee per computer ed internet</a>

Le personalizzazioni da fare sono le seguenti

1. #ffffff nella prima riga è il colore di background della tabella in cui sono inserite le miniature
2. Gli URL del tipo http://tinyurl.com/oj827g rappresentano gli indirizzi di immagini che vengono visualizzate nel caso nei post non ne siano presenti nessuna. Se abbiamo un blog di cucina possono essere sostituite da immagini di ricette mentre se abbiamo un blog di motori da immagini di auto o di moto. Basta caricarle su un hosting tipo Skydrive, acquisirne l'indirizzo e sostituirle a le cinque proposte che sono foto di albe, tramonti e natura in genere.
3. 900 è la larghezza del widget che dovrà essere uguale o inferiore al main-wrapper del vostro blog; non può cioè essere più largo dell'area in cui vengono inseriti i post.
4. 113 e 100 sono rispettivamente la larghezza e l'altezza delle singole miniature e sono nella proporzione 4:3 che è la più usata nei formati di foto. Ovviamente questi numeri possono essere modificati a seconda delle esigenze
5. 7 sono i pixel che devono intercorrere tra una miniatura e l'altra (cellspacing), cioè lo spazio tra di loro che può essere variato a piacere
6. 5 è il numero delle miniature e quindi dei post che volete vengano visualizzati. Questo numero può essere calcolato considerando quanto è largo il widget (in questo caso 900 pixel), quante sono larghe le miniature (nel codice mostrato sono 113 pixel) e di quanto è la distanza tra di loro (è stato messo cellpasing=7)
7. #ffffff è il colore del bordo delle miniature, in questo caso lasciato trasparente
8. http://miosito.blogspot.com è la personalizzazione più importante e rappresenta l'URL del blog da cui acquisire i feed.

Dopo aver personalizzato il codice andate su Layout > Elementi pagina > HTML/Javascript > Aggiungi un gadget e incollatelo in Sezioni del sito, senza inserire titolo, quindi posizionatelo con il mouse subito sotto l'header o comunque sopra il post.

Se volete vedere una demo andate su Photos and Videos.