Expand/Collapse, Ocultar/Mostrar

Este es un truco para ocultar y mostrar cualquier cosa que deseemos tener "recogida". Pueden añadirse enlaces, imágenes, listas, etc. Se puede usar en las entradas o en los widgets.

1. Colocamos este código en la parte del CSS de nuestra plantilla, por ejemplo antes de ]]></b:skin>:

.commenthidden {display:none}
.commentshown {display:inline}

2. Colocamos ahora este script justo antes del </head> de nuestra plantilla.

<script type="text/Javascript">
function togglecomments (postid) {
var whichpost = document.getElementById(postid);
if (whichpost.className=="commentshown")
{ whichpost.className="commenthidden"; }
else { whichpost.className="commentshown"; }
}
</script>

3. Colocamos este código donde queramos (entradas, widgets, etc.):

<a title="Ver/Ocultar" 
href="javascript:togglecomments('UniqueName')">
+/- Título</a><br />
<div class="commenthidden" id="UniqueName">

AQUÍ LO QUE QUEREMOS OCULTAR

</div>

Cuando pinchemos sobre +/- se abrirá la lista de links o lo que sea que hayamos puesto, cuando se vuelva a pinchar se recogerá.

Importante

Donde dice "UniqueName" dentro del último código lo sustituimos por una palabra cualquiera que no se esté usando en otro código de la plantilla.

Si vas a colocar más de un elemento con este truco, recuerda que no puedes usar la misma palabra.

Dejando el "UniqueName" y añadiendo al segundo elemento un 1 detrás "UniqueName1", al tercero un 2 "UniqueName2"... funciona perfectamente.

Truco de BlogU