Il widget degli articoli recenti con miniature e sommario per blog su Blogger.

Widget degli Articoli Recenti con miniature per Blogger.

Qualche giorno fa ho presentato il widget degli ultimi articoli con miniature in senso verticale, qualche giorno prima quello degli articoli recenti con miniature in orizzontale, adesso voglio proporre un'alternativa che è personalizzabile più facilmente e si presta a ulteriori sviluppi come vedremo nel post successivo.

Come i due precedenti widget, anche in questo caso non si va a modificare direttamente il modello ma si inserisce soltanto un nuovo elemento pagina, andiamo però per gradi. Occorrerà personalizzare questo codice

<script type="text/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 = true;
tablewidth = 280;
cellspacing = 1;
borderColor = "#ffffff";
bgTD = "#ffffff";
imgwidth = 120;
imgheight = 120;
fntsize = 12;
acolor = "#191919";
aBold = true;
icon = " • ";
text = "Commenti";
showPostDate = false;
summaryPost = 70;
summaryFontsize = 10;
summaryColor = "#242424";
icon2 = " → ";
numposts = 6;
rc_feedLink = "http://demo-parsifal32.blogspot.com/feeds/posts/default";
</script>
<script src="http://sites.google.com/site/ideepercomputeredinternet/script-1/articolirecenticonminiature1.js" type="text/javascript"></script>

Le personalizzazioni riguardano i seguenti elementi

1. imgr[0] , imgr[1], ecc rappresentano le immagini casuali che vengono visualizzate come miniature nel caso non ce ne siano nei post. Gli URL inseriti da me sono relativi a immagini di albe e tramonti e possono essere cambiate con altre più attinenti
2. showRandomImg = true; se si vogliono mostrare le immagini casuali altrimenti sostituire true con false. Nel caso di blog con immagini in tutti i post.
3. tablewidth = 280; rappresenta la larghezza del widget
4. cellspacing = 1;  è la distanza tra le celle della tabella verticale
5. borderColor = "#ffffff";  è il colore del bordo
6. bgTD = "#ffffff";  è il colore di sfondo del widget
7. imgwidth = 120;  è la larghezza della miniatura
8. imgheight = 120;  è l'altezza della miniatura
9. fntsize = 12;  è la dimensione dei caratteri del Titolo del post
10. acolor = "#191919";  è il colore del testo del Titolo del post
11. aBold = true; significa che il titolo è in grassetto, se non si vuole in grassetto bisogna sostituire true con false
12. icon = " • ";  e icon2 = " → "; rappresentano le icone che si visualizzeranno rispettivamente prima del Titolo e prima del Sommario. Si possono sostituire con altri simboli oppure lasciare lo spazio vuoto se non ci piacciono
13. text = "Commenti";  è il testo che sarà visualizzato accanto al numero dei commenti. Se non vogliamo nessun testo basta lasciare text = " "; 
14. summaryPost = 70;  rappresenta il numero dei caratteri del sommario del post
15. summaryFontsize = 10;  è la dimensione dei caratteri del sommario
16. summaryColor = "#242424";  è il colore del testo del Sommario dell'articolo
17. numposts = 6;  è il numero degli articoli che si vogliono visualizzare nel widget
18. rc_feedLink = "http://demo-parsifal32.blogspot.com/feeds/posts/default"; qui dovete inserire l'URL dei feed del vostro blog. Se avete un blog su Blogger basterà sostituire la parte evidenziata di verde

Dopo aver fatto tutte le modifiche andate su Layout > Elementi pagina > Aggiungi un gadget > HTML/Javascript e incollate il codice in Sezioni del sito, mettete come titolo una cosa tipo "ULTIMI ARTICOLI" o "ARTICOLI RECENTI" e cliccate su Salva.





Per vedere questo gadget in azione potete andare nella pagina dedicata agli "articoli recenti con miniature e sommario" del mio blog di prova.


Importante: Se avete un dominio personalizzato cioè del tipo www.miodominio.com, il widget non funzionerà. Dovrete scaricare il javascript con l'URL colorato di blu e caricalo nella cartella Public di Dropbox.


Aggiornamento n° 1: Per non inserire il numero dei commenti consultate questo post