Ya he publicado con anterioridad varios gadgets para mostrar las entradas más comentadas, algunos ya con varios años de antigüedad, otros un poco más nuevos pero el de hoy es un gadget muy nuevo (de hecho es del 2015) y se ve la siguiente manera:

Nuevo gadget de posts más comentados para Blogger

Nuevo-gadget-de-posts-más-comentados-para-Blogger

Demo del Truco

 

Para agregar este gadget a tu blog de Blogger solo debes ir a Diseño, Añadir gadget, HTML/JavaScript y pegar allí el siguiente código:

<div id="most-comments"></div>
<style scoped='' type='text/css'>
#most-comments li,#most-comments ul,#most-comments ul li{margin:0;list-style:none;color:#444;font-family:'Open Sans',Helvetica,Arial,sans-serif;font-size:14px}#most-comments ul li{position:relative;overflow:hidden;background:#fff;margin:3.5px 0;padding:7px 10px 7px 50px;white-space:nowrap;text-overflow:ellipsis;box-shadow:inset 0 0 #fc4f3f;border:1px solid #e6e6e6;transition:all .6s}#most-comments ul li:hover{box-shadow:inset 310px 0 #fc4f3f}#most-comments ul li a{color:#444;font-weight:700;text-decoration:none;transition:all .3s}#most-comments ul li a:hover,#most-comments ul li:hover a{color:#fff}.count-most{position:absolute;left:0;top:0;width:40px;height:100%;margin:0;padding:7px 0;background-color:#383838;color:#fff!important;text-align:center;transition:all .3s}#most-comments ul li:hover .count-most{background-color:#fc4f3f}
</style>
<script type='text/javascript'>
//<![CDATA[
var numPosts=10;
var homePage="www.miltrucosblogger.com";
var postTitlear=new Array();
var postUrlar=new Array();
var postCommentar=new Array();
var totalpost;document.write('<div id="most-comments"><ul>');
function mostComment(j){var a=j.feed.entry.length;totalpost=a;
for(var f=0;f<a;f++){
var h=j.feed.entry[f];
var c=h.title.$t;var b;
var g;if(f==j.feed.entry.length){break}
for(var d=0;d<h.link.length;d++){
if(h.link[d].rel=="alternate"){g=h.link[d].href;break}}
for(var d=0;d<h.link.length;d++){
if(h.link[d].rel=="replies"&&h.link[d].type=="text/html"){b=h.link[d].title.split(" ")[0];}};
postTitlear.push(c);
postUrlar.push(g);
postCommentar.push(b)}sortPosts();
for(var f=0;f<numPosts;f++){var e='<li><span class="count-most">'+postCommentar[f]+'</span><a href="'+postUrlar[f]+'" title="'+postTitlear[f]+'" target="_blank">'+postTitlear[f]+'</a>';
document.write(e)}}
function sortPosts(){function c(d,f){var e=postTitlear[d];
postTitlear[d]=postTitlear[f];
postTitlear[f]=e;
var e=postUrlar[d];
postUrlar[d]=postUrlar[f];
postUrlar[f]=e;
var e=postCommentar[d];
postCommentar[d]=postCommentar[f];
postCommentar[f]=e}
for(var b=0;b<postTitlear.length-1;b++){
for(var a=b+1;a<postTitlear.length;a++){
if(parseInt(postCommentar[b])<parseInt(postCommentar[a])){c(b,a)}}}}
document.write('<script src="http://'+homePage+'/feeds/posts/default?max-results=9999&orderby=published&alt=json-in-script&callback=mostComment"><\/script>');
document.write('</li>')
document.write('</ul>')
document.write('</div>');
//]]>
</script>

 

Ahora solo queda reemplazar www.miltrucosblogger.com por la URL de tu blog (en el mismo formato que está señalado, eso quiere decir sin las http://).

Espero que este truco te haya sido de utilidad, no olvides comentar si tienes alguna duda al respecto y por favor comparte esta entrada en tus redes sociales.

Vía/ArlinaDesign
Categorías: Comentarios

9 comentarios

Joz · abril 23, 2015 a las 6:53 am

no se visualiza nada… cambie la url y nada

    Juvinao · abril 23, 2015 a las 8:44 pm

    Joz acabo de probar el truco y se ve muy bien 😀

ggeorgelys · abril 23, 2015 a las 4:45 pm

Me encanta!!!. ese efecto esta muy interesante
Pero se podría cambian para que en vez de los post mas comentados.. salga los post mas visitados?

    Juvinao · abril 23, 2015 a las 8:45 pm

    Creo que se puede darle ese estilo al gadget, voy a probar y te cuento amigo 😉

    Saludos

Joz · abril 23, 2015 a las 10:44 pm

Hola amigo… disculpa en verdad me encanto este gadget y aun no se por que no se visualiza, si en todas mi entradas almenos tengo un comentario 🙂 . Podrias apoyarme? por favor 🙂

Joz · abril 23, 2015 a las 11:09 pm

Bueno… ya no es necesaria la ayuda…. de tanto buscar ya encontre el error o mi error 🙂 saludos 😉

    Juvinao · abril 24, 2015 a las 4:47 pm

    Joz que bueno que ya hayas solucionado el problema.

    Saludos 🙂

antonio · junio 26, 2015 a las 8:39 am

me gusto mucho gracias de verdad pero no quiero que abra en otra pagina al entrar algun post, quiero que abra dentro del mismo blog como hago?

    Juvinao · junio 28, 2015 a las 9:09 pm

    Hola Antonio, habría que hacer unas pequeñas modificaciones al código, los hago y te aviso 😉

Responder a antonio Cancelar la respuesta

Marcador de posición del avatar

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *