1. Diseño>Edición de HTML>expandimos artilugios
2. Control+F y buscamos <b:include data='post' name='post'>
3. Se sustituye la línea anterior por el código:
<b:if cond='data:blog.pageType != "static_page"'>
<b:if cond='data:blog.homepageUrl != data:blog.url'>
<b:if cond='data:blog.pageType != "item"'>
<div id='titulos'><ul><li>
<a expr:href='data:post.url'><data:post.title/></a>
</li></ul>
</div>
<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>
4. Colocamos CSS para dar estilo a la lista de los títulos. La situamos encima de ]]></b:skin>
#titulos{ /*estilo para el espacio ocupado por la lista */
margin:6px 0px;
background:#fff;
padding:6px;
border:1px solid #e3e2e3}
#titulos ul{ /*estilo de la lista */
margin:0px;
list-style-type:none;
background:#eeeded;
padding:3px;}
#titulos li{ /* estilo para cada item (tÃtulo) de la lista */
background: #fff url(url_del_icono);
padding:15px 0px 3px 40px;
font-weight:bold}
Atención: Para añadir un icono delante de cada título de la entrada sólo en el CSS: en "url_del_icono" se coloca la dirección de la imagen a usar.
5. Eliminamos la fecha de las entradas en esas páginas para que no aparezca sobre los títulos de la lista.
El código de la fecha de las entradas es:
<b:if cond='data:post.dateHeader'>
<h2 class='date-header'><data:post.dateHeader/></h2>
</b:if>
6. Se sustituye por...
<b:if cond='data:blog.homepageUrl == data:blog.url'>
<b:if cond='data:post.dateHeader'>
<div class='date-header'><data:post.dateHeader/></div>
</b:if>
<b:else/>
<b:if cond='data:blog.pageType == "item"'>
<b:if cond='data:post.dateHeader'>
<div class='date-header'><data:post.dateHeader/></div>
</b:if></b:if></b:if>
- Expandir entrada con el post footer incluído
- Expandir entradas en página principal - home
- Listado títulos de entradas en página de etiquetas
- Intentar ver un número determinado de entradas en las anteriores y antiguas
- Mostrar y ocultar cualquier cosa con script simple
- Etiquetas expandir y recoger con script simple
- Archivos Feed expandir o contraer con script simple
- Fórmula simple de contraer o expandir un gadget
- Expandir un post de forma simple
• Con JavaScript con script.aculo.us o prototype - Clásico
• Expandir o recoger un gadget con Scriptaculous - moderno
• Expandir y recoger parte de una entrada con Scriptaculous
• Expandir post con efecto deslizante con javascript