Como centrar un tuit en un blog

Share on facebook
Facebook
Share on twitter
Twitter
Share on linkedin
LinkedIn
Share on whatsapp
WhatsApp

De vez en cuando veréis que hay algunos artículos que acompaño de Tweets. Para ello lo que hago es embeber los 140 caracteres en vez de enlazar al tuit en cuestión, puesto que de ésta manera aporta mucho más valor al  propio post.
Por ejemplo, en el artículo 8 sencillos pasos para destruir tu negocio online tuve que incluir en el artículo 2 tuits y una imagen, al no saber aún como podía centrar los tuits el resultado fue un artículo con buen contenido pero visualmente feo.
Así que decidí que sería el último artículo en el que los tuits que incluyesen aparecerían alineado a la izquierda, y buscaría la manera de centrarlos para hacer post más homogéneos y ordenados.
Para conseguir centrar los tuits que queremos incluir en nuestro blog solamente deberemos seguir unos sencillos pasos:

Paso 1: Generar el código del Tweet
Para generar este código solamente deberás seleccionar la opción más y seleccionar Insertar Tweet

Centrar Tweets Embebidos en tu blog
Centrar Tweets Embebidos en tu blog

Paso 2: Copia el código de inserción generado en el paso anterior

Centrar Tweets Embebidos en tu blog
Centrar Tweets Embebidos en tu blog

El código resultante se parecerá al siguiente

<blockquote lang=»es»><p>No eres feo… Sutileza…. Que tengáis buen viernes <a href=»https://twitter.com/search?q=%23socialSDR&amp;src=hash»>#socialSDR</a> <a href=»https://twitter.com/search?q=%23socialinmedia&amp;src=hash»>#socialinmedia</a> <a href=»https://twitter.com/search?q=%23FelizViernes&amp;src=hash»>#FelizViernes</a> <a href=»//t.co/Q8Z2KNPHAc»>pic.twitter.com/Q8Z2KNPHAc</a></p>&mdash; Socialinmedia (@socialinmedia) <a href=»https://twitter.com/socialinmedia/statuses/431692486323761152″>febrero 7, 2014</a></blockquote>

<script async src=»//platform.twitter.com/widgets.js» charset=»utf-8″></script>

Paso 3: Ahora pegamos el código generado en tu Blog

En el momento que pegues el código, como se hace con un vídeo de Youtube, se insertará por defecto alineado a la izquierda, y quedará de la siguiente manera

El código resultante se parecerá al siguiente

Paso 4: Centrar el Tweet Embedded

Para centrar el tuit anterior solamente deberemos modificar un poco el texto que pegamos añadiendo al principio del código tw-align-center. Es decir deberemos incluir tw-align-center a <blockquote class=»twitter-tweet» lang=»es»>y nos quedaría lo siguiente <blockquote class=»twitter-tweet tw-align-center» lang=»es»>.
Por tanto ahora el nuevo código será el siguiente

<blockquote class=»witter-tweet tw-align-center» lang=»es»><p>No eres feo… Sutileza…. Que tengáis buen viernes <a href=»https://twitter.com/search?q=%23socialSDR&amp;src=hash»>#socialSDR</a> <a href=»https://twitter.com/search?q=%23socialinmedia&amp;src=hash»>#socialinmedia</a> <a href=»https://twitter.com/search?q=%23FelizViernes&amp;src=hash»>#FelizViernes</a> <a href=»//t.co/Q8Z2KNPHAc»>pic.twitter.com/Q8Z2KNPHAc</a></p>&mdash; Socialinmedia (@socialinmedia) <a href=»https://twitter.com/socialinmedia/statuses/431692486323761152″>febrero 7, 2014</a></blockquote>
<script async src=»//platform.twitter.com/widgets.js» charset=»utf-8″></script>

<script async src=»//platform.twitter.com/widgets.js» charset=»utf-8″></script>

Paso 5: Resultado

Share on facebook
Facebook
Share on twitter
Twitter
Share on linkedin
LinkedIn
Share on whatsapp
WhatsApp

¿Quieres recibir nuestras actualizaciones?

Get updates and learn from the best

More To Explore

8 comentarios en “Como centrar un tuit en un blog”

  1. Iván Izquierdo

    Me parece un post de mucha utilidad, sin embargo, en mi caso al incluir el código tw-align-center me borra la imagen y sólo aparece el texto del tuit. ¿Algún consejo sobre esto?, lo agradezco de antemano.

    1. Iván puede ser por el propio theme que utllices, a mi me pasa con otro blog en el cual al incluir algub código me da problemas.

      Un saludo

  2. Buen día Rafael!…
    Gracias por tu aportación, me ha sido de mucha utilidad.
    Por otra parte te consulto si tienes entre tus curiosidades la solución para post de facebook y poder centrarlo al insertarlo en un post, como es el actual caso?.
    Por tu atención, muchas gracias!…

    1. Rafael Perez Revilla

      Antonio buenas tardes:
      Gracias por tu comentario, respecto a Facebook creo que se realice de igual forma, usando la etiqueta “

      ” y “

      Saludos 😉

Deja un comentario

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

Este sitio usa Akismet para reducir el spam. Aprende cómo se procesan los datos de tus comentarios.

Ir arriba