Widget degli Ultimi Post di Blogger in un box scorrevole.

Widget scorrevole in verticale degli ultimi post per Blogger

Continuo nella presentazione di widget per abbellire il nostro blog su Blogger e per renderlo più usabile da parte dei visitatori. E' innegabile che mostrare gli Ultimi Articoli che si sono pubblicati serve per invogliare il lettore a leggeri e quindi a farlo rimanere più a lungo sul nostro sito. Ho presentato diversi gadget che mostrano i post più recenti che si sono pubblicati con un aspetto minimalista o estremamente suggestivo.

Questo che vado a illustrarvi ha sicuramente il pregio di essere originale e certamente sono pochissimi i blog che ne hanno uno simile. Si tratta infatti di un widget che mostra i titoli degli ultimi post in un rettangolo scorrevole. Si possono mostrare anche i riassunti e scegliere il numero di post che si vogliono vedere scorrere; si possono anche modificare a piacere la velocità dello scorrimento e l'altezza del widget.

• Demo del widget scorrevole degli Ultimi Articoli - 

Si può anche configurare il colore di sfondo del rettangolo che assumerà automaticamente la larghezza della sidebar in cui sarà installato. Li widget interromperà lo scorrimento se ci si passerà sopra con il mouse per riprenderlo quando si toglierà.

Sotto a ogni articolo si visualizzerà il link per poterlo aprire. Si può installare senza modificare il modello andando su Design > Aggiungi un gadget > HTML/Javascript e incollando questo codice in Sezioni del Sito dopo aver inserito un titolo a piacere

<div id="widgclass" style="text-align:center;"><script
src="https://sites.google.com/site/scriptperilblog/javascript-2/ultimi-post-slidebox.js"></script>
<script language="javascript">
var numeropost = 8;
var speed = 2;
var sommario = true;
var numerocaratteri = 100;
var widalt = 250;
var IPCEIart = false;
</script>
<script src="http://www.ideepercomputeredinternet.com/feeds/posts/default?
orderby=published&alt=json-in-script&callback=showrecentposts">
</script></div>
<style>.titolo{font-weight:bold;margin-top:12px;}.more{margin-bottom:10px;padding:12px;}.data{}.contenuto{}#widgclass{padding-bottom:2px; background-color:#DDEEFF;
padding:4px;border:1px solid #003366;}</style>

Le personalizzazioni riguardano i seguenti elementi:

1. In numeropost = 8; si seleziona il numero di articoli che intendiamo vedere scorrere nel widget 
2. In speed = 2; si configura la velocità di scorrimento. A numero più alto corrisponde velocità più alta
3. var sommario = true; per mostrare anche il riassunto dei post. Se non lo si vuole vedere, si sostituisce true con false.
4. In numerocaratteri = 100; si imposta il numero dei caratteri del sommario se è stato impostato con true.
5. Al posto dell'URL di questo blog va inserito quello del vostro.
6. Si può anche scaricare il file javascript, modificarlo con Notepad++, caricarlo su Google Sites con la modalità Schedario o su DropBox per poi ottenerne l'hotlink da sostituire a quello del codice. Si possono così modificare l'espressione Leggi tutto>> e altri parametri
7. Si possono calibrare le distanze all'interno dell'elemento modificando i margini e il padding 
8. In widalt = 250; si inserisce l'altezza del widget
9. background-color:#DDEEFF; rappresenta il colore di background del widget (#FFFFFF; per avere sfondo bianco)
10. border:1px solid #003366; contiene i parametri che determinano lo stile del bordo
11. Se si cambia il feed di tutto il blog con quello degli ultimi articoli per una singola etichetta che sarà di questo tipo
    www.ideepercomputeredinternet.com/feeds/posts/default/-/etichetta?…
    si potrà visualizzare lo scorrimento degli ultimi post riferiti a una singola categoria.

Dopo aver salvato l'elemento HTML, si può posizionare a piacere con il mouse.