init
, para que soporte objetos directamente, y poder usarla con blogger.
Ésto sería un ejemplo:
Ver TimelineOcultar
Como véis, es una línea cronológica en la que se muestran las entradas por orden cronológico inverso. Es necesario tener en la plantilla jQuery. El código que hay que usar es, en un gadget Html/Javascript, o directamente en la edición de HTML. Tenéis que cambiar algunos valores, como la dirección del blog o la imagen de la primera página.
<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" class="vmm-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://URLDETUBLOG.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>
great post,
thanks
You're welcome. Thanks for your comment.
Amazing master \m/
I do not understand at all about script :D
Latest news from the web "Embed generator coming soon!" Hohoho ;)
Sorry, just deleted my previous comment by mistake.
Scripting is not as difficult as it seems :)
anout the generator, it wouldn't be bad ;)
Original forma de presentar un blog. Conocía algunos servicios que te lo mostraban con ese estilo Timeline, pero lo hacían en su propio dominio. Este sería un buen sustituto de los cada vez más usados sliders de "entradas recientes".
Y ya que lo he visto… muy ocurrente la manera de marcar los comentarios propios ;)
Y otra cosa: odio los captchas LOL
Es un script muy bien organizado. Tal vez la única pega sea que tenga muchos requerimientos, pero merece la pena.
Sobre lo del autor, es una cinta hecha con http://www.css3d.net/ribbon-generator/ e insertada via javascript.
Tomo nota sobre los captchas :)
why the beginning of the timeline (post) is different?
there is a blog post that began in January 2012, and on other blogs in March 2012!!!
What is it the performance?
The begginning is a presentation page, which contains the title, the description and image configured by the user or a thumb of the blog.
Posts are ordered inversely, starting in the published date and ending in the last updated day.
In this case I've used the last twenty posts. The twentieth starts in "January 31, 2012", and is iterating over the posts until the last one (this, which, I don't know why has a problem with the date and only detects that was published in April).
In other blogs it depends of how many posts have the admin chosed and how much time has passed since the post was published. In this case (I think you're referred to Vagabundia), JMiur has chosed 20 post, and the twentieth was published in march.
As the script is large, I recommend loading it asynchronously, like in this post (see this).
If not, the page will load a bit slower, but anyway, I don't think it is a big problem.
Excelente amigo ya lo uso en mi blog y te queria pedir permiso para llevar este articulo a mi blog claro respetando los derechos de autor
Sin ningún problema :)
Emilio el Timeline esta presentando problemas,se deforma bastante
Es cierto, no carga el CSS, no sé por qué, ahora intentaré solucionarlo
Solucionado. Por lo visto han cambiado todo el CSS para usar clases, y no usan la Id "timeline". Por eso ahora hay que poner <div id="timeline" class="vmm-timeline"></div>
Gracias por avisar juvinao :)
Buenas ,
esta genial ,pero se me queda un poco estrecho, no se si habria forma de ponerlo mejor dejo aqui el enlace :
http://eduardoelorriaga.blogspot.com/p/cronologia.html
saludos y felicidades por el blog :D
por lo que he visto, no tienes jQuery instalado. Tienes que poner el script a jQuery (<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js'/>)
antes de este script.
si lo pongo no va el slider….y tampoco parece q funcione el scrip ahora no se ve nada de nada xd
Tienes que ponerlo antes del script. Veo que tienes jQuery puesto en el fondo del blog, por lo que es imposible que se cargue el timeline antes del script.
Además, veo multiples errores de javascript, que pueden influir.
en este lo he puesto al principio pero sigue igual, siento mi ignorancia, pero como miro los errores de javascript? XD
saludos
Si usas firefox, instala firebug. Si usas otro navegador (chrome,opera,IE) no será necesario.
Entra en tu página y pulsa F12. Recarga por si acaso. Haz click en la pestaña "Consola". Todo lo que viene en rojo son errores.
Ahora que me fijo, tienes también instalado una versión antigua de jQuery, que puede ser el problema. Busca "jQuery JavaScript Library v1.4.2" y borra todo ese script.
q buena ya anda bien ……era quitando el script ese ,que por cierto era enorme.
Muchas gracias….a ver si en el siguiente que ponga soy capaz XD
Me alegro de que ya funcione ;)
En este blog se ve todo menos la parte de abajo :
http://nuestra-guerra.blogspot.com/p/cronologia.html
Tiene toda la pinta de ser un error de javascript externo, veo muchos errores en la consola, pero no te puedo decir que uno sea la causa.
Lo que sí te puedo decir es que tienes instalado jQuery tres veces, y es posible que sea la causa, ya que la última versión que aparece es la 1.4.2 (desfasada). Busca en "Edición HTML" jquery.min.js y deja sólo el primero que te encuentres.
en este ya anda muchas gracias jefe :D
Hola.
Quiero insertar este código de Twitter:
<a class="twitter-timeline" href=”https://twitter.com/PepePilato” data-widget-id="290648333071024130">Tweets por @PepePilato</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>
Es para mostrar mis últimos tweets, pero no funciona, se supone que en un elemento HTML/JAVASCRIPT en la side debería funcionar, pero no me aparece nada, sólo un texto.
Lo intento poner en este blog:
http://blogprueba2011.blogspot.com
Gracias y saludos.
El código de twitter cambió con la api 1.1, así que ahora tienes que crear los widgets aquí:
https://twitter.com/settings/widgets
Sí, ese es el que quiero poner, pero no me funciona…
Yo lo acabo de poner y parece que funciona… Puedes probar a ponerlo en el sitio y cuando lo hagas avisas y le echo un vistazo a ver qué puede ser?
Sí, ya me funciona, gracias.