AVISO IMPORTANTE

Si quieres un menú como este de los botones, pincha en el que tiene un interrogante. Te llevará a la página de donde saqué el código y si tienes algún problema o duda, su creador te ayudará a resolverlo.

Normas de obligado cumplimiento si me envias un mail pidiendo ayuda/consejo

1ª .- Adjunta SIEMPRE la dirección del blog en el que tengas el problema y procura escribir bien la dirección.

2ª .- Intenta explicar LO MAS CLARAMENTE POSIBLE tu problema.
No pagarás más por escribir más palabras.

3ª . - Si has de contestarme usa la opción RESPONDER.
No abras un nuevo hilo de mensajes.

4ª .- No me envies NUNCA la plantilla si no te la pido.

5ª .- No me envies NUNCA la contraseña.
NO PIENSO ENTRAR A MODIFICARTE NADA.

SI ME DEJAS LA PREGUNTA EN UN COMENTARIO
1º .- Si tienes más de un blog dime en cual está el problema.
2º .- Habilita el perfil para que pueda entrar a ver el blog.
3º .- Si el blog es privado tampoco podré verlo. Invítame.

Y por último: Si quieres que te conteste por mail, envíame la pregunta por mail, mi dirección está en la sidebar, en el botón de arriba que tiene un sobre y en casi todos mis blogs.

Esconder el contenido de los gadgets tras un [+/-]

miércoles, 28 de octubre de 2009

Llevaba varios días dándole vueltas a una idea: Hacer que las listas de enlaces del Directorio se mostraran encogidas, que solo se viera el título y un [+/-] o algo parecido, para expandirlos. De esta forma, pensé, el blog sería menos mareante para quien entre en busca del enlace a alguna entrada, ya que están todas bien catalogadas en distintas listas. (Los que lo usais ya me entendeis).

Esto también me permitiría volver a dejarlas en solo 3 columnas, con lo que cada enlace, o la mayoría de ellos, estaría en una sola línea.

Probé el truco de las librerias y el efecto toogle, pero, por alguna extraña razón que no he logrado averiguar, no me funcionó ni allí ni aquí.

He buscado información acerca de ésto, he mirado el código fuente de algunos blogs que lo tienen, pero en los mios este truco se limita a llevarme arriba sin abrir el gadget.
Incluso le escribí a gem@ a ver si ella podía echarme una mano, pero no hubo forma de arreglarlo, así que estaba a punto de dejarlo por imposible.

Pero soy muy tozuda y cuando algo se mete entre ceja y ceja no paro hasta lograrlo, así que hoy se me ha ocurrido una idea: En este mismo blog tengo el gadget de etiquetas encogido, ¿sería posible utilizar ese mismo código para otros gadgets?.

Lo he probado, pero al principio no me ha funcionado, así que he investigado un poco y en el blog de Rosa he encontrado la solución.

La he aplicado a todos los gadgets del directorio y ¡ha funcionado!.
Ya tengo todos los gadgets de ese blog bien recogiditos ocupando el mínimo espacio y si alguien necesita buscar el enlace a alguna de mis entradas, aparte de que puede usar el buscador, que funciona tan bien que muestra incluso las entradas que aún no he añadido a las listas, puede desplegar tan solo la lista que le interese o en la que crea que pueda estar lo que busca, sin tener que ver los tropecientos enlaces que hay al mismo tiempo, con lo que será menos mareante para el o ella.

EDITO: Hoy puedes ver el mismo truco aquí, aplicado a varios gadgets, Archivo, Etiquetas, Lista de Blogs yTexto. El sistema es exactamente el mismo en todos ellos.
Solo has de tener en cuenta que en el gadget de etiquetas hay una pequeña variación que mencionaré en la explicación.
Así que si te interesa, pincha y verás


Lo primero de todo que has de hacer, antes de empezar es EXPANDIR PLANTILLA DE ARTILUGIOS, (ya sabeis, marcar ese cuadrito que hay justo encima del recuadro del código, a la derecha y esperar un segundo a que el código recargue para empezar a buscar).

Y lo remarco bien, así en mayúsculas y en negrita, porqué no quiero que luego me vengais con "No encuentro eso que dices" porqué os garantizo que lo que os voy a decir está en todos los gadgets.

Absolutamente en todos.

Una vez expandidos buscais el gadget que querais encoger. Si tiene título os será más fácil de encontrar, pues buscando ese título lo encontrareis. (Control F y os aparecerá la barrita para buscar algo en el código. Arriba, abajo, a la derecha o a la izquierda de la pantalla, dependiendo del navegador, pero os saldrá. Y si no tiene título ponédselo o solo se verá el [+/-] y nadie sabrá qué es lo que hay detrás.

Una vez localizado el título fijaos bien en lo que hay. Porqué hay 3 líneas que son claves para colocar el código que hará que se encoja y se vea como los de allí.

Las líneas son:

<b:includable id='main'>

<div class='widget-content'>

<b:include name='quickedit'/>

El resto del código del gadget puede variar, dependiendo del tipo de gadget que sea, pero estas 3 están en todos.

Así que con estas 3 líneas localizadas hay que añadir 3 códigos al código del gadget.

El primero va justo debajo de la primera línea que menciono y es este:

<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>


El segundo va justo debajo de la segunda línea que os he dicho y es éste:

<script type='text/javascript'>
//<![CDATA[document.write('<div id="' + rnd + '"
style="display:none;">');//]]>
</script>


Y el tercero va justo encima de la tercera línea que os digo y es éste:

<script type='text/javascript'>
//<![CDATA[document.write('<\/div>');//]]>
</script>


Independientemente de lo que quede, del código original, entre estos códigos, ya que cada tipo de gadget tiene sus propios códigos para funcionar.

Tan solo os teneis que fijar y basar en esas 3 lineas concretas que menciono al principio y pegar estos 3 códigos, en el lugar exacto que os digo.
En el gadget de etiquetas la segunda línea se ve algo distinta. Pero si te fijas bien en realidad pone lo mismo, solo que más largo, ya que se ve así:
<div expr:class='"widget-content " + data:display + "-label-widget-content"'>
Fíjate que remarco lo que hay en los otros gadgets.

Variantes de este tema:

Haciéndolo así el [+/-] queda a la izquierda y es posible que os quede encima del título del gadget.

Si quereis ponerlo a la derecha cambiais el left que he remarcado en rojo en el primer código por right.

Y si en lugar de ese [+/-] quereis poner una flechita o algo similar, (no muy grande, o no se verá, máximo unos 36 pixels), cambiais el [+/-] que he remarcado en rojo por <img src='ladirección de la imagen' /> y se verá la imagen.

En el directorio, si vais a chafardear un poco, vereis que yo he colocado una doble flechita verde a la derecha.

Imprime esta entrada

10 comentarios. ¿Quieres añadir el tuyo?

  1. Gem@ ha dicho
  2. Es muy extraño Eulalia porque el Efecto Toggle funciona de maavilla, después de responderte me quedé con la duda de si habías añadido el script imagino que si.
    Lo que importa es que le has buscado solución :)

  3. Eulalia ha dicho
  4. Hola Gem@:
    Si, claro que si, tanto allí como aquí había añadido los dos el prototype y el scriptaculos (o algo así) tal como decis, pero ni aqui ni allí logré que los gadgets se abrieran. Me enviaban arriba y ¡listo! Así que: A grandes males, grandes remedios.
    Un beso.

  5. 3dison ha dicho
  6. Hola si, ese truco es una genialidad. Aunque me gustaria saber como ponerle fondo a las etiquetas o extras que quedan abajo de las entradas. Mi blog es el siguiente:

    residentevil-rci.blogspot.com

    Si me harias el favor de decirmelo, comentalo en mi blog porfavor. Gracias!

  7. Andaira ha dicho
  8. Eulàlia, si quiero poner una flecha a ambos lados de la etiqueta, dónde he de colocar el righ y el left? juntos y separados con un signo?
    ......="float:left;margin-right:5px;">.....

  9. Eulalia ha dicho
  10. No creo que se pueda, Andaira.

  11. Andaira ha dicho
  12. OK Eulàlia.
    Gracias guapa

  13. Cinthya ha dicho
  14. hola eulalia. tu blog es muy bueno.
    he estado dejando mi blog mas bonito y encontré este truco, seguí las intrucciones y todo perfecto. Revisé el blog y el simbolito ese de [+/-] aparece pero no realiza ninguna acción con el gadget...
    el gadget que quise esconder es de archivo de blog

  15. Eulalia ha dicho
  16. Cynthia:
    Por lo que veo, en el blog en el que lo has colocado es una plantilla mínima, así que debería funcionar.
    Revísalo bien, ya que es posible que hayas colocado el código en algín sitio donde no iba.
    Este truco funciona en todos los gadgets siempre que se coloque en los sitios que indico.

  17. luchadora ha dicho
  18. Hola Eulalia. A mí me pasa lo mismo que a Cinthia. Me sale el signo de +/- en el lado izquierdo pero no me hace nada.

    Un saludo.

  19. Eulalia ha dicho
  20. luchadora: Tu plantilla es de las nuevas y en éstas no estoy tan segura de que funcione el truco.
    De todas formas asegúrate de que el código está bien. Si has copiado y pegado, revisalo porqué a veces al hacer ésto, algún espacio desaparece.

google-site-verification: google6804ea8a89fbde9f.html
Plantilla creada por laeulalia basada en la harbor de blogger.