Ver todas las entradas del blog con un CLICK

Este es un efecto que había visto en Elescaparate, Gemablog, Ciudad Blogger y otros. Es un efecto bastante agradable -opinión personal- , y como las informaciones de éste tipo hay que compartirlas, aunque ésta es "noticia vieja" -no me importa-, hoy les dejo el paso a paso para su implementación.

Para comenzar accedemos a nuestra plantilla de la manera acostumbrada, expandimos artilugios, y ayudados por nuestro buscador de códigos (CTRL+F) ubicamos </head>, y sobre él colocamos éste código:

<script type='text/javascript'>

function toggleIt(id) {

post = document.getElementById(id);

if (post.style.display != 'none') {

post.style.display = 'none';

} else {

post.style.display = '';

}

}

</script>

<script src="http://www.filefront.com/14580365/Expandibles.js/ " type="text/javascript">

</script>

Seguidamente, de igual manera que el anterior, buscamos el código que nos aparece en negro, y lo que está en color rojo lo agregamos tal cual aparece:

    <b:includable id='PeekABooPost' var='post'>

    <div class='post uncustomized-post-template'>

    <table><tr><td width='40px'>

    <a expr:onclick='"javascript:toggleIt(\"" + data:post.id + "\");"' href='javascript:void(0)' style='text-decoration:none' title='Desplegar esta entrada'>[+/-]</a></td>

    <td><h3 class='post-title'><a expr:href='data:post.url'><data:post.title/></a></h3></td></tr></table>

    <div class='post-body' expr:id='data:post.id' style='display:none'>

    <p><data:post.body/></p>

    <div style='clear: both;'/> <!-- clear for photos floats -->

    </div>

    </div>

    </b:includable>



    <b:includable id='main' var='top'>

    <!-- posts -->

    <div class='blog-posts hfeed'>

    <b:include data='top' name='status-message'/>

    <data:adStart/>

    <b:loop values='data:posts' var='post'>

    <b:if cond='data:post.dateHeader'>

    <h2 class='date-header'><data:post.dateHeader/></h2>

    </b:if>



    <b:if cond='data:blog.homepageUrl != data:blog.url'>

    <b:if cond='data:blog.pageType != "item"'>

    <b:include data='post' name='PeekABooPost'/>

    <b:else/>

    <b:include data='post' name='post'/>

    </b:if>

    <b:else/>



    <b:include data='post' name='post'/>



    </b:if>

Luego de esto guardamos los cambios, y de seguidas colocamos éste código en un menú:

<a href="http://tublog.blogspot.com/search?max-results=1000">Mostrar todas las entradas</a>

O éste otro con la imágen de un botón "Ver todas las Entradas"

<a href="http://tublog.blogspot.com/search?max-results=1000"><img src="URL de la imagen"/></a>

De ésta manera concluímos esperando, como siempre, les sea de utilidad.