Pune un widget cu cele mai populare posturi pe Blogger

In utima vreme am fost intrebat tot mai des daca stiu vreun widget care sa afiseze cele mai populare posturi din blog. Cautand pe net am gasit o gramada de astfel de widget-uri, dar din pacate majoritatea nu functionau.

Totusi am gasit si un widget care merge. El arata ca in poza de mai jos iar aici este blogul autorului. BloggerStop.net

Acest widget se bazeaza pe un Javascript care cu ajutorul Yahoo Pipes gaseste numarul de comentarii pe care le are un post apoi afisandu-le in acest widget in ordine descrescatoare.

Pentru a adauga acest widget pe blogul vostru blogspot nu trebuie decat sa adaugati un cod intr-un gadget html/javascript. Deci urmati calea 'Aspect --> Elemente de pagina' si apoi dati clic pe 'Adauga un obiect gadget'. Din lista care apare alegeti optiunea 'Html/JavaScript'  si copiati codul de mai jos in campul pentru continut.

Inainte de a va arata codul vreau sa va spun ca sunt doua metode de a afisa link-urile catre postare si deci tot 2 coduri care sa produca cele 2 tipuri de widget-uri. Puteti alege metoda care vreti.

Important:
Nu uitati sa schimbati adresa blogului meu cu a voastra.
Nu folositi http://.
Numarul scris cu verde este numarul de link-uri care vor aparea in widget si il puteti modifica dupa cum doriti.
Acest cod creaza fundalul widget-ului:

background-color:#FFFFFF;

modificati-l cum doriti pentru a arata bine in blogul vostru.

Daca vreti ca link-urile sa arate asa:

• Cea mai comentata postare (28)
• A doua postare (21)
• A trea postare (12)

copiati codul de mai jos.

<div style="background-color:#FFFFFF;padding:5px;">
<script type="text/javascript">
function pipeCallback(obj) {
document.write('<ul style="text-transform: capitalize;">');
var i;
for (i = 0; i < obj.count ; i++)
{
var href = "'" + obj.value.items[i].link + "'";
var item = "<li>" + "<a href=" + href + ">" + obj.value.items[i].title + "</a> </li>";
document.write(item);
}
document.write('</ul>');
}
</script>
<script src="http://pipes.yahoo.com/pipes/pipe.run?_render=json&_callback=pipeCallback&_id=a7d3195528df5e96181a3d2712266226&url=http%3A%2F%2Fbloggerajutor.blogspot.com&num=10" type="text/javascript"></script>
</div>

Daca vreti ca link-urile voastre sa arate asa

• Cea mai comentata postare
• A doua postare
• A trea postare

copiati acest cod:

<div style="background-color:#FFFFFF;padding:5px;">
<script type="text/javascript">
function pipeCallback(obj) {
document.write('<ol style="text-transform: capitalize;">');
var i;
for (i = 0; i < obj.count ; i++)
{
var href = "'" + obj.value.items[i].link + "'";
var item = "<li>" + "<a href=" + href + ">" + obj.value.items[i].title + "</a> </li>";
document.write(item);
}
document.write('</ol>');
}
</script>
<script src="http://pipes.yahoo.com/pipes/pipe.run?_render=json&_callback=pipeCallback&_id=28a6afad7c6ba1288c1b738277e42385&url=http%3A%2F%2Fbloggerajutor.blogspot.com&num=10" type="text/javascript"></script>
</div>