Volver a Proyectos Listado de Artículos

Sacándole partido a la api de twitter.

Luis Ruiz

Escrito por Luis Ruiz Actualizado el

Como sabéis, el tema del blog esta sin terminar y cuando saco algo de tiempo lo voy mejorando. En esta ocasión quería mostrar mis últimos tweens en el lateral derecho, normalmente uso plugin para mostrarlo, pero para evitar el uso indiscriminado de plugin busque otra alternativa.

Mirando en la documentación de twitter ví que podíamos sacar información de twitter en los formatos JSON, XML y ATOM,  a través de su API mediante una url y el identificador de usuario. Solo con estos dos datos recibiramos la información necesaría para mostrarla en páginas html, flash, etc…
Como lo vamos a mostrar en wordpres y no quería complicame la vida, busque algo que tuviera pocas líneas de código en javascript y encontre esto:

Como sabéis, el tema del blog está sin terminar y cuando saco algo de tiempo lo voy mejorando. En esta ocasión quería mostrar mis últimos tweens en el lateral derecho, normalmente uso plugin para mostrarlo, pero para evitar el uso indiscriminado de plugin busqué otra alternativa.

Mirando en la documentación de twitter vi que podíamos sacar información de twitter en los formatos JSON, XML y ATOM,  a través de su API mediante una url y el identificador de usuario. Solo con estos dos datos recibiríamos la información necesaria para mostrarla en páginas html, flash, etc.

Como lo vamos a mostrar en WordPress y no quería complicarme la vida, busque algo que tuviera pocas líneas de código en javascript y encontré esto:

<pre class="lang:html decode:true ">
<script src="http://twitter.com/javascripts/blogger.js" type="text/javascript"></script> <script src="http://twitter.com/statuses/user_timeline/id_usu.json?callback=twitterCallback2&amp;count=1" type="text/javascript"></script><br />
</pre>

Donde ‘id_usu’ es el identificador del usuario y ‘count’ el número de mensajes a mostrar. Está información se mostrara en una capa llamada ‘twitter_update_list’, aquí tenéis el ejemplo.

Ya con esta información, fui a la admin de WordPress, a widgets y arrastre uno llamado ‘texto’ hacia la zona ‘sidebar’, en dicho widget inserte el siguiente código:

<div id="twitter_div">
<h2 style="display: none;">Twitter</h2>
<p><a id="twitter-link" style="display: block; text-align: right;" href="http://twitter.com/bubuku">Sígueme en Twitter</a></p>
</div>
<p><script src="http://twitter.com/javascripts/blogger.js" type="text/javascript"></script> <script src="http://twitter.com/statuses/user_timeline/id_usu.json?callback=twitterCallback2&amp;count=5" type="text/javascript"></script>

Ya tenía todo funcionando perfectamente, pero luego pensé que quizás sería más interesante mostrar la información de una de mis listas para que la información tuviera más movimiento. Y gracias a esta idea descubrí esta página Twitool-box donde te indican la url que necesitas para sacar la información según sea el caso añadiendo pocos parámetros.

Por ejemplo para mostrar los últimos 5 tweens de mí lista de desarrolladores, nos vamos a la página mencionada anteriormente, al formulario ‘GET list statuses’ e insertamos los datos.

Esta sería la url resultante para recibir los datos en JSON:

http://api.twitter.com/1/bubuku/lists/desarrolladores/statuses.json?per_page=5

Y este el código html que tendríamos que insertar en el widget de WordPress.

<div id="twitter_div">
<h2 style="display: none;">Twitter!</h2>
<p><a id="twitter-link" style="display: block; text-align: right;" href="http://twitter.com/bubuku">Sigueme en Twitter!</a></p>
</div>
<p><script src="http://twitter.com/javascripts/blogger.js" type="text/javascript"></script> <script src="http://api.twitter.com/1/bubuku/lists/desarrolladores/statuses.json?callback=twitterCallback2&per_page=5" type="text/javascript"></script>

Si alguien, utiliza otra formas o quieres comentar alguna parte., estaré encantado de conversar!!