Cada vez se utilizan más las redes sociales en el aula y Twitter es una de las que nos puede servir en clase.

Vamos a ver como enlazar nuestra página de rotafolios con una cuenta de Twitter. Nos llevará muy poco tiempo (copiar – pegar) y podemos tener más de una cuenta en la misma página.

En una página de nuestro rotafolios iremos al menú Insertar elegimos la opción Vínculo y dentro de esta elegimos HTML incrustado…

Copiamos el siguiente código y lo pegamos en el HTML incrustado…

<script charset="utf-8" src="http://widgets.twimg.com/j/2/widget.js"></script>
<script>
new TWTR.Widget({
  version: 2,
  type: 'profile',
  rpp: 6,
  interval: 6000,
  width: 202,
  height: 335,
  theme: {
    shell: {
      background: '#dfe1e3',
      color: '#333333'
    },
    tweets: {
      background: '#ffffff',
      color: '#333333',
      links: '#940f04'
    }
  },
  features: {
    scrollbar: true,
    loop: false,
    live: false,
    timestamp: true,
    avatars: false,
    behavior: 'all'
  }
}).render().setUser('ManualActiv').start();
</script>

De color azul tenemos la parte del código que podemos modificar para adaptar el objeto a nuestro gusto en cuanto al tamaño y colores.
  • width: ancho del objeto
  • height: alto del objeto
  • background: color de fondo del objeto.
  • color: color de texto del nombre de la cuenta.
  • background: color de fondo de los tweets.
  • color: color del texto de los tweets.
  • links: color de los enlaces que aparecen en los tweets.
  • avatars: poner el valor true si queremos mostrar el avatar del tweet.
De color rojo en la parte final del código es donde debemos sustituir el nombre que veis ahí por el de la cuenta que queremos mostrar.

Los colores están en código hexadecimal en esta página de la Wikipedia podéis encontrar unas tablas de colores con el valor hexadecimal.

Podemos insertar cuantas veces necesitemos este código en diferentes HTML incrustado… Sin olvidarnos de cambiar el nombre de la cuenta.

6 Comentarios hasta ahora.

  1. Muy buen recurso. El HTML incrustado es un recurso imprescindible y enriquecedor para preparar un rotafolios. ActivInsprire se ha adelantado a sus rivales con esta funcionalidad.

  2. Hola.

    Pues sí, es todo un acierto, esta es una de mis herramientas favoritas. Desgraciadamente, utiliza el motor de Internet Explorer y creo que de una versión algo antigua con lo que a veces muestra una página web pero no funcionan sus enlaces o los objetos que contienen no se ven correctamente. Pero aún así, es una gran herramienta.

    Un saludo.

  3. Unknown dice:

    Hola Emilio, como siempre que tengo dudas con ActivInspire, me paso por tu blog. Te quería preguntar por la posibilidad de insertar en el rotafolio uno o varios blogs de aula, tal y como has hecho en este ejemplo con Twitter. Los alumnos trabajan por equipos y cada equipo elabora un blog donde van recogiendo evidencias del proceso, ¿es posible que cada vez que abramos este rotafolio, aparezcan incrustados los blogs?, no como enlaces de web, no sé si me explico.

    Muchas gracias por tu ayuda y por tu blog.

  4. Hola.

    Gracias por tus palabras. Se puede hacer lo que me preguntas, si buscas un artículo que titulé Incrustar puedes ver al final de ese artículo el código que utilizé para mostrar mi blog en un rotafolios.

    Todo el proceso es muy sencillo, debes utilizar la herramienta Incrustar HTML copiar el código en ella y sustituir la dirección del blog.

    Un saludo.

  5. Unknown dice:

    Hola Emilio,

    ¿Y si queremos mostrar un hashtag y no la cuenta de ningún usuario? ¿Cómo lo hacemos?

    Muchas gracias!

  6. Hola.

    En la línea type pon 'search' en vez de 'profile' a continuación añade la línea search: '#hashtag', sustituye lo que está entre comillas por tu hastag.

    Elimina en la penúltima línea .setUser('ManualActiv')

    Espero que te sirva. Un saludo.

Deja un comentario