Como agregar el widget de Twitter y no morir en el intento


El widget de twitter es un apartado cada vez más común en los sitios de Internet. Pero por alguna razón no siempre es tan sencillo como parece agregarlo a nuestros sitios pues hay variantes en el código a insertar y reestricciones en el api de twitter.

Widget


Para iniciar, es evidente contar con nuestra cuenta de twitter. Sino tienes una, hay que obtenerla http://twitter.com/.


Lo siguiente es entrar al sitio de recursos de Twitter https://twitter.com/about/resources

Allí encontraras varias opciones para insertar en tu sitio (no importa si es sobre WordPress o no) accesos a tu cuenta de Twitter.


El que nos interesa es el apartado que dice «Widgets». Clic aquí. Después obtenemos el widget para nuestro sitio Web y hacemos clic donde dice «Mi sitio Web» -> «Widget de Perfil».


En este espacio es donde podemos crear un widget con las entradas publicadas en nuestro Twitter. Sigue los pasos de esta página y al persionar el botón «Terminar y guardar código», obtendrás las instrucciones de JavaScript a incrustar en tu sitio.

Tip importante

Aquí es donde vale la pena esta entrada. En lo personal me he encontrado con múltiples problemas al utilizar el código devuelto por esta herramienta. Desde entradas que no se actualizan, hasta widget en blanco. Twitter lo atribuye a diversos factores como el número de peticiones por hora permitidas (150 para usuarios no autenticados y 350 para usuarios autenticados), uso incorrecto del protocolo HTTPS al referirse al archivo widget.js entre muchos otros.

Aquí te dejo el código que me ha servido a mi y con el que no he encontrado problema alguna hasta ahora.

[js]

<script src="http://widgets.twimg.com/j/2/widget.js"></script>
<script>
new TWTR.Widget({
version: 2,
type: ‘profile’,
rpp: 40,
interval: 6000,
title: ‘WebmasterUV’,
subject: ‘Portal de la UV’,
width: 280,
height: 400,
theme: {
shell: {
background: ‘#006600’,
color: ‘#ffffff’
},
tweets: {
background: ‘#ffffff’,
color: ‘#444444’,
links: ‘#b740c2’
}
},
features: {
scrollbar: true,
loop: false,
live: true,
hashtags: false,
timestamp: true,
avatars: true,
behavior: ‘all’
}
<strong>}).render().setUser(‘webmasterUV’).start();</strong>
</script>

[/js]

Evidentemente tienes que cambiar la configuración con las opciones como title, subject, width: 280, height: 400, etc. Pero primeramente modifica la última línea con tu cuenta de Twitter.

[js]
.
.
.
type: ‘profile’,
.
.
.
}).render().setUser(‘webmasterUV’).start();
</script>

[/js]

En caso de que quieras poner una lista de Twitter en lugar de un usuario, modifica la última línea así:

[js]
.
.
.
type: ‘list’,
.
.
.
}).render().setList(‘UVportal’, ‘webmaster’).start();
</script>

[/js]

Donde UVportal es la cuenta y webmasterUV es el nombre de la lista a desplegar.

Espero te sea de mucha utilidad como lo ha sido para mi.