Desde Junio de 2013 Twitter ha dejado de dar soporte a la versión 1 de su API que es la que usa este gadget, así que ya no funciona. Si sigues necesitando publicar tus últimos tweets de manera personalizada, aquí tienes otro sistema y en este otro enlace la manera de replicar este mismo gadget que se explicaba a continuación.
Tal y como viene redactado está listo para insertar como gadget en la barra lateral, aunque necesitáis al menos de un ancho de 335px para que se acomode bien.
El código es algo largo porque permite bastantes más opciones que las que yo usé para este fin concreto, pero como casi todos los parámetros son autoexplicativos (CSS casi literal), las podréis aprovechar para hacer otras cosas.
Esto como siempre es sólo un ejemplo y cambiando el estilo podréis conseguir otros resultados distintos de este.
<style>
#ultimotweet { position:relative; width:335px; height:94px; margin:0 auto;
background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgN4UvSvfZFdRig1nh5jqTtJG6JMKXEHKVAzzSvxocNK_wfitt1wkKmetewEVSPZkdwkEyTboKRz6BbTvACC9gN0f5alcXjd5wO85AoUkEghlzFN72Z8YnDOoSFDaeqvS_X0L5xy3HQJ_w/s1600/twitter.png);}
.twtr-widget .twtr-tweet-wrap { position:absolute; top:10px; left:90px; overflow: hidden; padding:0px; margin:0; zoom:1; width:235px !important;}
.twtr-doc { font-size:12px;}
.twtr-hd, .twtr-user, .twtr-ft { display:none;}</style>
<div id="ultimotweet">
<script charset="utf-8" src="http://widgets.twimg.com/j/2/widget.js"></script>
<script>new TWTR.Widget({
version: 2,
type: 'profile',
rpp: 1,
interval: 5000,
width: 335,
height: 94,
theme: {
shell: {
background: 'transparent',
color: '#000'
},
tweets: {
background: 'transparent',
color: '#333',
links: '#999'
}
},
features: {
scrollbar: false,
loop: true,
live: true,
behavior: 'all'
}
}).render().setUser('oloman').start();
</script></div>
#ultimotweet { position:relative; width:335px; height:94px; margin:0 auto;
background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgN4UvSvfZFdRig1nh5jqTtJG6JMKXEHKVAzzSvxocNK_wfitt1wkKmetewEVSPZkdwkEyTboKRz6BbTvACC9gN0f5alcXjd5wO85AoUkEghlzFN72Z8YnDOoSFDaeqvS_X0L5xy3HQJ_w/s1600/twitter.png);}
.twtr-widget .twtr-tweet-wrap { position:absolute; top:10px; left:90px; overflow: hidden; padding:0px; margin:0; zoom:1; width:235px !important;}
.twtr-doc { font-size:12px;}
.twtr-hd, .twtr-user, .twtr-ft { display:none;}</style>
<div id="ultimotweet">
<script charset="utf-8" src="http://widgets.twimg.com/j/2/widget.js"></script>
<script>new TWTR.Widget({
version: 2,
type: 'profile',
rpp: 1,
interval: 5000,
width: 335,
height: 94,
theme: {
shell: {
background: 'transparent',
color: '#000'
},
tweets: {
background: 'transparent',
color: '#333',
links: '#999'
}
},
features: {
scrollbar: false,
loop: true,
live: true,
behavior: 'all'
}
}).render().setUser('oloman').start();
</script></div>
Imprescindible cambiar el usuario al final del código (en verde) por el vuestro o bien por el de otra cuenta cualquiera si eso es lo queréis.
¿Vemos otro post al azar por si le encuentras utilidad o quizás prefieres ser más metódico y suscribirte a nuestras entradas por correo? También puedes imprimir este artículo y por supuesto compartirlo en redes sociales si fue de tu agrado.
Y muchos más artículos interesantes si nos sigues en...
Impresionante, Oloman! Gracias! Ya veré cómo utilizarlo :D
ResponderEliminarsi! muy bueno
EliminarGracias, se ve minimalista como me gusta ami
ResponderEliminarA probar, de todas maneras se te agradece el aporte.
ResponderEliminarHola Oloman, llevo tiempo aprendiendo de tus consejos ;)
ResponderEliminarAhí va una duda personal, hace unos días me encontré con el plugin o toolbar "social media" de wibiya y lo incorporé al blog que customizo mamaartista.
Este plugin que divisé en otros blog siempre aparece en el bottom, mi idea es instalarlo en el Top o parte superior del blog de manera que desaparezca cuando decidan adentrase en el contenido.
Un Saludo!
Jajaja... Me suenan muchas cosas que vi en esa plantilla ;)
EliminarA lo que vamos. Hace tiempo que probé esa barra y me parece recordar que daban un código javascript cerrado. Si es así no vas a poder modificar su ubicación.
Para forzar la cosa puedes añadir a tu CSS esto, pero queda regular:
#wibiya_toolbar_wrapper {
position: absolute;
top: 0;
height: 40px;
overflow: hidden;
}
Gracias Olo,
EliminarSi la verdad que me he inspirado en tu blog últimamente ;) aunque mi asunto pendiente es la estructura, a ver si trabajándolo un poco te copio la forma de ordenar la información... Ya que todas las bloggers miran y copian y todos los blogs son muy semejantes, "por hacer algo diferente"
Respecto a la barra estoy meditando probar otras ya que es un poco engorrosa, todas las imágenes aparecen con la opción de share...
Seguiré probando y aprendiendo de tus consejos ;)
Un Saludo
Probé la barra superior pero... el radius y la sombra me lo produce en las esquinas del top, mejor buscaré otra barra de navegación mas editable.
EliminarMejor, porque con esa creo que no vas a poder hacer demasiado.
EliminarOloblogger, tengo un problemón. He editado el código HTML de mi web (no es de Blogger, la he hecho a mano) y una cosa rara ha fallado en el código y algunas cosas están mal. ¿Hay alguna forma de ver cómo estaba mi web hace un día para ver el código fuente de la página? :(...
ResponderEliminarPrueba en Google accediendo a lo que tienen almacenado en caché. Otra manera sería usando Wayback Machine. En ambos casos es fácil que te falte algo, pero posiblemente consigas la mayor parte del código. Suerte
EliminarMuchas gracias, no sabía que podía ver lo que Google tenía en caché ^^". Ya he conseguido poner el código tal y como estaba :)
EliminarFelicidades, porque es una put... que te ocurra eso
EliminarGracias de nuevo xD
ResponderEliminarHola oloman, desearía solo obtener el texto del ultimo tweet de un determino usuario, eso se puede? porque he intentado quitarle los estilos para ponerles los míos y se malogra o descuadra todo :/ Gracias
ResponderEliminarHola. Los estilos que incluí en esta entrada sirven para para que no se vean elementos del gadget original. Lo cierto es que puedes quitarlos todos y el tweet se verá igualmente. Luego puedes ir probando a incorporarlos poco a poco y así descubres qué hace cada uno para finalmente dejar los que te interesen. Y claro que puedes poner cualquier usuario.
Eliminardon, que pena molestarlo resulta que me encanta ese codig, sin embargo lo modifique para que no tuviera ni fondo ni imagen del pajaro de twitter, y me encanto como quedo, les dejo el codigo al final. mi pregunta es:
ResponderEliminares posible, que me muestre los ultimos 3 twitts y no solo el ultimo? e leido el codigo sin embargo ni idea.. me podria hechar una mano?
hola don oloman, ya revise el codigo y de pruebas cacharreando se me dio por ponerle en rpp, en vez de 1 poner 3 y me funciono, ya solo me faltaba subirle los valores del tamaño, y quedo perfecto, no se como poner e codigo de la cajita, aqui xq no deja poner style en los comentarios, si les interesa el codigo me dices como y lo pongo o lo envio por priv.
ResponderEliminarmuchas gracias por tus aportes.
Usa esto para antes de publicar, convertir el código: http://www.oloblogger.com/p/html-texto-plano.html
EliminarGracias
a mi me interesa el codigo puedes mandarmelo
EliminarNo entiendo lo que me pides. El código está publicado en el post.
Eliminargracias el canario,lo utilice en over blog y no fui capaz pero en mi nuevo blog de blogger a la perfección,aqui te dejo mis blog y muchas gracias por que con tu ayuda intento mejorar mi pequeño blog http://elcanario-elcanario.blogspot.com.es/ y en over blog :http://relatoshelenamarey.over-blog.es/
ResponderEliminarcomo puedo hacer que salgna mas tweets?
ResponderEliminarCon este otro método que precisamente publiqué hace unas horas ;)
EliminarMostrar tweets con y sin jQuery
Hola, tengo este problema cuando publico nuevos tweets en lugar de actualizr los empalma uno sobre el otro =/
ResponderEliminar¿En qué página pusiste este gadget que lo vea? En la que aparece en tu perfil no veo ninguno...
Eliminaren kombuchads.com.mx se vana cumulando los tweets hacia abajo, si le doy refresh vuelve a aparecer solo uno, en gastonoliverio.com.mx se amontonan uno sobre otro e igual la darle refresh se ve solo uno
EliminarPerdón por el retraso, cosa de las fiestas.
EliminarAcabo de verlo y se ve bien. Ahora mismo hay un solo tweet en la parte superior. Quizás necesitas un overflow:hidden o algo parecido según el diseño y el lugar dónde lo pusiste, aunque lo he comprobado en IE, FF y Chrome y en todos se ve bien.
Hey!!
ResponderEliminarGracias, esto está excelente en verdad.
La cosa es que tengo el mismo problema que Gastón, en mi página se me encima el tweet nuevo en el anterior, al refrescar ya aparece sólo el nuevo... algún consejo para que no se encimen?
¿Y dónde está el tuyo que también lo pueda ver?
EliminarOloman, Gracias. Quedo estupendo. Saludos desde Venezuela.
ResponderEliminarOloman después de chequear y modificar unas cosas, me di cuenta que te falta style/ para cerrar el código. ¿Estoy en lo cierto?
ResponderEliminarHmmm... creo que no. Si observas el código, el cierre del STYLE está justo después de .twtr-ft { display:none;}
EliminarOloman!! Sos un maestro!!!
ResponderEliminarPero tengo una duda! Como hacer para que junto al tuit aparezca la imagen del perfil del usuario??
Muchas Gracias!!
Sinceramente, con este código no lo sé, pero pienso que podrías añadirlo a la imagen de fondo y luego desplazar un poco el texto del tuit para que se vea.
EliminarSabes que habría que hacer para que se viera en IE <= 8?
ResponderEliminarNo sé... ¿rezar?
EliminarBueno, ahora en serio. He probado en IE7 y yo veo el cacharro perfectamente con su tweet correspondiente. Eso sí, el resto de la página se va al traste. Yo no me preocuparía mucho por IE7 y en los otros seguro que funciona.
Oloman como haria para ponerlo en cada en cada una de mis entradas. Yo tengo el "acerca del autor" en cada entrada individual, quisiera fusionarlo en ese código, se podra, ayudas gracias..
ResponderEliminarYa lo pude hacer Oloman, muchas gracias. Una pregunta como le cambio los colores a los links del ultimo tweet gracias
ResponderEliminarTienes que cambiar el color en esta parte: links: '#999'
EliminarHola, ya no funciona creo que debes actualizar a la version 1.1, por fa publica como quedaria con la actualización, gracias
ResponderEliminarA mi también me interesaría darle solución :(
ResponderEliminarAmigo de un día para otro dejó de funcionar :(, que solución se le puede dar :O
ResponderEliminarMi blog, Alicia y Yushi. Twitter ha cerrado definitivamente la API que generaba este gadget, así que ya no sirve. Tengo ya una solución (ahora mismo funcionando en modo primitivo al final de esta página) pero necesito un rato para explicarla y publicarla. Espero que no sean muchos días.
ResponderEliminarMuchas gracias te pasaste :D
EliminarYa lo tengo publicado con fecha 19-06-2013
Eliminar