Expandir y contraer los archivos del blog.

Esta es una aplicación con la que ganaremos espacio en el lugar donde se reflejan los archivos de nuestro blog: Sidebar. A medida que transcurre el tiempo y vamos agregando más entradas al blog, comienza a formarse una lista inmensa que llega a ocupar un sitio importante y considerable dentro del espacio útil de la sidebar. Para resolver éste "problema", vamos a colocar un código dentro de nuestra plantilla, cedido gentilmente por Rosa María.

Accedemos a nuestro blog de la forma acostumbrada y nos vamos a EDICION HTML. Sin expandir artilugios ubicamos en la plantilla con el buscador de códigos CTRL+F, lo siguiente:

<b:widget id='BlogArchive1' locked='false' title='Archivo del blog'
type='BlogArchive'/>

Esta parte corresponde al gadget de "archivos", y sin pensarlo dos veces lo eliminamos y colocamos en su lugar este código:

<b:widget id='BlogArchive1' locked='false' title='Archivo del blog' type='BlogArchive'>

<b:includable id='main'>

<script type='text/javascript'>

//<![CDATA[

if(typeof(rnd) == 'undefined') var rnd = '';

rnd = Math.floor(Math.random()*1000);

rnd = 'id-' + rnd;

document.write('<a href="#" onclick="tmp = document.getElementById("' + rnd + '"); tmp.style.display = (tmp.style.display == "none") ? "block" : "none"; return false;" style="float:left;margin-right:5px;">');

//]]>

</script>[+/-]

<script type='text/javascript'>

//<![CDATA[

document.write('<\/a>');

//]]>

</script>

 <b:if cond='data:title'>

   <h2><data:title/></h2>

 </b:if>

 <div class='widget-content'>

<script type='text/javascript'>

//<![CDATA[

document.write('<div id="' + rnd + '" style="display:none;">');

//]]>

</script>

 <div id='ArchiveList'>

 <div expr:id='data:widget.instanceId + "_ArchiveList"'>

   <b:if cond='data:style == "HIERARCHY"'>

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

   </b:if>

   <b:if cond='data:style == "FLAT"'>

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

   </b:if>

   <b:if cond='data:style == "MENU"'>

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

   </b:if>

 </div>

 </div>

<script type='text/javascript'>

//<![CDATA[

document.write('<\/div>');

//]]>

</script>

 <b:include name='quickedit'/>

 </div>

</b:includable>

<b:includable id='flat' var='data'>

 <ul>

   <b:loop values='data:data' var='i'>

     <li class='archivedate'>

<a expr:href='data:i.url'><data:i.name/></a> (<data:i.post-count/>)

     </li>

   </b:loop>

 </ul>

</b:includable>

<b:includable id='menu' var='data'>

 <select expr:id='data:widget.instanceId + "_ArchiveMenu"'>

   <option value=''><data:title/></option>

   <b:loop values='data:data' var='i'>

<option expr:value='data:i.url'><data:i.name/> (<data:i.post-count/>)</option>

   </b:loop>

 </select>

</b:includable>

<b:includable id='interval' var='intervalData'>

 <b:loop values='data:intervalData' var='i'>

     <ul>

       <li expr:class='"archivedate " + data:i.expclass'>

         <b:include data='i' name='toggle'/>

         <a class='post-count-link' expr:href='data:i.url'><data:i.name/></a>

           <span class='post-count' dir='ltr'>(<data:i.post-count/>)</span>

         <b:if cond='data:i.data'>

           <b:include data='i.data' name='interval'/>

         </b:if>

         <b:if cond='data:i.posts'>

           <b:include data='i.posts' name='posts'/>

         </b:if>

       </li>

     </ul>

 </b:loop>

</b:includable>

<b:includable id='toggle' var='interval'>

 <b:if cond='data:interval.toggleId'>

 <b:if cond='data:interval.expclass == "expanded"'>

<a class='toggle' expr:href='data:widget.actionUrl + "&action=toggle" + "&dir=close&toggle=" + data:interval.toggleId + "&toggleopen=" + data:toggleopen'>

       <span class='zippy toggle-open'>▼ </span>

   </a>

 <b:else/>

<a class='toggle' expr:href='data:widget.actionUrl + "&action=toggle" + "&dir=open&toggle=" + data:interval.toggleId + "&toggleopen=" + data:toggleopen'>

         <span class='zippy'>

           <b:if cond='data:blog.languageDirection == "rtl"'>

             ◄

           <b:else/>

             ►

           </b:if>

         </span>

   </a>

 </b:if>

</b:if>

</b:includable>

<b:includable id='posts' var='posts'>

 <ul class='posts'>

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

<li><a expr:href='data:i.url'><data:i.title/></a></li>

   </b:loop>

 </ul>

</b:includable>

</b:widget>"

La vista de como quedará la tienes a continuación:















Espero les sea de utilidad.