Tutoriales Sobre Blogger: Estadísticas, comentarios , seguidores y en linea para Blogger

En este tutorial veremos como crear un Gadget de estadísticas para blogger. Lo que mostrara la cantidad de seguidores en Twitter, los suscriptores en blogger, la cantidad de Post creados , la cantidad de comentarios, y la cantidad de gente en linea. Todo esto en un gadget




Antes que nada veremos una demostración 

Demostración

Comencemos

• Paso 1: Vamos a Blogger>>Plantilla>>Edicion HTML>>Añadir nuevo Gadget>>HTML/Javascript
• Paso 2: Una ves dentro del Gadget HTML/Javascript pegamos el siguiente código

<script language='javascript' type='text/javascript'>
function snfbc(json){
document.write(parseInt(json.value.items[0].feed.entry.circulation));
}
function xfeedburner(uri){
if(uri){
document.write('<sc'+'ript src="http://pipes.yahoo.com/pipes/pipe.run?_id=e61a81bcdb1660ebf8bc1a7c130f1f7b&_render=json&uri='+uri+'&_callback=snfbc" type="text/javascript"></s'+'cript>');
} else{
return false;
}
}
function sntwitter(json){
document.write(parseInt(json.followers_count));
}
function xtwitter(user){
if(user){
document.write('<scr'+'ipt src="http://twitter.com/users/show/'+user+'.json?callback=sntwitter" type="text/javascript"></scr'+'ipt>');
} else{
return false;
}
}
</script>
<div style='float:left;padding:8px;'>
<img src="http://img72.imageshack.us/img72/5376/twittery.png" style="margin-right: 8px; float:left;" />
<a href="http://twitter.com/tutorialesblogger" target="_blank" ><span style="float: left; margin-top:2px;padding:0;font-size:18px;color:#000;font-family:Arial,Helvetica,sans-serif;">
<script type="text/javascript"> xtwitter("TutorialesBlogger") </script> Seguidores</span><br /><!--[if IE]><br /><![endif]-->
<span style="text-align:left;margin:0px;padding:0px;font-size: 12px;color:#000;font-family:Arial,Helvetica,sans-serif;">Seguidores en Twitter</span></a>
</div><div style='clear:both;'/>
<div style='float:left;padding:8px;'>
<img src="http://img638.imageshack.us/img638/3243/rsss.png" style="margin-right:8px;float:left;" />
<a href="http://feeds.feedburner.com/tuto/blogger" target="_blank" ><span style="float:left;margin-top:2px;padding:0;font-size: 18px; color:#000;font-family:Arial,Helvetica,sans-serif;">
<script type="text/javascript"> xfeedburner("Kiến thức MaRitimE's") </script> Suscriptores</span><br /><!--[if IE]><br /><![endif]-->
<span style="text-align:left;margin:0px;padding:0px;font-size:12px; color:#000;font-family:Arial,Helvetica,sans-serif;"> Suscribe-te!</span></a>
</div><div style='clear:both;'/>
<div style='float:left;padding:8px;'>
<img src="http://img684.imageshack.us/img684/6793/usersh.png" style="margin-right:8px;float:left;" />
<span style="float:left;margin-top:2px;padding:0;font-size:18px;color:#000;font-family:Arial,Helvetica,sans-serif;">
<script style="text/javascript">
function showpostcount(json) {
document.write(parseInt(json.feed.openSearch$totalResults.$t,10));
}</script>
<script src="http://tutorialesblogger.blogspot.com/feeds/comments/default?alt=json-in-script&callback=showpostcount"></script> Comentarios</span><br /><!--[if IE]><br /><![endif]-->
<span style="text-align:left;margin:0px;padding:0px;font-size: 12px;color:#000;font-family:Arial, Helvetica, sans-serif;"></span>
</div><div style='clear:both;'/>
<div style='float:left;padding:8px;'>
<img src="http://img707.imageshack.us/img707/3875/bloggerf.png" style="margin-right:8px;float:left;" />
<a href="http://tutorialesblogger.blogspot.com/search/label/?max-results=999" target="_blank"><span style="float:left;margin-top:2px;padding:0;font-size: 18px; color:#000;font-family:Arial,Helvetica,sans-serif;">
<script src="http://tutorialesblogger.blogspot.com/feeds/posts/default?alt=json-in-script&callback=showpostcount"></script> Entradas</span><br /><!--[if IE]><br /><![endif]-->
<span style="text-align:left;margin:0px;padding:0px;font-size:12px; color:#000;font-family:Arial,Helvetica,sans-serif;">Ves Todas</span></a>
</div><div style='clear:both;'/></div></div></div></div>
<script type="text/javascript">
s = new Array()
s[0] = "(1 ng&#432;&#7901;i &#273;ang xem)";
s[1] = "(2 ng&#432;&#7901;i &#273;ang xem)";
s[2] = "(3 ng&#432;&#7901;i &#273;ang xem)";
s[3] = "(4 ng&#432;&#7901;i &#273;ang xem)";
s[4] = "(5 ng&#432;&#7901;i &#273;ang xem)";
s[5] = "(6 ng&#432;&#7901;i &#273;ang xem)";
s[6] = "(7 ng&#432;&#7901;i &#273;ang xem)";
s[7] = "(8 ng&#432;&#7901;i &#273;ang xem)";
s[8] = "(9 ng&#432;&#7901;i &#273;ang xem)";
s[9] = "(10 ng&#432;&#7901;i &#273;ang xem)";
s[10] = "(11 ng&#432;&#7901;i &#273;ang xem)";
s[11] = "(12 ng&#432;&#7901;i &#273;ang xem)";
s[12] = "(13 ng&#432;&#7901;i &#273;ang xem)";
document.write(s[Math.floor(Math.random()*(s.length))])
</script>

• Paso 3: Guardamos el gadget 

Nota:- Solo deberás de cambiar las URL respectivamente