Gadget de Entradas Populares por Etiqueta para Blogger

El gadget de entradas populares es de los mas usados en Blogger, pues con el se le muestra al usuario los posts mas visitados, en otras palabras las entradas más importantes del blog, pero el gadget que suministra Blogger solo muestra las entradas más visitadas de todo el blog, pero si tu quieres mostrar solo las entradas populares de una determinada etiqueta o categoría del blog con ese gadget no se puede hacer, es por ello que hoy te presento una sencilla solución a este problema, y es un Gadget de Entradas Populares por Etiqueta para Blogger.

El gadget de entradas populares se ve de la siguiente manera:

Para agregar este gadget a tu blog, solo debes ir a Diseño, Añadir gadget, HTML/JavaScript y pegar allí lo siguiente:

<div id="blCategorJTPope">
<script language='javascript'>
blJDireccion = "URL DE TU BLOG";
bletiqueta = "NOMBRE DE TU ETIQUETA";
blNumeroPostFilt=180;blCantidadJTPost=8;JTBe = false;
</script>
<style type="text/css">
<!--
#blCategorJTPope a {
background: url("http://4.bp.blogspot.com/-9tl97NsizkY/U9E6igugkQI/AAAAAAAAEWM/w7aBoVCdtb4/s1600/flecha.png") no-repeat scroll left 3px transparent;
color: #4A5C96;
font-family: Arial;
font-size: 13px;
line-height: 22px;
padding-left: 20px;
text-decoration: none;
}
#blCategorJTPope a:hover{
text-decoration: none;
color: #CC2200;
}
-->
</style>
<!-- No modificar a partir de aqui -->
<script type='text/javascript'>
var blJJTe2=new Array();var blJJTe4=new Array();var blJJTe1=new Array();var blJJTe3;function showrecentposts(j){var a=j.feed.entry.length;blJJTe3=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];break}}c=(JTBe)?"<b>"+c+"</b>":c;blJJTe2.push(c);blJJTe4.push(g);blJJTe1.push(b)}sortPosts();for(var f=0;f<blCantidadJTPost;f++){var e='<a href="'+blJJTe4[f]+'" class="recent-link">'+blJJTe2[f]+"</a><br/>";document.write(e)};document.write('<br/><a style="background:none;font-size:80%" href="http://goo.gl/4xVx" target="_blank"><img src="http://4.bp.blogspot.com/_Bvhqq3YFEx4/TTCEiNSRHgI/AAAAAAAAAv0/mEfnCXixTeQ/s320/varPost2.png"/></a>')}function sortPosts(){function c(d,f){var e=blJJTe2[d];blJJTe2[d]=blJJTe2[f];blJJTe2[f]=e;var e=blJJTe4[d];blJJTe4[d]=blJJTe4[f];blJJTe4[f]=e;var e=blJJTe1[d];blJJTe1[d]=blJJTe1[f];blJJTe1[f]=e}for(var b=0;b<blJJTe2.length-1;b++){for(var a=b+1;a<blJJTe2.length;a++){if(parseInt(blJJTe1[b])<parseInt(blJJTe1[a])){c(b,a)}}}}document.write('<script src="'+blJDireccion+"feeds/posts/default/-/"+bletiqueta+"?max-results="+blNumeroPostFilt+'&orderby=published&alt=json-in-script&callback=showrecentposts"></script>')</script>
</div><!-- Fin EtiquetasPopular -->

Hay algunos aspectos que debes personalizar, a continuación los explico.

blJDireccion = «URL DE TU BLOG«;
bletiqueta = «NOMBRE DE TU ETIQUETA«;

En esta parte reemplaza lo que está resaltado en color azul por lo que se indica en cada caso.

Puedes modificar la cantidad de títulos que llevará la lista aumentando o disminuyendo la cifra 8 de la línea blCantidadJTPost=8;.

El número 180 de la línea blNumeroPostFilt=180; representa a la cantidad de entradas que se filtrarán al mostrarse. Si editas la cifra, tu lista se creará a partir de las últimas 180 entradas publicadas.

Puedes editar tanto el tipo de fuente como el tamaño del texto, su color y el color al pasar el puntero o cursor por encima.

color: #4A5C96; Indica el color de los títulos.
color: #CC2200; Indica el color de los títulos al pasar el cursor.

Haz uso de la tabla de colores para conseguir el código de tus tonalidades favoritas.

font-family: Arial; Indica la fuente de texto a utilizar (Reemplaza Arial por Comic Sans MS por ejemplo).
font-size: 13px; Indica el tamaño del texto (aumenta o disminuye la cifra 13 para editarlo).
padding-left: 14px; Representa el espacio entre la imagen o flechita y el comienzo del título (edita la cifra 14 a tu gusto).

Para cambiar el icono del check o flecha que aparece al lado del titulo de la entrada, busca la siguiente URL y reemplazala por la URL de tu imagen:
http://4.bp.blogspot.com/-9tl97NsizkY/U9E6igugkQI/AAAAAAAAEWM/w7aBoVCdtb4/s1600/flecha.png

Espero que este truco sea de tu agrado, si tienes alguna duda o sugerencia por favor comentala.

No olvides compartir esta entrada con tus redes sociales.