
Ir a Diseño, Elementos de la página y añadir un gadget HTML/Javascript.
Poner el siguiente código:
<div id="twitter_div">
<h2 class="sidebar-title">Twitter Updates</h2>
<ul id="twitter_update_list"></ul>
<a href="http://twitter.com/v_ku" id="twitter-link" style="display:block;text-align:right;padding-right:10px">Sigueme en Twitter</a>
</div>
<script type="text/javascript">
function twitterCallback2(twitters) {
var statusHTML = [];
for (var i=0; i<twitters.length; i++){
var username = twitters[i].user.screen_name;
var status = twitters[i].text.replace(/((https?|s?ftp|ssh)\:\/\/[^"\s\<\>]*[^.,;'">\:\s\<\>\)\]\!])/g, function(url) {
return '<a href="'+url+'">'+url+'</a>';
}).replace(/\B@([_a-z0-9]+)/ig, function(reply) {
return reply.charAt(0)+'<a href="http://twitter.com/'+reply.substring(1)+'">'+reply.substring(1)+'</a>';
});
statusHTML.push('<li><span>'+status+'</span> <a style="font-size:85%" href="http://twitter.com/'+username+'/statuses/'+twitters[i].id+'">'+relative_time(twitters[i].created_at)+'</a></li>');
}
document.getElementById('twitter_update_list').innerHTML = statusHTML.join('');
}
function relative_time(time_value) {
var values = time_value.split(" ");
time_value = values[1] + " " + values[2] + ", " + values[5] + " " + values[3];
var parsed_date = Date.parse(time_value);
var relative_to = (arguments.length > 1) ? arguments[1] : new Date();
var delta = parseInt((relative_to.getTime() - parsed_date) / 1000);
delta = delta + (relative_to.getTimezoneOffset() * 60);
if (delta < 60) {
return 'menos de un minuto';
} else if(delta < 120) {
return 'alrededor de un minuto';
} else if(delta < (60*60)) {
return (parseInt(delta / 60)).toString() + ' minutos aprox.';
} else if(delta < (120*60)) {
return 'alrededor de una hora';
} else if(delta < (24*60*60)) {
return 'aprox. ' + (parseInt(delta / 3600)).toString() + ' horas';
} else if(delta < (48*60*60)) {
return 'hace 1 día';
} else {
return 'hace ' + (parseInt(delta / 86400)).toString() + ' días';
}
}
</script>
<script type="text/javascript" src="http://twitter.com/statuses/user_timeline/v_ku.json?callback=twitterCallback2&count=1"></script>
Cambiar el nombre.
Pueden modificar el texto que esta en azul, o borrarlo si no quieren mostrarlo.
Si quieren que muestre mas comentarios solo hay que cambiar donde dice 1 por el numero que quieran mostrar.
Si quieren hacer algún cambio como por ejemplo un fondo de color con borde, solo agreguen este código arriba del anterior y modifiquen a gusto:
<style>
#twitter_div{ }
#twitter_update_list{padding:0;}
#twitter_div ul li{border:1px solid #a6c4e1;background:#F3F7FA;padding: 15px;list-style: none;}
</style>
Si ya tenían este widget en ingles el cual ponía, ejemplo: days, ago, etc...
Buscar y sustituir la siguiente linea:
<script type="text/javascript" src="http://twitter.com/javascripts/blogger.js"></script>
Por lo siguiente:
<script type="text/javascript">
function twitterCallback2(twitters) {
var statusHTML = [];
for (var i=0; i<twitters.length; i++){
var username = twitters[i].user.screen_name;
var status = twitters[i].text.replace(/((https?|s?ftp|ssh)\:\/\/[^"\s\<\>]*[^.,;'">\:\s\<\>\)\]\!])/g, function(url) {
return '<a href="'+url+'">'+url+'</a>';
}).replace(/\B@([_a-z0-9]+)/ig, function(reply) {
return reply.charAt(0)+'<a href="http://twitter.com/'+reply.substring(1)+'">'+reply.substring(1)+'</a>';
});
statusHTML.push('<li><span>'+status+'</span> <a style="font-size:85%" href="http://twitter.com/'+username+'/statuses/'+twitters[i].id+'">'+relative_time(twitters[i].created_at)+'</a></li>');
}
document.getElementById('twitter_update_list').innerHTML = statusHTML.join('');
}
function relative_time(time_value) {
var values = time_value.split(" ");
time_value = values[1] + " " + values[2] + ", " + values[5] + " " + values[3];
var parsed_date = Date.parse(time_value);
var relative_to = (arguments.length > 1) ? arguments[1] : new Date();
var delta = parseInt((relative_to.getTime() - parsed_date) / 1000);
delta = delta + (relative_to.getTimezoneOffset() * 60);
if (delta < 60) {
return 'menos de un minuto';
} else if(delta < 120) {
return 'alrededor de un minuto';
} else if(delta < (60*60)) {
return (parseInt(delta / 60)).toString() + ' minutos aprox.';
} else if(delta < (120*60)) {
return 'alrededor de una hora';
} else if(delta < (24*60*60)) {
return 'aprox. ' + (parseInt(delta / 3600)).toString() + ' horas';
} else if(delta < (48*60*60)) {
return 'hace 1 día';
} else {
return 'hace ' + (parseInt(delta / 86400)).toString() + ' días';
}
}
</script>
Hey! muy bueno este tip :), ya modifiqué el que tengo en mi blog, y quedó a la perfección, no dejes de sorprendernos amigo. :19)
ResponderEliminarManu (Audron_ncx) la verdad que quedo muy bien, me encanta el fondo que tiene del pajarito.
ResponderEliminarHola Vku!! me encanta el widged, pero no me ha funcionado en mi web.. vale para una página html normal??
ResponderEliminarSi Javier, yo las primeras pruebas las hago en HTML
ResponderEliminarhttp://dl.dropbox.com/u/19457418/twitter.html
Perdón... Es el típico vivicio de preguntar antes de comprobarlo todo bien... ESTA PERFECTO!!! MIL GRACIAS!!!
ResponderEliminar