Un ejemplo en practica lo puedes encontrar a la derecha de esta publicacion, hay esta el BlogRoll a tu disposicion. En el boton de Dark Horse se muentran las publicaiones con la etiqueta Dark Horse, se crea un directorio personalizado. Solo agrego la etiqueta a la publicacion y automaticamente se suma.
Importante: Bajo ningun motivo "NO" elimines las comillas o signos de puntuacion, que se encuentran juntos a las zonas a editar, solo modifica las palabras que estan remarcadas.
1.- Entra en Plantilla | Edición de HTML y antes de:]]></b:skin> pega el siguiente codigo de estilos (en html pegar antes de </style>):
#accordion input{display:none}#accordion label{border:2px solid #bbb;font-size:11pt;font-weight:700;color:#999;text-align:center;background-color:#111;background-image:-moz-linear-gradient(#444,#111);background-image:-webkit-gradient(linear,left top,left bottom,from(#444),to(#111));background-image:-webkit-linear-gradient(#444,#111);background-image:-o-linear-gradient(#444,#111);background-image:-ms-linear-gradient(#444,#111);background-image:linear-gradient(#444,#111);box-shadow:0 4px 4px -4px rgba(0,0,0,.7)!important;border-radius:10px;cursor:pointer;display:block;margin:14px 0 0!important;padding:.5em 15px;z-index:20}#accordion label:hover{border:1px solid #bbb;color:#333;text-shadow:0 1px 0 #fff;background:#fff;background:-webkit-gradient(linear,left top,left bottom,from(#fff),to(#fff)) #fff;background:-webkit-linear-gradient(#fff,#fff) #fff;background:-moz-linear-gradient(#fff,#fff) #fff;background:-ms-linear-gradient(#fff,#fff) #fff;background:-o-linear-gradient(#fff,#fff) #fff;background:linear-gradient(#fff,#fff) #fff}#accordion input:checked+label{border:1px solid #bbb;font-weight:700;text-shadow:0 1px 0 #eee;background:-webkit-gradient(linear,left top,left bottom,from(#ddd),to(#bbb)) #bbb;background:-webkit-linear-gradient(#ddd,#bbb) #bbb;background:-moz-linear-gradient(#ddd,#bbb) #bbb;background:-ms-linear-gradient(#ddd,#bbb) #bbb;background:-o-linear-gradient(#ddd,#bbb) #bbb;background:linear-gradient(#ddd,#bbb) #bbb;border-bottom-right-radius:0;border-bottom-left-radius:0;color:#000;margin-bottom:0;padding:.25em 1em}#accordion article{height:0;overflow:hidden;z-index:10}#accordion article p{padding:0em}#accordion input:checked~article{border:1px solid #bbb;box-shadow:0 4px 4px -4px rgba(0,0,0,.7)!important;border-bottom-left-radius:.25em;border-bottom-right-radius:.25em;height:auto;padding:.5em;margin-bottom:.125em;}
2 -Entra en Diseño | Elementos de la página | Añadir un gadget | HTML/Javascript y ahí pega todo el siguiente codigo:
<section id="accordion"><script type="text/javascript">function showrecentposts(t){for(var e=0;numposts>e;e++){var n,r=t.feed.entry[e],i=r.title.$t;if(e==t.feed.entry.length)break;for(var a=0;a<r.link.length;a++)if("alternate"==r.link[a].rel){n=r.link[a].href;break}i=i.link(n),standardstyling&&document.write("<li>"),document.write(i)}standardstyling&&document.write("</li>")}var numposts=99999,standardstyling=!0;</script>
<div>
<input type="checkbox" name="accordion-group" id="option-1" />
<label for="option-1">Option 1</label>
<article>
<p><script src="/feeds/posts/default/-/Etiqueta?orderby=published&alt=json-in-script&callback=showrecentposts&max-results=10"></script></p>
</article>
</div>
<div>
<input type="checkbox" name="accordion-group" id="option-2" />
<label for="option-2">Option 2</label>
<article>
<script src="/feeds/posts/default/-/Etiqueta?orderby=published&alt=json-in-script&callback=showrecentposts&max-results=10"></script>
</article>
</div>
<!-- Pega aqui el codigo para agregar una nueva seccion -->
</section>
<div>
<input type="checkbox" name="accordion-group" id="option-1" />
<label for="option-1">Option 1</label>
<article>
<p><script src="/feeds/posts/default/-/Etiqueta?orderby=published&alt=json-in-script&callback=showrecentposts&max-results=10"></script></p>
</article>
</div>
<div>
<input type="checkbox" name="accordion-group" id="option-2" />
<label for="option-2">Option 2</label>
<article>
<script src="/feeds/posts/default/-/Etiqueta?orderby=published&alt=json-in-script&callback=showrecentposts&max-results=10"></script>
</article>
</div>
<!-- Pega aqui el codigo para agregar una nueva seccion -->
</section>
3-Antes del </section> (al final del codigo en el paso 2), pegaremos el siguiente codigo el numero de veces segun sean nuestras nesecidades y crearemos las secciones:
<div>
<input type="checkbox" name="accordion-group" id="option-X" />
<label for="option-X">Option 2</label>
<article><script src="/feeds/posts/default/-/Etiqueta?orderby=published&alt=json-in-script&callback=showrecentposts&max-results=10"></script>
</article>
</div>
<input type="checkbox" name="accordion-group" id="option-X" />
<label for="option-X">Option 2</label>
<article><script src="/feeds/posts/default/-/Etiqueta?orderby=published&alt=json-in-script&callback=showrecentposts&max-results=10"></script>
</article>
</div>
Personalizacion:
Option: Nombre del boton a mostrar antes de hacer clic.
Etiqueta: Reemplaza esta seccion con el nombre de tu etiqueta.
max-results=10: Cambia el valor por los numeros de resultados
<label for="option-1">= modifica el numero para cada nueva seccion. Ejemplo: la primera es ('option1'), la segunda sera ('option2') y asi sucesivamente. Y bajo ningun motivo, mas de una seccion debe tener el mismo valor.
checkbox: cambie este valor por radio si desea modificar el comportamiento
Etiqueta: Reemplaza esta seccion con el nombre de tu etiqueta.
max-results=10: Cambia el valor por los numeros de resultados
<label for="option-1">= modifica el numero para cada nueva seccion. Ejemplo: la primera es ('option1'), la segunda sera ('option2') y asi sucesivamente. Y bajo ningun motivo, mas de una seccion debe tener el mismo valor.
checkbox: cambie este valor por radio si desea modificar el comportamiento
Espero que sea de utilidad.
