Entradas Expandibles

bueno como veran mi anterior publicacion fue:
 Expandir Entradas solo en las paginas de etiquetas

si no dabes que es una entrada expandible bueno te lo explico:
es cuando solo aparece el titulos de tus publicaciones y en un lugar determinado aparecera un icono o palabras que al hacer click despazara y mostrara la publicacion instantaneamente justo abajo de el titulo y moviendo todos los demas titulos hacia abajo el cual qe una simple funcion javascript y que pudras definir el icono o palabras que al hacer click sobre ellas o el desplazara la publicacion

asi que ya explicado el tema vamos a empezar a agregar esta funcion en tu blog.

 el dia de hoy les enseñare como poner las entradas expandibles en la pagina principal y en las paginas de etiquetas lo que deveras hacer sera lo siquiente:

primero que nada entraremos a la edicion html de nuestra plantilla.
y presionaremos F + Control   O   F3 y buscaras el atributo < / head > 
luego justo encima de esta gregara el siquiente  script:



luego buscaras las palabras que esta en negro y agregaras justamente como aprece lo que esta en Rojo.

<b:includable id='PeekABooPost' var='post'>
<div class='post uncustomized-post-template'>
<table><tr>
<td width='40px'>
<a href='javascript:void(0)' title='Expand/collapse this post' style='text-decoration:none' expr:onclick='"javascript:toggleIt(\"" + data:post.id + "\");"'>[+/-]</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 id='blog-posts'>
<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.pageType != "static_page"'>
<b:if cond='data:blog.homepageUrl != data:blog.url'>
<b:if cond='data:blog.pageType != &quot;item&quot;'>
<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>
<b:else/>
<b:include data='post' name='post'/>
</b:if>
<b:else/>
<b:include data='post' name='post'/>
</b:if>
<b:if cond='data:blog.pageType == "item"'>
<b:if cond='data:post.allowComments'>
<b:include data='post' name='comments'/>
</b:if>
</b:if>
</b:loop>
</div>

Luego guardas la plantilla

Comentarios

Entradas populares de este blog

Evitar ataque de PERFCTL en Servidores con Docker containers

Igual ya no estaremos, pero que va pasar mañana?

Carrusel De Imagenes