Expandir post en blogger

Otra alternativa a la entradas muy extensas en blogger. Con el truco anterior de leer más habian algunos problemas, por ejemplo, que en todas las entradas aparece el enlace a "seguir leyendo o leer más" aunque no hubiera nada mas que leer, por lo tanto las entradas antiguas que no tenian la modificacion del post con el codigo, tendrian un enlace innecesario.

Con este truco podrás esconder parte del texto en algunas entradas que sean muy extensas sin tener que volver a cargar la página. Puedes ver un ejemplo aquí.

Lo primero que haremos es ir a plantilla > edicion html y "expadir plantillas de artulugios".

[Actualizado] Habia un error en el siguiente codigo, disculpas! ahora esta bien :)
Antes de </head> pegamos el siguiente código:

<script src='http://chileinicia.googlepages.com/functiontoggleIt.js' type='text/javascript'></script>

Ahora buscarémos el siguiente código:

<b:includable id='post' var='post'>
<div class='post uncustomized-post-template'
<a expr:name='data:post.id'/>
<b:if cond='data:post.title'>
<h3 class='post-title'>
<b:if cond='data:post.url'>
<a expr:href='data:post.url'><data:post.title/></a>
<b:else/>
<data:post.title/>
</b:if>
</h3>
</b:if>
<div class='post-header-line-1'/>
<div class='post-body'>
<p><data:post.body/></p>
<div style='clear: both;'/> <!-- clear for photos floats -->
</div>

Lo seleccionamos todo y lo reemplazamos por este:

<b:includable id='post' var='post'>
<div class='post uncustomized-post-template' expr:id='"post-" + data:post.id'>
<a expr:name='data:post.id'/>
<b:if cond='data:post.title'>
<h3 class='post-title'>
<b:if cond='data:post.url'>
<a expr:href='data:post.url'><data:post.title/></a>
<b:else/>
<data:post.title/>
</b:if>
</h3>
</b:if>
<div class='post-header-line-1'/>
<div class='post-body'>
<b:if cond='data:blog.pageType == "item"'>
<p><data:post.body/></p>
<b:else/>
<style>#fullpost {display:none;}</style>
<p><data:post.body/></p>
<span id='showlink'>
<p><a href='javascript:void(0);' expr:onclick='"javascript:showFull(\"post-" + data:post.id + "\");"'>SEGUIR LEYENDO [+]</a></p>
</span>
<span id='hidelink' style='display:none'>
<p><a href='javascript:void(0);' expr:onclick='"javascript:hideFull(\"post-" + data:post.id + "\");"'>MINIMIZAR [x]</a></p>
</span>
<script type='text/javascript'>
checkFull("post-" + "<data:post.id/>");
</script>
</b:if>
<div style='clear: both;'/> <!-- clear for photos floats -->
</div>

Lo que esta en rojo son los texto que aparecerán para expandir y contraer, puedes cambiarlos por el que quieras, o si quieres agregar una imagen, sustituyelos por el codigo para agregar una imagen:

<img src="http://direcciondeimagen.gif"/>

Ahora, cuando desees que en una entrada aparezca el "expandir", deberás "encerrar" el texto que no aparecerá entre estos codigos en la edicion de HTML del post:

Primer texto, el que si se ve.
<span id="fullpost">
Texto escondido, el que aparecerá al hacer clic en Expandir
</span>

Eso es todo, cualquier duda, pregunten ^^