15 julio 2012

Top de Comentaristas con Avatar redondo para Blogger

Top de Comentaristas

Hace tiempo os dejé un top de comentaristas aquí pero resulta que algunos me habéis comentado que no marcha bien.

Pues bien, en esta ocasión os lo traigo con imagen (avatar redondo), es un gadget que muestra el nombre de los que más comentan en vuestros blog, y el enlace del nombre de cada comentarista lleva directamente a su perfil de Blogger.

Es fácil de instalar y no hay que modificar nada, tan solo copiar el código y pegarlo en un gadget HTML/JAVA .

Muestra los 8 comentaristas más activos, con el número total de comentarios realizados en vuestro blog. Se excluyen los comentarios anónimos y propios si se desea, (ver negrita)

CÓDIGO
<style type="text/css">
.top-commenter-line {margin: 3px 0;}
.top-commenter-line .profile-name-link {padding-left:0;}
.top-commenter-avatar {width: 32px;height: 32px;background-position: center;margin: 3px 3px 0 0;padding: 2px;border: #CCC solid thin;-webkit-border-radius: 4px;-moz-border-radius: 4px;border-radius: 4px;-moz-box-shadow: inset 0 0 3px #F0F0F0;-webkit-box-shadow: inset 0 0 3px #F0F0F0;box-shadow: inset 0 0 3px #CCC;border-image: initial;-webkit-border-radius:100px;-moz-border-radius:100px;border-radius:100px;vertical-align:middle;}
</style>
<script type="text/javascript">
//
CONFIG:
var maxTopCommenters = 8; // numero de comentaristas a mostrar
var minComments = 1;
var numDays = 0;
var excludeMe = true;
var excludeUsers = ["Anonymous", "tunombre"]; // excluir estos nombres
var maxUserNameLength = 42;
var txtTopLine = '<b>[#].</b> [image] [user] ([count])';
var txtNoTopCommenters = '';
var txtAnonymous = '';
var sizeAvatar = 28;
var cropAvatar = true;
//
var urlNoAvatar = "http://lh4.googleusercontent.com/-069mnq7DV_g/TvgRrBI_JaI/AAAAAAAAAic/Iot55vywnYw/s"+sizeAvatar+"/avatar_blue_m_96.png"; // http://www.blogger.com/img/avatar_blue_m_96.png resizeable
var urlAnoAvatar = 'http://www.gravatar.com/avatar/00000000000000000000000000000000?d=mm&s=' + sizeAvatar;
var urlMyProfile = '';
var urlMyAvatar = '';
if(!Array.indexOf) {
Array.prototype.indexOf=function(obj) {
for(var i=0;i<this.length;i++) if(this[i]==obj) return i;
return -1;
}}
function replaceTopCmtVars(text, item, position)
{
if(!item || !item.author) return text;
var author = item.author;
var authorUri = "";
if(author.uri && author.uri.$t != "")
authorUri = author.uri.$t;
var avaimg = urlAnoAvatar;
var bloggerprofile = "http://www.blogger.com/profile/";
if(author.gd$image && author.gd$image.src && authorUri.substr(0,bloggerprofile.length) == bloggerprofile)
avaimg = author.gd$image.src;
else {
var parseurl = document.createElement('a');
if(authorUri != "") {
parseurl.href = authorUri;
avaimg = 'http://www.google.com/s2/favicons?domain=' + parseurl.hostname;
}
}
if(urlMyProfile != "" && authorUri == urlMyProfile && urlMyAvatar != "")
avaimg = urlMyAvatar;
if(avaimg == "http://img2.blogblog.com/img/b16-rounded.gif" && urlNoAvatar != "")
avaimg = urlNoAvatar;
var newsize="s"+sizeAvatar;
avaimg = avaimg.replace(/\/s\d\d+-c\//, "/"+newsize+"-c/");
if(cropAvatar) newsize+="-c";
avaimg = avaimg.replace(/\/s\d\d+(-c){0,1}\//, "/"+newsize+"/");
var authorName = author.name.$t;
if(authorName == 'Anonymous' && txtAnonymous != '' && avaimg == urlAnoAvatar)
authorName = txtAnonymous;
var imgcode = '<img class="top-commenter-avatar" height="'+sizeAvatar+'" width="'+sizeAvatar+'" title="'+authorName+'" src="'+avaimg+'" />';
if(authorUri!="") imgcode = '<a href="'+authorUri+'">'+imgcode+'</a>';
if(maxUserNameLength > 3 && authorName.length > maxUserNameLength)
authorName = authorName.substr(0, maxUserNameLength-3) + "...";
var authorcode = authorName;
if(authorUri!="") authorcode = '<a class="profile-name-link" href="'+authorUri+'">'+authorcode+'</a>';
text = text.replace('[user]', authorcode);
text = text.replace('[image]', imgcode);
text = text.replace('[#]', position);
text = text.replace('[count]', item.count);
return text;
}
var topcommenters = {};
var ndxbase = 1;
function showTopCommenters(json) {
var one_day=1000*60*60*24;
var today = new Date();
if(urlMyProfile == "") {
var elements = document.getElementsByTagName("*");
var expr = /(^| )profile-link( |$)/;
for(var i=0 ; i<elements.length ; i++)
if(expr.test(elements[i].className)) {
urlMyProfile = elements[i].href;
break;
}
}
if(json && json.feed && json.feed.entry && json.feed.entry.length) for(var i = 0 ; i < json.feed.entry.length ; i++ ) {
var entry = json.feed.entry[i];
if(numDays > 0) {
var datePart = entry.published.$t.match(/\d+/g); // assume ISO 8601
var cmtDate = new Date(datePart[0],datePart[1]-1,datePart[2],datePart[3],datePart[4],datePart[5]);
var days = Math.ceil((today.getTime()-cmtDate.getTime())/(one_day));
if(days > numDays) break;
}
var authorUri = "";
if(entry.author[0].uri && entry.author[0].uri.$t != "")
authorUri = entry.author[0].uri.$t;
if(excludeMe && authorUri != "" && authorUri == urlMyProfile)
continue;
var authorName = entry.author[0].name.$t;
if(excludeUsers.indexOf(authorName) != -1)
continue;
var hash=entry.author[0].name.$t + "-" + authorUri;
if(topcommenters[hash])
topcommenters[hash].count++;
else {
var commenter = new Object();
commenter.author = entry.author[0];
commenter.count = 1;
topcommenters[hash] = commenter;
}
}
if(json && json.feed && json.feed.entry && json.feed.entry.length && json.feed.entry.length == 200) {
ndxbase += 200;
document.write('<script type="text/javascript" src="http://'+window.location.hostname+'/feeds/comments/default?redirect=false&max-results=200&start-index='+ndxbase+'&alt=json-in-script&callback=showTopCommenters"></'+'script>');
return;
}
var tuplear = [];
for(var key in topcommenters) tuplear.push([key, topcommenters[key]]);
tuplear.sort(function(a, b) {
if(b[1].count-a[1].count)
return b[1].count-a[1].count;
return (a[1].author.name.$t.toLowerCase() < b[1].author.name.$t.toLowerCase()) ? -1 : 1;
});
var realcount = 0;
for(var i = 0; i < maxTopCommenters && i < tuplear.length ; i++) {
var item = tuplear[i][1];
if(item.count < minComments)
break;
document.write('<di'+'v class="top-commenter-line">');
document.write(replaceTopCmtVars(txtTopLine, item, realcount+1));
document.write('</d'+'iv>');
realcount++;
}
if(!realcount)
document.write(txtNoTopCommenters);
}
document.write('<script type="text/javascript" src="http://'+window.location.hostname+'/feeds/comments/default?redirect=false&max-results=200&alt=json-in-script&callback=showTopCommenters"></'+'script>');
</script>


!!!!!! A DISFRUTARLO !!!!!!

12 comentarios

Colocado Antonio.
Funciona de maravillas.

Muchas gracias una vez más.
Saludos.

Yo tambien lo he colocado sustituyendo al que ya tenia por ti muchas gracias

gracias por compartir esto, una pregunta: como hacer que esta lista aparesca de forma horizontal?

¿Hay algún modo de personalizar los colores de los bordes o el número de comentaristas para mostrar?
Gracias!!

Pandora, el color del borde lo puedes modificar en esta parte: border: #ccc, pero el número de comentaristas no porque está en el script y para ello deberías modificar el script, subirlo a un hosting y colocar tu script.

Muchísimas gracias. Me sorprende lo rápido que contestas los comentarios. Así da gusto pasarse por un blog así. Mis felicitaciones por el gran trabajo que haces.

Un beso!!

Obrigada !!!!

Quieres hacer parceria?

besos

Muchas Gracias por compartir, me quedo super bien!

¡Hola!
Al ponerlo no aparece nada, sólo queda en blanco.
Me gustaría saber si estoy haciendo algo mal o qué.
Desde ya muchas gracias.

Belén esta entrada es antigua pero así y todo la he comprobado y aún sigue funcionando.
Copia bien todo el código, un solo signo que no copies es suficiente para que no te funcione.

I loved the main theme of this blog. It really helps me to foster the content building. DigitEMB

Este comentario ha sido eliminado por un administrador del blog.

Por favor, comente de acuerdo al tema del artículo.
Serán removidos todos los Comentarios con enlaces.
Si quieres recibir los nuevos comentarios marca "Avisarme"