Como añadir tu perfil de Twitter a tu blog (Actualizado) · Elena Rueda Quien es Elena Rueda Piazuelo

Como añadir tu perfil de Twitter a tu blog de Blogger y WordPress – Actualizado

Hola a todos!

He recibido una petición de actualización de nuestro post “Como añadir tu perfil de Twitter a tu blog de Blogger y WordPress”, y aquí está la actualización.  Por cierto, que me encanta que corrijáis todas las entradas y os animo a que comentéis todo aquello que consideréis que necesita actualización!

Bueno, al grano!

Como os comentaba en la entrada que estoy actualizando, hacer que aparezcan gadgets en vuestros blog es realmente muy sencillo.

Os dejo un vídeotutorial y en la parte inferior la transcripción con links y más datos.

PASO 1.  ACCEDE A TWITTER Y CREA TU WIDGET

Accede a https://twitter.com/settings/widgets/new.  Te aparecerá una pantalla donde te permite crear a tu gusto el widget de Twitter.

como añadir tu perfil de Twitter a tu blog  Se puede elegir, como puedes ver, una fuente de tu cronología.

                  1. La cronología del ususario, o tu perfil
                  2. Tus tuits Favoritos
                  3. Listas, donde puedes elegir una lista a la que pertenezcas y que aparezcan los tuits de sus componentes.
                  4. Buscar, donde puedes mostrar un hashtag o un término interesante para ti

Ahora, eliges las opciones que más se ajusten a tu blog; colores, medida, y le pinchamos a CREAR WIDGET.  Nos aparecerá a la derecha el código html que deberemos insertar en cada uno de nuestro blog (ya sabéis, botón derecho+copiar), un código como éste:

<a class=”twitter-timeline” href=”https://twitter.com/MaLeN_a /favorites” data-widget-id=”387140598089539584″>Tweets Favoritos de @MaLeN_a</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>

Ahora que lo tienes en el portapapeles ve  a BLOGGER o a WORDPRESS.

  PASO 2. BLOGGER

Accedemos a nuestro blog de Blogger y vamos al apartado de DISEÑO.  Nos aparecerá la pantalla con la estructura de nuestro blog.

añadir gadget de twitter a blogger

Tenemos que añadir nuestro GADGET de Twitter, así que elige la zona donde lo querrás añadir, o en las columnas laterales o en el pie de página de tu blog y pincha AÑADIR GADGET.

Te aparecerá la pantalla donde eliges el gadget.  Busca HTML/Javascript.  Dale al + que te llevará a la ventana que aparece en la fotografía de la derecha.

Ahora, simplemente, tienes que añadir un título (por ejemplo NUESTRO TWITTER) y pegar el código que habéis obtenido de la página de Twitter.

Si le dáis a GUARDAR, y actualizáis vuestro blog, enseguida veréis el cuadro de Twitter donde habíais elegido.

PASO 3. WORDPRESS

En wordpress no ha cambiado nada, podéis saber cómo añadir el widget a través de la entrada anterior.

Insertar widget de Twitter wordpressLo que sí ha añadido WordPress es otro WIDGET donde podemos customizar nuestro widget.

En lugar de añadir TWITTER (la versión más clásica) añade TWITTER TIMELINE.  Te aparecerá el cuadrado de la derecha en tu barra de widgets.

Aquí podrás añadir el widget de Twitter que más te interese tan sólo con el ID del elemento.  pero ¿Cómo consigo el ID del elemento de Twitter?  Muy fácil.

Copia el código html del artilugio en Twitter  y pégalo en un documento de texto, será algo parecido a:

<a class=”twitter-timeline” href=”https://twitter.com/MaLeN_a /favorites” data-widget-id=”387140598089539584“>Tweets Favoritos de @MaLeN_a</a>

Os he marcado en naranja el ID del elemento.  Ahora tan sólo tenéis que añadirlo al cuadro de WordPress (WIDGET ID:), configurar el cuadro según el tamaño y los colores deseados, así como el número de Tuits que queréis que se muestren y ya está!  Ya tenéis montado vuestro widget de Twitter en el blog de WordPress.

Gracias de nuevo a todos los que colaboráis conmigo en que este blog sea mejor.  Todos los comentarios son siempre bienvenidos!

Un fuerte abrazo

Elena

Como añadir tu perfil de Twitter a tu blog

Elena Rueda

Elena Rueda

Soy natural de Alcañiz (Teruel – Spain).En la actualidad trabajo como Marketing Manager, Community Manager, webgardener y soy formadora.

Trabajé durante 10 años en diferentes empresas en puestos siempre relacionados directamente con el cliente.En el 2010 comencé mi andadura profesional como consultora de marketing online y fundé Mucca Marketing Online (http://muccamarketingonline.com), agencia de servicios especializada en Imagen y comunicación en internet, formación e INBOUND MARKETING.
Elena Rueda
Elena Rueda

24 Comments

  1. Javier Trejo 24 octubre, 2013 Reply

    Se ve útil, pero difícil.

    • Elena Rueda Author
      ElenaRueda 24 octubre, 2013 Reply

      Nada difícil! Pruébalo… :-)

      • Javier Trejo 24 octubre, 2013 Reply

        bueno, lo voy a repasar a ver si puedo.

      • Javier Trejo 24 octubre, 2013 Reply

        qué crees, sí pude poner el timeline de twitter, voy a andar viendo qué más aprendo de tu blog.

        • Elena Rueda Author
          ElenaRueda 27 octubre, 2013 Reply

          Enhorabuena! :-) quédate cuanto quieras… Un saludo… Elena

  2. blogjou 14 diciembre, 2013 Reply

    fantásticamente bien explicado. Muchisimas gracias!!!!

    • Elena Rueda Author
      ElenaRueda 16 diciembre, 2013 Reply

      Gracias a tí, blogjou… Y no dudes en pasarte por mi blog cuando quieras…

  3. Aurea 4 enero, 2014 Reply

    pues me parece que hay que actualizarlo de nuevo, porque ahora blogger solo te deja meter una url, a mi me tiene loca, llevo intentando hacer esto varias horas y no lo consigo. afu! Aún así, muchas gracias por compartir lo que sabes! Saludos!

    • Aurea 4 enero, 2014 Reply

      Espera! que acabo de ver que lo haces añadiendo texto o html y no desde “añade uno propio”. Ainssss! que cabecica de melón que tengo!! jajajajaja. Muchas gracias guapa! Ahora si que me voy más feliz que una perdiz!

      • Elena Rueda Author
        Elena Rueda 4 enero, 2014 Reply

        Hola Aurea!… Es lo que quería comentarte… Blogger nunca quitará lo de añadir html, ni lo modificará. Lo que haces en Twitter es conseguir el código html de widget, lo insertas y ya! Me alegro que ya te funcione…. saludos… Elena

    • Elena Rueda Author
      Elena Rueda 4 enero, 2014 Reply

      Gracias por comentar! y me alegro que al final pudieras insertarlo!… Un saludo… Elena

  4. Fabricio 9 enero, 2014 Reply

    xD Cada ves que le doy a guardar se queda sin hacer nada, osea no me lo guarda por que sera?

    • Elena Rueda Author
      Elena Rueda 13 enero, 2014 Reply

      Hola Fabricio,

      No te olvides de después de pinchar a GUARDAR, y se cierre el modo edición del gadget, darle a GUARDAR DISPOSICIÓN (cuadro en naranja, arriba, derecha).

      Si no lo haces no se guardarán los cambios.

      Gracias por escribir y un saludo.

      Elena

      Ah! y no dejes de suscribirte a mi canal de Youtube:
      https://www.youtube.com/user/MukiLaVacaViajera

  5. Manel 11 enero, 2014 Reply

    ¡Muchas gracias Elena, tu post me ha sido de gran ayuda!. Saludos

  6. Dalila 15 enero, 2014 Reply

    Gracias! Estoy configurando mi blog en blogger y me ha venido fenomenal tu tutorial, muy fácil y bien explicado. Te seguiré!!!

  7. alfonsodcc 18 enero, 2014 Reply

    Facilísimo, muchas gracias Elena!
    Mira a ver qué te parece mi Blog: http:// monstersofswag. blogspot. com. es/

    • Elena Rueda Author
      Elena Rueda 19 enero, 2014 Reply

      Gracias por comentar! Muy bien tu blog… sigue adelante!

  8. Sara 20 febrero, 2014 Reply

    Muchas gracias Elena, me ha resultado muy útil 😉

    • Elena Rueda Author
      Elena Rueda 21 febrero, 2014 Reply

      Gracias a ti por visitar mi casa y dejar tus comentarios… Vuelve cuando quieras!
      Elena

  9. Yolanda Moreno 26 febrero, 2014 Reply

    Hola Elena, tú explicación ayuda mucho. Pero yo tengo el problema que cada vez que le doy a guardar, el código html, para crear el gadget en el blog, se queda sin hacer nada, no me guarda

Leave a reply

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

     

*