Personaliza los nuevos widgets de Twitter

Algo esencial hoy en día para promocionar cualquier web es estar presente en Twitter, y en muchas ocasiones para hacer saber a nuestros visitantes que disponemos de Twitter debemos de añadir un widget con nuestros últimos tweets.
Hace tiempo expliqué como añadir y personalizar el widget de Twitter, pero con el cambio de a la API 2.0 del popular servicio de microblogging también tenemos una forma nueva de insertar los widgets y además podemos personalizarlos de formas muy diversas, como ahora veremos.

Antes de nada, debemos de tener una cuenta de Twitter, ya que ahora es necesario crear el widget desde una cuenta desde "configuración > widgets > crear nuevo" desde donde podremos crear un widget con los últimos tweets de una persona, sus favoritos, listas propias o búsquedas de cualquier tipo. A partir de este paso ya nos facilitarán un código y podremos personalizarlo.

Insertar el widget

Como ejemplo final podéis ver el widget que se encuentra en la barra lateral de Xitrus, pero tras crearlo veréis una simulación de como se mostrará.
El código que proporciona es un pequeño script y un link (una etiqueta <a>) que podremos personalizar para que cambie de una forma u otra el widget, es decir, en esta etiqueta debemos de cambiar los atributos necesarios para personalizar el widget.

Personalizar el widget

Todas las opciones de personalización tienen que establecerse como atributos dentro del elemento <a>.

• data-theme: permite establecer el tema del widget, ademite "dark" y por defecto es un tema claro.
• data-link-color: permite establecer el color de los link en formato hexadecimal.
• width: permite establecer el ancho del widget, aunque por defecto se adapta al contenedor (con un mínimo de 180px y un máximo de 520px), por lo que es perfecto para un Responsive Design.
• height: permite establecer el alto del widget.
• data-chrome: este atributo nos permite personalizar la forma del propio widgets y permite establecer distintos parámetros.
• noheader: oculta la cabecera del widget (que pone: "tweets" y "seguir a @PedroXitrus").
• nofooter: evita que se muestre una área para enviar tweets.
• noborders: elimina unos pequeños bordes separatorios entre los tweets.
• noscrollbar: oculta la barra de scroll.
• transparent: elimina el color de fondo del widget y permite que se vea el fondo del contendedor del widget.
• border-color: permite cambiar el color de los bordes que separan los tweets.
• data-tweet-limit: permite establecer el número máximo de tweets que se muestran en el widget.

Esto es prácticamente todo lo necesario para personalizar un widget de Twitter, que podemos usar a nuestro antojo.
Para poner un ejemplo más claro explicaré como mostrar el widget tal y como se muestra en este blog, ya que usa una configuración que a muchas personas le interese usar.

El atributo data-chrome permite que se oculte la cabecera y el pie del widget, además de hacer el fondo transparente, mientras que el atributo "data-tweet-limit" solo permite mostrar los tres últimos tweets.