Widget della nuvola dei commentatori (Nuova versione).

Come installare in Blogger il widget dei Top Commentatori (o Commentatori più assidui) in ordine di frequenza o alfabetico.

Il gadget dei commentatori più assidui in versione nuvola che ho presentato quasi due anni ha avuto un grande successo tra i lettori e sono stati molti quelli che lo hanno installato con successo e soddisfazione. Si tratta in un certo senso di premiare con un link al Profilo (di Blogger o di Google Plus) i frequentatori del blog che attraverso i loro commenti contribuiscono ad arricchire il nostro sito.

L'aspetto del widget ricorda quello della nuvola di etichette, gadget ufficiale di Blogger, e le dimensioni dei caratteri dei commentatori sono proporzionali al numero di commenti postati. Si prendono in considerazione solo gli ultimi 2000 commenti quindi coloro che hanno commentato il blog in passato ma ora non lo fanno più non saranno visibili. E' anche possibile filtrare i nomi utenti in modo per esempio da non mostrare i commenti fatti dagli anonimi e quelli inseriti dal proprietario del blog.

Questa nuova versione del gadget dei Top Commentatori ha questo aspetto

Il primo screenshot è stato preso da un blog con una sidebar più stretta mentre il secondo è stato inserito in una sidebar più larga. I colori dei link vengono ereditati da quelli del blog mentre il colore di background può essere scelto in funzione degli altri colori del nostro sito. I bordi arrotondati non saranno visibili come è noto con Internet Explorer 9 e versioni precedenti (lo saranno con IE10 quando sarà finalmente rilasciato verso la fine dell'anno).

Come vedete non sono riuscito a limitare le dimensioni dei caratteri commentatori, nel mio caso commentatrici, che hanno un numero di commenti molto elevato. Questo può portare a degli inestetismi specialmente nel caso in cui il nick fose formato da due o tre parole. Si può comunque sempre procedere a filtrare questi super commentatori avendo cura di spiegarli la ragione per evitare fraintendimenti.

Per l'installazione occorre avere un account Yahoo che comunque ci si può sempre procurare cliccando su Registrati accanto a Entra. Si va su Layout > Aggiungi un gadget > HTML/Javascript e si incolla il codice

<div style="-moz-border-radius: 15px; -webkit-border-radius: 15px; background-color: #f4cbc6; border-radius: 15px; border: 3px solid #eeb1aa; padding: 6px 4px 0px 4px; width: 100%;"><div style="text-align:justify; line-height:1.2;"><p><script type="text/javascript">
function commentatori_nuvola(feed) {
max = 0;
min = 10000;
for (i=0;i<feed.count;i++)
{
commentatori_elementi = feed.value.items[i].commentcount * 1;
if (commentatori_elementi > max)
{
max = commentatori_elementi;
}
if (commentatori_elementi < min)
{
min = commentatori_elementi;
}
}
commentatori_items = "";
display = "";
for (nuvola_c=0;nuvola_c<feed.count;nuvola_c++)
{
nuvola_parent = feed.value.items[nuvola_c].commentcount - min;
nuvola_dim = 110 + (nuvola_parent * 130) / (max - min) + "%";
nuvola_author = "'" + feed.value.items[nuvola_c].authorurl + "'";
commentatori_items = "(" + feed.value.items[nuvola_c].commentcount + ")";
commentatori_ID = feed.value.items[nuvola_c].title + commentatori_items;
commentatori_2ID = "<a style='text-decoration:none;font-size:" + nuvola_dim + "' href=" + nuvola_author + " target='_blank'>" + commentatori_ID + " </a>";
display = display + commentatori_2ID;
}
document.write(display);
document.write('<div style="font-size:60%;text-align:right"><p><a href="http://goo.gl/KC0ey">Get widget</a></div>');
}
</script>
<script src="http://pipes.yahoo.com/pipes/pipe.run?
YourBlogUrl=http://www.ideepercomputeredinternet.com
&Exclusions=Anonymous,Ernesto Tirinnanzi&_callback=commentatori_nuvola
&ShowHowMany=40
&Order=alphabet&_id=1bb66fb58abea90ae049e765f02a91c1&_render=json"
type="text/javascript"></script></p></div></div>

Si va su Salva e si posiziona nella sidebar con il mouse. Le personalizzazioni riguardano:

1. 15px; rappresenta il raggio di curvatura degli angoli arrotondati. Si deve inserire sempre lo stesso valore per tutti i browser
2. background-color: #f4cbc6; è il colore di sfondo del widget e può essere scelto in base allo stile del nostro blog. Si può consultare il post sui codici dei colori.
3. border: 3px solid #eeb1aa; determina lo stile e il colore del bordo. Per inserire un colore del bordo intonato con quello di sfondo si può usare il tool Oto255
4. padding: 6px 4px 0px 4px; rappresentano le distanze tra i nomi dei commentatori e il bordo. La prima è la distanza dalla parte alta (6px) e così via per le altre direzioni procedendo in senso orario.
5. width: 100%; è la percentuale della sidebar che si vuole utilizzare per il widget. Può essere necessario diminuirne il valore nel caso il cui il gadget andasse fuori dal layout
6. line-height:1.2; rappresenta la dimensione verticale delle righe di testo. Se si diminuisce questo valore (p.e. mettendo 1.1) i nick dei commentatori saranno più vicini in senso verticale.
7. In YourBlogUrl va inserito l'URL del nostro blog senza slash finale
8. In Exclusions vanno messi i nick da filtrare separati da una virgola. Si possono anche inserire nick formati da due o tre parole. Non mettere però degli spazi dopo le virgole.
9. ShowHowMany=40 rappresenta il numero dei Top Commentatori che vogliamo visualizzare mentre Order=alphabet indica l'ordine alfabetico che può essere sostituito da frequency se si preferisce quello per numero di commenti postati.

La stringa alfanumerica colorata di viola si ottiene nel solito modo. Si accede al Pipe di Yahoo relativo a questo widget dopo essersi loggati con il nostro account. Si va sul pulsante Clone e si modificano i dati relativi all'URL del blog, ai nomi da filtrare separati da una virgola e al tipo di ordinamento (alphabet o frequency). Si clicca su Run Pipe. In basso dovreste vedere tutti i vostri commentatori più assidui

Nella barra degli indirizzi del browser o anche direttamente nella pagina copiate l'ID del Pipe, evidenziato di verde nello screenshot e sostituitelo a quello del codice. Cliccando sul nick di un commentatore si accederà al suo Profilo su Blogger o a quello su Google Plus se li ha riunificati.

• Demo della nuvola dei commentatori -

Aggiornamento: Per configurare meglio le dimensioni massime e minime dei caratteri dei nomi degli utenti consultate l'ultimo post che ho dedicato ai Top Commentatori.