Facebook Twitter Gplus Flickr Pinterest LinkedIn YouTube Google Maps E-mail RSS
Para crear tu TRIBU tienes que tener un gran Liderazgo.
 
Ser Diferente ya no es suficiente: HAY QUE SER EXTRAORDINARIO!
Home Blog Crear un Widget de Twitter en nuestro blog de WordPress
formats

Crear un Widget de Twitter en nuestro blog de WordPress

Twitter Widget Intelligenius

En nuesro blog de WordPress nos puede interesar instalar un widget de Twitter para que nuestros usuarios puedan seguirnos,  ver el timeline o enviarnos algún tuit. Con el paso de la API de Twitter a la versión 1.1 muchos plugins de quedaron obsoletos y no se podía acceder al timeline.

Twitter lo ha colocado mucho más fácil porque son ellos mismos los que nos proporcionan el widget con gran variedad de modificaciones el cual lo podemos personificar en cuanto a diseño, tamaño, timeline de tus tuits o de tus listas y más cosas.

Para empezar accedemos a nuestra cuenta de Twitter luego a configuración de cuenta y en el panel izquierdo encontraremos una opción de Widgets. Pinchamos en está opción y podremos crear un nuevo widget o editar uno ya creado. Vamos a crear un nuevo widget:

Twitter widget

Al crear un nuevo widget tenemos estás opciones:

Twitter Widget

Podemos ver un ejemplo del widget de Twitter. Podemos ver las diferentes fuentes para las cronologías mostrándonos de primero la cronología de usuario, favoritos, listas donde seleccionaremos la lista que deseemos, la cronología de Buscar donde estableceremos la cuenta de búsqueda o hashtag que nos interese y luego la cronología personalizada.

Nos muestra para cada cado una vista previa del widget con el timeline para que nos hagamos una idea.

Para la configuración del widget debemos definir:

  • El nombre de usuario del que estaremos creando el widget (@srintelligenius).
  • En opciones pinchamos si deseamos excluir respuestas y expandir fotos en el widget.
  • Definimos la altura del widget que por defecto nos lo define de 600 píxeles.
  • Definimos la plantilla que vamos a aplicar al widget siendo clara u oscura dependiendo del color de fondo del tema de la plantilla de WordPress.
  • Definimos el color para los enlaces de los tuits que por defecto son azules.
  • Hay otra opción que nos permite deshabilitar la opción de poder personalizar el widget creado.
  • Por último pinchar en el botón crear widget.

Twitter Widget

Nos genera un código del widget como este:

<a  href=”https://twitter.comnombre_cuenta”  data-widget-id=”id-widget_twitter”>Tweets por @nombre_cuenta</a>
<script>!function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0],p=/^http:/.test(d.location)?’http’:’https’;if(!d.getElementById(id)){js=d.createElement(s);js.id=id;js.src=p+”://platform.twitter.com/widgets.js”;fjs.parentNode.insertBefore(js,fjs);}}(document,”script”,”twitter-wjs”);</script>

Con este código nos vamos ya a nuestro blog de WordPress a la parte del backend (administración de nuestro blog) y en apariencia/widgets. Buscamos el widget de Texto o HTML personalizado y lo agragamos a sección de widgets de nuestra plantilla actual de WordPress y una vez allí podremos pegar el código que hemos copiado de Twitter, podemos ponerle un título como Twitter. Le damos a guardar y listo.

Refrescamos nuestro blog y debe aparecer nuestro Widget de Twitter con nuestro timeline.

Twitter Widget

Podemos configurar nuestro widget de Twitter con opciones personalizadas, estas son algunas de ellas:

Dimensiones: Podemos establecer las dimensiones del widget que necesitemos añadiendo al código el ancho y el largo en píxeles. Por ejemplo para un acho de 300 píxeles y una altura de 500 píxeles quedaría así:

<a class=”twitter-timeline” width=”300″ height=”500″ href=”https://twitter.com/twitterapi” data-widget-id=”YOUR-WIDGET-ID-HERE”>Tweets by @twitterapi</a>

El ancho mínimo para el timeline es de 180 píxeles y el máximo es de 520 píxeles. La altura mínima es 200 píxeles.

La configuración principal del widget se guarda en los servidores de Twitter y nosotros podemos configurar opciones específicas en el lado del cliente.

Otras opciones configurables:

  • Tema: Agregas el atributo al código del widget data-theme="dark".
  • Color del Enlace: Agregas al código data-link-color="#cc0000".  Algunos iconos del widget pueden aparecer con este color.
  • Ancho: (Width) Se configura usando el estandar de HTML donde la unidad es en píxeles.
  • Alto: (Height) Se configura usando el estandar de HTML donde la unidad es en píxeles.
  • Control de la forma del widget: Se configura que componentes del widget se mostrarán y su transparencia con el atributo data-chrome="nofooter transparent" y puede tmabién modificar con las siguientes opciones:
  1. Sin encabezado: noheader. Esconde el encabezado del timeline.
  2. Sin pie de widget: nofooter. Esconde el pie del timeline y la caja para tuitear, si la incluye.
  3. Sin bordes: noborders. Quita todos los borders del timeline (entre los tuits, alrededor del widget).
  4. Sin barras de desplazamiento: noscrollbar. Esconde las barras de desplazamiento, si están visibles.
  5. Transparente: Quita el color del fondo del widget.
  • Color del borde: Cambie el color del borde usado en el widget. el formato de color es hexadecimal como por ejemplo: data-border-color="#cc0000"
  • Idioma del widget: El lenguaje es detectado desde la página usando el atributo del lenguaje HTML lang.
  • Límite de tuits: Se puede delimitar el número de tuits a presentar en el widget, use el atributo data-tweet-limit="5" donde este valor va desde 1 a 20 tuits.
  • Interactividad en tuits: Utilice el atributo data-related="benward,endform" para permitir desde el mismo widget la interacción estando logueado en Twitter pudiendo responder un tuit, hacer retuit y marcarlo como favorito.

Espero que con está información de como crear widgets de Twitter para tu blog puedas ahora mismo colocarlo.

Tu blog debe enriquecerse con todas las herramientas de Redes Sociales de interacción con tu comunidad y que no te olvides que debes proporcionar valor a través de tu blog y verás como tu comunidad te recompensará.

Sr Intelligenius

CREAR WIDGET TWITTER WORDPRESS 

Si te ha gustado este artículo puede compartirlo en Twitter y Facebook en los enlaces de abajo.


Suscríbete a nuestro Newsletter ahora y recibe contenidos exclusivos sobre Marketing, Negocios y Herramientas para Bloggers Emprendedores

Escrito por Sr Intelligenius

Sr Intelligenius

Luis Alfonso Gómez es el autor de este blog y su marca personal Sr Intelligenius ayuda a personas y pequeñas empresas a crear su presencia online, su actitud Social Media y Diseño Web. Con su proyecto de ser Blogger ayudando a otros a serlo para construir Marcas Personales sólidas. Emprendedor incansable creador de ecosistemas emprendedores.

También te puede interesar:

 

Deja un comentario

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *

Uso de cookies

Este sitio web utiliza cookies para que usted tenga la mejor experiencia de usuario. Si continúa navegando está dando su consentimiento para la aceptación de las mencionadas cookies y la aceptación de nuestra política de cookies, pinche el enlace para mayor información.

ACEPTAR
Aviso de cookies