InfectedFX

Hace un par de días hablando con Juan Carlos le comentaba que no encontraba una manera agradable y fácil de adaptar para mostrar lo que se dice en Twitter de @usuario(s) en algún sitio, de ahí salió la idea de hacer un plugin para jQuery que nos facilitara la vida en ese aspecto, mostrar o no avatars, cuantos tweets, definir estilos de la lista, que sea para uno o más usuarios... etc... entonces nació jQuery Twitter Mentions.

Este plugin para jQuery en resumen nos ayudará a obtener lo que se dice de cualquier usuario o usuarios dentro de twitter pesa tan solo ~2kb y trae varias opciones útiles como:

• Mostrar para uno o "x" número de usuarios
• Seleccionar el número de mensajes para mostrar
• Mostrar/Ocultar avatars
• Definir nuestras propias clases
• Efecto zebra en la lista

La forma más básica de usarse es la siguiente:

$(e).twitterMentions(username,options);

Modo de uso

Antes de la etiqueta head ponemos lo siguiente.

Ahora para mandarlo a llamar utilizamos lo siguiente #content será el contenedor donde mostraremos los mensajes.

Por último, ponemos un div vacío que será nuestro contendor en donde deseemos mostrar los tweets que nos mencionan.

El código al final nos debe de quedar algo como esto:

¿Cómo funciona Twitter Mentions?

Estos son los diferentes parámetros que podemos usar y sus respectivos valores por default:

user: null,
callback: null,
page : 1,
maximum : 10,
avatar : true,
ulClass : 'twitter-mentions',
odd : true,
oddClass : 'odd'

Referencias de los parámetros para Twitter Mentions

• username: [ string | array ] : El parámetro username puede ser una cadena de texto con el nombre de usuario, o un array con varios usuarios.
• options: [ object ] : El parámetro options es un parámetro opcional, y consta de las siguientes opciones.
• callback : [Function] : La funcion que queremos se ejecute una vez los datos hayan regresado
• page : [Int] : Como cualquier paginación, que número de página deseamos que se muestre. Default es 1
• maximum : [Int] : Numero de tweets que se mostrarán por pagina Default es 10
• avatar : [bool] : Boleano que indica si queremos que se muestren los avatares. Default es true
• ulClass : [String] : Mombre de la clase que tendrá nuestra lista. Default es twitter-mentions
• odd : [bool] Boleano que indica si se agregará una clase alternativa a cada item de la lista (zebra). Default es true
• oddClass : [String] : Nombre de la clase que tendran los elementos 'odd' Default es 'odd'

Ejemplos de uso

Mostrar solo 5 mensajes

 $('#content').twitterMentions('usuario',{ maximum : 5 });

Obtener los tweets de múltiples autores

$('#content').twitterMentions(['infectedfx','_zetta']);

Eliminar los avatars de la lista

$('#content').twitterMentions('usuario',{ avatar : false });

Cambiando la clase a la lista

 $('#content').twitterMentions('usuario',{ ulClass : 'myClass' });

Cambiando la clase al item de la lista alternativo(zebra)

 $('#content').twitterMentions('usuario',{ oddClass : 'myClass' });

Desactivar el efecto zebra

$('#content').twitterMentions('usuario',{ odd : false });

Obtener 15 tweets de múltiples autores

$('#content').twitterMentions(['infectedfx','_zetta','ba_k'],{ maximum : 15 });

• jquery.twitter.mentions.js
• jquery.twitter.mentions.min.js
• jquery.twitter.mentions.pack.js