Adicionalmente este recurso se a combinado con un Slider jQuery y entre una cosa y otra obtenemos un rotador de tweets que podemos personalizar tanto en contenido como en aspecto.
Vista Previa:
http://dangrecks.es.tl/Gadget-para-mostrar-tweets.htm
Si ya tiene jQuery en nuestra plantilla la primera línea se puede suprimir. El codigo hay que incluirlo en Fuente HTML de Controlar páginas, o donde lo desees poner de tu diseño, y es el siguiente:
Cita: <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8/jquery.min.js" type="text/javascript"></script>
<script type="text/javascript" src="https://olobloggerblog.googlecode.com/files/Twitter-post-fetcher-7.js"></script>
<script type="text/javascript">
twitterFetcher.fetch('
386257031599910912', 'rotatweet',
5, true, false, false);
$(document).ready(function() {
setInterval(function(){
$('#rotatweet ul li:first-child').fadeOut(0)
.next('li').fadeIn(1000)
.end().appendTo('#rotatweet ul');},
4000);
});
</script>
<div id="rotatweet"></div>
<style>
#rotatweet {
position:relative;
width:335px;
height:94px;
margin:0 auto;
background:url(http://2.bp.blogspot.com/-8jKyQz1JLTY/UHr-nCVNijI/AAAAAAAAFtU/T2XgWuNy2Uk/s1600/twitter.png);
}
#rotatweet ul {
position:absolute;
top:12px;
left:90px;
width: 232px;
margin:0;
padding:0;
font-size: 12px;
}
#rotatweet ul li {
list-style: none;
margin: 0;
padding: 0;
display: none;
}
</style>
¿Y qué tenemos que cambiar de ahí? Pues casi nada. Sólo la ID correspondiente a nuestro propio gadget de Twitter porque el que ves es el mío. Ahora si no se genera desde la página oficial, pues no funcionará nada. Es el número
386257031599910912 que ves en el código.
*Para obtener tu ID, solo tienes que iniciar sesión en twitter y dirigirte al siguiente link:
https://twitter.com/settings/widgets, ya estando hay le das en Crear Nuevo, y rellenas todos los datos que se te pide, ya rellenado los datos, le das a Crear Widget y se te dara un codigo y en ese codigo buscamos: data-widget-id= , y el número que se te da ese es tu ID, en mi caso es: "386257031599910912" (Si no te quedo Claro hazmelo saber xd)
Otra cosa que se puede cambiar es el número de tweets a mostrar. Es ese tercer parámetro de la función
twitterFetcher.fecth, o lo que es lo mismo, ese número
5.
Por último, el intervalo de tiempo entre tweets es en el ejemplo el parámetro
4000 e indica la demora en milisegundos.
*Para conseguir otro estilo distinto, pues sólo se trata de ajustar la parte CSS, ya tienes el modelo, es hora de ponerle creatividad a tu diseño .
Saludos y espero haber ayudado
!
!
