Widget degli Ultimi Post per Etichetta con Miniature per Blogger.

Comer installare il widget degli ultimi post per etichetta con miniature in un blog della piattafoma Blogger.

Propongo un nuovo gadget degli Ultimi Articoli riferiti a una determinata etichetta. Sarà visualizzato in verticale insieme alle miniature delle immagini eventualmente presenti nel post. Il widget assumerà lo stile degli elenchi del blog così come erediterà i colori dei link normali, di quelli già visitati e di quelli puntati con il mouse. Ho pubblicato in rete una dimostrazione del gadget

               Demo del widget degli Ultimi Post per una singola etichetta con miniature -

Ricordo comunque che ho già pubblicato un altro widget analogo e che quindi si può scegliere tra i due in funzione della compatibilità o meno con il nostro template o di una maggiore sintonia estetica. Nella demo si vedono dei puntini a lato delle miniature che sono ereditati dallo stile del blog in cui l'ho installato. Questo non significa che l'elenco dei post sarà visibile nello stesso modo anche in un blog con un altro modello

Facendo riferimento alla nuova interfaccia di Blogger e ricordando che a breve la vecchia non sarà più disponibile ecco le istruzioni per l'installazione del widget. Si va su Modello < Backup/Ripristino > Scarica modello completo per un backup di sicurezza. Successivamente si va sempre su Modello > Modifica HTML > Procedi e, pigiando F3 o Ctrl+F, si cerca la riga  ]]></b:skin>. Per inciso ricordo che alcune volte in questa riga va a finire anche la parentesi graffa che chiude il CSS precedente diventando così }]]></b:skin>. In questo caso bisogna ricordarsi di inserire il cursore subito dopo la parentesi graffa e cliccare su Invio per separarla. Subito prima della riga colorata di rosso incollare i seguenti fogli di stile 

/* Ultimi Post per Etichetta */
img.label_thumb{
float:left;
border:1px solid #7e7e7e; /* Colore del bordo delle miniature */ margin-right:10px !important;
height:55px; /* Altezza delle miniature */
width:55px; /* Larghezza delle miniature */
}
.label_with_thumbs {
float: left;
width: 100%;
min-height: 70px; /* Altezza elemento */
margin: 0px 10px 2px 0px;
padding: 0;
}
ul.label_with_thumbs li {
padding:8px 0;
min-height:70px;
margin-bottom:10px;
}
.label_with_thumbs a {}
.label_with_thumbs strong {padding-left:0px;}

I parametri colorati di rosso possono essere modificati secondo il significato specificato nei commenti a fianco colorati di verde. Adesso occorre cercare la riga </head> e, subito prima, incollare quest'altro codice che ho pubblicato su Google Documenti 

• Codice Javascript del gadget degli Ultimi Post per Etichetta -

Nel codice è presente l'URL della immagine di default che viene visualizzata quando non ne è presente nessuna all'interno del post. Tale URL può essere sostituito da quello di un'altra immagine quadrata che abbiamo precedentemente caricato su un hosting quale Picasa.

Si salva il modello. Si va su Layout > Aggiungi un gadget > HTML/Javascript e si incolla questo ultimo codice

<script type='text/javascript'>
var numposts = 4;
var showpostthumbnails = true;
var displaymore = false;
var displayseparator = true;
var showcommentnum = false;
var showpostdate = false;
var showpostsummary = true;
var numchars = 100;
</script>
<script type="text/javascript" src="/feeds/posts/default/-/nome-etichetta?published&alt=json-in-script&callback=labelthumbs"></script>

dove al posto di nome-etichetta si inserisce il tag di cui vogliamo visualizzare gli ultimi articoli. Nella demo iniziale per questa etichetta ho scelto "blogger". Si clicca su Salva e si posiziona l'elemento nel punto prescelto della sidebar. I parametri hanno il seguente significato

1. var numposts                   : numero degli articoli da visualizzare
2. var showpostthumbnails   : mostrare le miniature (true), non mostrarle (false)
3. var displaymore               : mostrare o non mostrare il link del Read More (true o false)
4. var displayseparator      : mostrare o no un separatore tra gli elementi (true o false)
5. var showcommentnum    : mostrare o non mostrare il numero dei commenti (true o false)    
6. var showpostdate            : mostrare o non mostrare la data dei post (true o false)
7. var showpostsummary      : mostrare o non mostrare l'incipit dei post (true o false)
8. var numchars                   : il numero dei caratteri dell'incipit degli articoli (100)

Se volete visualizzare gli ultimi post di una etichetta formata da due parole divise da uno spazio bisogna usare i caratteri %20. Se per esempio vogliamo creare il widget per il tag primi piatti occorre inserire al posto di nome-etichetta l'espressione primi%20piatti. Ricordo infine che le etichette sono case sensitive e che quindi le minuscole sono considerate diverse dalle maiuscole.