Mil Trucos Blogger

Timeline en Blogger

Deja tu Reacción sobre el artículo
Me Gusta Dichoso Feliz Admirado Triste Enojado

Muchos servicios han hecho famosa esta forma de mostrar contenido y quizas el mas famoso Timeline sea el de Facebook,pues bien esta funcion tambien esta disponible para Blogger y debido a que soporta JSON nos permite agregarlo a nuestros blogs,pero antes de que fuera 100% compatible con Blogger Emilio Cobos tuvo que cambiar un poco la función init.

Puedes ver el truco en funcionamiento en la siguiente pagina.
 

Para agregar el Timeline a tu blog puedes agregar en la Edicion HTML de una entrada o pagina de tu blog lo siguiente

<link href="http://veritetimeline.appspot.com/latest/timeline.css" rel="stylesheet"></link>
    <style>
    #timeline{
    height:auto;
    position:relative;
    border:3px solid #eee;
    box-shadow: 0 0 10px rgba(0,0,0,.6);
    border-radius:15px;
    margin: 0 auto;
    }
    </style>
    <div id="timeline"></div>
    <script>
    window.TimelineConfig = {
    imagenPresentacion:'URL de la imagen de la primera página',
    chars:500
    }
    </script>
    <script src='http://emiliocobos.site40.net/blogger/demos/timeline/timeline-min.js'></script>
    <script>
    var time = new VMM.Timeline("100%","500px");//anchura y altura
    $.ajax({
    dataType:'jsonp',
    url:'http://UE
RLDTUBLOG.blogspot.com/feeds/posts/default?alt=json-in-script&max-results=20',//20 es el nº de entradas
    success:function(data){
    time.init(bloggerTimeline(data))
    }
    });
    </script>

En color azul estan los valores editables con los que puedes personalizar un poco el truco.

*Necesitas tener en tu plantilla jQuery

Via/Emilio Cobos

0
Shares

Relacionados...

Deja tu Reacción sobre el artículo
Me Gusta Dichoso Feliz Admirado Triste Enojado

17 Comentarios

  1. Abril 16, 2012    

    :O… Tremendo bro!!!.. Lo pondre ahora mismo .. Gracias por el aporte… regresare para confirmar.. el funcionamiento :3

    • Abril 16, 2012    

      🙁 no me funciono…. solo me sale un cuardo sombreado pero no me sale nada… lo agrege en un nueva pagina en mi blogger… con edicion HTML… pero nada 🙁

    • Abril 17, 2012    

      Carlos te debe funcionar,acabo de comprobar su correcto funcionamiento en un blog de pruebas :8S:

  2. Anonymous Anonymous
    Abril 16, 2012    

    Hola juvinao como puedo conseguir la ventanita flotante de facebook es como esta mira http://i39.tinypic.com/347a6wm.jpg
    esta en la web http://www.rojadirectavivo.net/ en caso de que pudieras hacerlo pudieras hacer un tutorial de como saludos

    • Abril 17, 2012    

      El problema amigo es que el blog que dices usa WordPress.org y este es muy diferente a Blogger pero tratare de hacer algo similar.

    • Anonymous Anonymous
      Abril 17, 2012    

      Ok juvinao pero tanvein lo evisto en blogger mira esta en esta pagina http://www.speedlive.net/

    • Abril 18, 2012    

      Si ya vi la pagina y ya encontre un truco parecido aunque no igual pero de todas formas creo que te servira.

  3. Abril 16, 2012    

    Que cosa más increible Juvinao, he visto el ejemplo y me gusta como queda. Más tarde lo pruebo y si veo como queda tal vez lo deje.

    Buen aporte compa! 😀

    • Abril 17, 2012    

      De verdad te gusto amigo.. Que bueno de verdad que si es un truco muy bueno y es genial el trabajo que hizo Emilio Cobos con el Timeline.

  4. Alberto Alberto
    Abril 17, 2012    

    Hola, muchas gracias por tan útil información, yo tengo en mis planes crear un blog por ello estoy tratando de aprender todo lo relacionado.

    Tus artículos me son de gran ayuda y poco a poco estoy aprendiendo y se me está aclarando la mente sobre lo que en realidad es un blog.

    Yo actualmente leo todos tus artículos día a día y estoy inscrito en el Curso Gratis: “Aprendiendo a Crear tu Propio Blog Profesional y Genera ingresos $$$ en el camino” de http://www.blogueaygana.com porque creo que en realidad es necesario q conozca lo + importante sobre blogs.

    PD. Yo ya leí ALGUNOS DE TUS artículos 🙂 y cursos gratuitos… ¿Hay algún otro curso gratis de tu página o de otro blog que me recomiendes estudiar?

    Muchisimas gracias, espero tu respuesta 🙂

  5. Abril 23, 2012    

    Bunos Dias Soy Nuevo en estos temas y me gustaria preguntarte una cosa.

    estado realizando los pasos que comentas pero cundo cargo la pagina me sale Loading Timeline y no carga que puede ser esto
    gracias.

    • Abril 23, 2012    

      Por favor dejame la URL de tu blog para poder determinar cual es el problema.

  6. Abril 23, 2012    
    • Abril 25, 2012    

      El problema es que no tienes una URL para el autor. El script no es capaz de leerla, y da un error. Ya lo he solucionado 😉

    • Abril 26, 2012    

      Gracias amigo tus comentarios son muy acertados.

  7. Abril 25, 2012    

    Muchas gracias

Deja un comentario

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

Categorías

Síguenos en Facebook

Suscribete por Email

Introduce tu Correo:

Recibiras nuestros últimos posts en tu correo