TRUCOS y
TUTORIALES
para tu blog
No, no vendemos
camisetas... aun
Camiseta Ciudad Blogger

Menú tipo acordeón con efecto deslizante

26 de junio de 2010 | Número de comentarios397 comentarios
Sin duda Mootools es una de las librerías más completas en efectos para páginas web aunque no es tan popular como otras librerías de efectos.
Este es un buen ejemplo de los atractivos efectos que se pueden conseguir con esta librería, se trata de un menú de imágenes tipo acordeón que se desliza suavemente cuando se pasa el cursor sobre él.
El menú es de ByScripts el cual ellos lo llaman Byslidemenu y ha sido Robinson quien me ha pedido que explique su instalación.
Hay dos versiones, el menú horizontal y el menú vertical.


Puedes ver funcionando el ejemplo en este blog de pruebas.

Antes de ponerlo considera que, Mootools no es compatible con la mayoría de las librerías de efectos, así que si usas jQuery, Prototype o Scriptaculous estoy casi seguro que no les funcionará.
Además que es un menú de imágenes, así que cada quién deberá crear sus imágenes con sus textos o lo que se le quiera agregar a la imagen.

Bien, habiendo aclarado lo anterior empecemos, primero hay que descargar este archivo, descomprimirlo y subirlo en algún alojamiento.

Ahora entra en Plantilla | Edición de HTML y pega antes de </head> lo siguiente:
<script src='URL del archivo mootools-core.js' type='text/javascript'/>
<script src='URL del archivo byslidemenu.js' type='text/javascript'/>
<style type='text/css'>
ul.bsm{
margin: 0px auto;
border:1px solid #B0B0B0;
list-style-type: none;
}
ul.bsm li{
border-left:2px solid #FFFFFF;
}
ul.bsm li.first{
border-style: none;
}
ul.vertical li,
div.vertical div{
border-top: 2px solid #FFFFFF;
border-left-style: none;
}
</style>

Cambia lo que está en color verde por las URLs de los archivos que subiste previamente a tu alojamiento.

Luego pega antes de </body> esto:
<script type='text/javascript'>
window.addEvent(&#39;load&#39;, function(){
var slideMenu = new BySlideMenu();
var verticalmenu = new BySlideMenu(&#39;verticalmenu&#39;, {vertical: true});
});
</script>


Por último entra en Diseño | Elementos de la página | Añadir un gadget | HTML/Javascript y pega uno de estos códigos.
Si deseas usar el menú horizontal pega esto:
<ul class="bsm" id="byslidemenu">
<li class="first"><a href="URL del enlace"><img src="URL de la imagen" /></a></li>
<li><a href="URL del enlace"><img src="URL de la imagen" /></a></li>
<li><a href="URL del enlace"><img src="URL de la imagen" /></a></li>
<li><a href="URL del enlace"><img src="URL de la imagen" /></a></li>
<li><a href="URL del enlace"><img src="URL de la imagen" /></a></li>
</ul>

O si deseas el menú vertical pega este:
<ul style="display:none; visibility:hidden;" class="bsm" id="byslidemenu">
<li></li></ul>

<ul class="bsm vertical" id="verticalmenu">
<li class="first"><a href="URL del enlace"><img src="URL de la imagen" /></a></li>
<li><a href="URL del enlace"><img src="URL de la imagen" /></a></li>
<li><a href="URL del enlace"><img src="URL de la imagen" /></a></li>
<li><a href="URL del enlace"><img src="URL de la imagen" /></a></li>
<li><a href="URL del enlace"><img src="URL de la imagen" /></a></li>
</ul>

Ya sólo cambia lo que está en color rojo por las URLs de tus imágenes y por las URLs de los enlaces. Las imágenes yo las he hecho de 300px de ancho y 225px de alto, pueden ser de cualquier otra medida, pero esa de ejemplo creo que da mejores resultados visuales.

Como ves la instalación es muy sencilla, el mayor trabajo estará en diseñar las imágenes del menú, pero al final seguro tendrás un menú mejor personalizado y poco usual.

397 comentarios :

  1. woooooooooooooooow, Esta muy bakan bro mil gracias.

    Pero podrias poner una preview pero en uno de tus blogs de prueba, solo si esque puedes, Saludos cuidate potro

    ResponderEliminar
  2. ¿No se puede ver el ejemplo del post? o.O?

    ResponderEliminar
  3. em, esque en el titulo del post dice "Tipo Acordeon" y en el ejemplo que pusiste en el post no se aprecia bien, se ve solo como una imagen y se ve cortada abajo... :/

    ResponderEliminar
  4. Listo, ya he quitado ese ejemplo y lo pasé a un blog de pruebas :)

    ResponderEliminar
  5. Excelente ahora quedo muy bien el ejemplo, creo que lo aplicare a mi blog, cuando este en mi otro pc xD

    Saludos y gracias.

    ResponderEliminar
  6. Hola Potro, el menú se veía perfecto, al menos cuando yo visualicé las páginas estáticas, por un instante variaron las dimensiones del horizontal, iba a comentar ese detalle, pero ya veo que "todo va viento en popa". Enhorabuena

    ResponderEliminar
  7. Sí, es que por ahí se me había ido una parte del código y justo lo estaba arreglando, pero ya se ve bien incluso en Internet Explorer.
    Saludos.

    ResponderEliminar
  8. muy bueno, pero no lo puedo utilizar por lo de las librerias que no son compatibles.
    Espero que nos muestres algun dia como lograr este efecto con otra libreria.

    Saludos.

    ResponderEliminar
  9. Me parece que hay uno parecido con jQuery pero no estoy seguro, deja que tenga un poco de tiempo y veo si lo encuentro.
    Saludos.

    ResponderEliminar
  10. Buenisimo! Me ha encantado, pero digo lo que el compi, que pena que no sea compatible
    Saludos

    ResponderEliminar
  11. Hola Potro:
    Gracias por la explicación del Menú. Queda perfecto para colocarlo en el blog. En verdad que eres un duro en esto de los trucos.
    Gracias por la mención. Siempre en contacto.
    Robinson Char

    ResponderEliminar
  12. que son los url de enlaces ? que enlaces ? plis una respuesta k no se mucho d esto :(

    ResponderEliminar
  13. Meri, al menos los que usan Mootools sí lo van a disfrutar :)

    Robinson Char, qué gusto que ya vas a poder usarlo ;)

    Mago Ilusionista, la URL del enlace es la dirección de la página a la que enlaza algo, en este caso cada imagen del menú, por ejemplo, la URL de Google es http://google.com

    ResponderEliminar
  14. aaa muchisimas gracias veo si me sale y cualquier cosa consulto :) no m imagine que contestarian tan rapido! muy buena pagina!

    ResponderEliminar
  15. alguien sabria como hago para k cuando hago click en el menu me redirecione a una parte de mi mismo blog ? como este menu http://pateandobarrio.blogspot.com/ si me pueden ayudar o mandarme algun link d un tutorial seria muy feliz jaja gracias perdon por ser tan molesto

    ResponderEliminar
  16. Pues hay varias formas de obtener la URL de una página, la más fácil sería que entres a la página que quieres enlazar y que copies la dirección que aparece en la barra de direcciones del navegador, esa sería la URL.

    Saludos.

    ResponderEliminar
  17. que página puedo alojar las imagenes????

    ResponderEliminar
  18. buenas me queda un borde blanco miren http://magoyamil.blogspot.com/ si me dicen como puedo sacarlo o que tamoño tiene k tener la imagen para k no aparesca se los agradeceria mucho!

    Saludos!

    ResponderEliminar
  19. WELAROM, hay varios sitios, TinyPic, Imageshack, Picasa, Google Sites, etc.

    Mago Ilusionista, no vi que lo tengas puesto. El tamaño que yo he usado es de 300 x 225px

    ResponderEliminar
  20. Eso si Potro. Espero que lo pongan porque esta chulisimo
    Saludos

    ResponderEliminar
  21. es perfecto, pero dos preguntas:
    Funca con el sexy menu?
    Y para que las imágenes se muevan más rápido? me parece que va muy lento...

    Jo, no te dejo en paz, no tengo perdón XD

    ResponderEliminar
  22. Nop, tal como mencioné en la entrada, no es compatible con jQuery.
    Y sí, no tienes perdón, jajaja :D

    ResponderEliminar
  23. Gracias potro
    aunque tengo otra pregunta que no viene a esta entrada, pero quiero poner un reproductor de musica en mi blog pero necesito un alojador de musica que no sea dropbox porque no lo agarra en mi pc :S
    gracias d nuevo

    ResponderEliminar
  24. Si no tienes un dominio propio (.com) puedes usar Google Sites, también es muy bueno.

    Saludos.

    ResponderEliminar
  25. hola soy fred y acabo de ver tu blog y esta excelente pero ahora me gustaria saber de como se hace el menú que tienes en tu blog el que dice:temas basicos, plantillas, contadores, herramientas, etc. y tambien de como lo has echo como un boton te lo agradeceria bastante espero tu respuesta.

    ResponderEliminar
  26. Hola Potro! denuevo por aca!

    mira tengo este blog de pruebas con esa misma plantilla, oc que pasa pero no agarra el eefcto a ver si puedes verlo que pasa :

    http://kids101010.blogspot.com/


    saludos!! potro!

    ResponderEliminar
  27. Quizá puede ser algo de la plantilla, si te fijas con el menú horizontal sí funciona, sólo con el vertical no funciona en esa plantilla, desconozco a qué se deba.

    Saludos.

    ResponderEliminar
  28. hola yo igual tengo el problema cuando pongo el horizonal sala perfecto cuando pongo al vertical aun teniendo el horizonal agarra los dos bien pero cuando quito el horizontal el vertical ya no agarra esta bien raro

    ResponderEliminar
  29. arquitectura online y .::EALV::. ,

    Agreguen arriba del código del menú vertical esto:

    <ul style="display:none; visibility:hidden;" class="bsm" id="byslidemenu">
    <li class="first"></li>
    </ul>

    Con eso ya debe funcionar.
    Saludos.

    ResponderEliminar
  30. jajaja si funciono te doy toda las grcias muchisimas gracias este menu me encanto pero lo keria en vertical pero por este porblema no lo ponia aaaaaaaaaaaa gracias eres el mejor

    ResponderEliminar
  31. Qué bueno que ya está funcionando todo bien ;)

    ResponderEliminar
  32. wow muchisimas gracias agradecida!

    ResponderEliminar
  33. Este comentario ha sido eliminado por el autor.

    ResponderEliminar
  34. hola a todos tengo una inquietud...yo coloque el menu horizontal pero quiero cambiarlo de puesto colocarlo por la cabezera como hago

    ResponderEliminar
  35. Sólo arrastra el gadget hasta que quede debajo de ella, mira aquí.

    ResponderEliminar
  36. Potro al cien men pero no me sale lo del archivo serias tan amable de pasarme los url???? digo si quiere :$

    ResponderEliminar
  37. http://dl.dropbox.com/u/647003/CiudadBlogger/Scripts/Mootools_Byslidemenu.rar

    ResponderEliminar
  38. o_Ó Wowww... que profesionál que se que ve eso!!! Felicitaciones Bro!! es excelente!!

    Un abrazo!!!

    ResponderEliminar
  39. ¿Verdad que sí? Igual a mí me ha gustado :)
    ¡Un abrazo!

    ResponderEliminar
  40. FELICITACIONES,POTRO LO INCORPORE A MI PAGINA http://librosdecostura.blogspot.com/

    PERO COMO HAGO PARA:
    1.- QUE CARGUE MAS RAPIDO
    2.- ALARGARLO MAS PARA QUE SE VEA DEL ANCHO DE LA PAGINA

    DE ANTEMANOS MIL GRACIAS

    ResponderEliminar
  41. Hola Prof. Maria,

    Cargará más rápido si el primer código lo pegas después de
    <head> en lugar de </head>

    Para alargar el menú sigue estos pasos:
    - Abre el archivo byslidemenu.js con WordPad
    - Localiza esta parte:

    elementWidth: 320,
    elementHeight: 240,

    El primer número es el ancho del menú, el segundo número es el alto, puedes cambiarlos por las medidas que desees.

    - Guarda los cambios y sube el archivo al alojamiento y continua con los demás pasos del tutorial.

    ResponderEliminar
  42. Potro en " Diseño | Elementos de la página | Añadir un gadget | HTML/Javascript"
    si lo quiero agregar en una Html normal con el dreamweaver,
    qué tend´ria que haceR?
    vale gracias de antemano :D

    ResponderEliminar
  43. Sería dentro del cuerpo del sitio, es decir, dentro de <body> y </body>

    ResponderEliminar
  44. hola estoy haciendo paso a paso lo que dices pero en el momento de pegar el primer codigo me sale este error

    Mensaje de error de XML de: tipo de elemento "script" debe ser seguida de especificaciones de atributo o bien, ">" o "/>".
    Que estoy haciendo mal, por fa si puedes ayudarme te agradezco

    ResponderEliminar
  45. Hay una parte del código que te está faltando, quizá al poner la URL de script te has "comido" alguna letra. Inténtalo de nuevo.

    ResponderEliminar
  46. No hemos podido guardar tu plantilla
    Por favor, corrige el siguiente error y envía la plantilla de nuevo.
    No se ha podido analizar su plantilla, porque no está bien formada. Asegúrese de que todos los elementos XML se han cerrado correctamente.
    Mensaje de error de XML: Element type "script" must be followed by either attribute specifications, ">" or "/>".

    ResponderEliminar
  47. Es nuevamente el mismo error, revisa bien el código de ejemplo y remplaza únicamente lo que se indica.

    ResponderEliminar
  48. Potro disculpa tanta preguntadera pero logre hacerlo a medias!! es decir aparecen los cuadros pero no se mueven
    http://ivanca-calderas.blogspot.com/
    si puedes mirar y me dices que me falto por favor te agradezco.

    ResponderEliminar
  49. En las plantillas nuevas de Blogger nunca lo he probado así que no sé si funcione.
    De cualquier modo el primer código va antes de </head> no antes de <head>

    ResponderEliminar
  50. listo ya hay movimiento, ahora como hago para que se vean las letras de cada uno? cada cuadro tiene un nombre como hago aqui??

    ResponderEliminar
  51. Es tu plantilla que tiene predeterminadas esas medidas, no puedo asegurarte que funcione bien con las plantillas nuevas de Blogger, pero puedes intentar buscando este código y eliminando lo que está en negrita:

    .tabs-inner .widget ul {
    padding: 2px 25px;
    max-height: 34px;

    ResponderEliminar
  52. Wow que genial! nwn lo intentare :P lo que quisiera preguntar es que tamaño usaste para las imagenes k usast? Saludos.

    ResponderEliminar
  53. Ahí mismo en la entrada lo he mencionado, son de 300px de ancho y 225px de alto.
    Saludos.

    ResponderEliminar
  54. Potro, encontré en esta página (http://www.phatfusion.net/projects.html) un menú que CREO que es compatible con jquery y demás librerías... es
    si te atrevés a probarlo y luego explicar todo... te agradeceríamos muchos. me pareció muy bueno y útil.
    lo que no sé es si se puede usar vertical. date una vuelta si querés:
    http://dev.phatfusion.net/imagemenu/

    ResponderEliminar
  55. Nick'sWriter, quizá no lo notaste pero es el mismo menú que explico en esta entrada ;)

    ResponderEliminar
  56. aah, ok! porque estoy buscando alguno que sea compatible. gracias por responder

    ResponderEliminar
  57. Potro No me sale.. :( lo he intentadooo pero nahh.. :( ayuda plis.. hago todo lo ke dices.. y nada..!! sera por la plantilla???

    salu2 grascias..!!

    ResponderEliminar
  58. Es porque usas Scriptaculous y no es compatible con el script que se usa para este menú.

    ResponderEliminar
  59. Emm jejeje ke es Scriptaculous?? jeje perdona la intensidad..!!

    ResponderEliminar
  60. Listo men..!! YA SALIO..! THANKs..!! Le kite esoo Men y tu ke estudiasteS?? o ke?? porke eres UN Barbaro jejejeje

    Saludes..!

    ResponderEliminar
  61. Es un script que se usa generalmente para efectos de deslizamiento, en algo lo estabas usando, desconozco en qué, así que si lo has eliminado seguro algo dejará de funcionar.

    Saludos.

    ResponderEliminar
  62. no me sale,presiento que es un problema con las direccines, porque me aparece una barrita como un menu pero no las imagenes que elegi por favor puedes ayudarme?
    subi a dropbox los archivos
    https://dl-web.dropbox.com/get/BLOG/mootools-core.js
    https://dl-webdropbox.com/get/BLOG/byslidemenu.js coloco todo esta direccion
    donde dice url de enlace puse
    https://www.dropbox.com"
    ¿que será que me esta fallando? gracias

    ResponderEliminar
  63. Efectivamente Vero, el problema es con las direcciones. Los archivos tienes que meterlos dentro de la carpeta Public para poder conseguir la URL correcta y para que pueda funcionar.
    Si los tienes en otra carpeta (por ejemplo veo que están dentro de BLOG) entonces mueve la carpeta dentro de Public y luego consigue la URL de cada archivo.

    ResponderEliminar
  64. bueno potro. me la paso en tu blogg, la verdad te pasa. tenes muchisimas cosas que sirben y ayudan, aparte de explicarlas bien funcionan y siempre atento a todo...

    yo tengo una pregunta. tengo un blogg de un juego online. y nesesito saver si hay algo que desde mi blogg me escriban mails directamente a mi correo, existe?? agradeceria tu respuesta. diegacho_007@hotmail.com si queres mandame un mail o yo paso de nuevo por aca..

    saludos...

    ResponderEliminar
  65. Que escriban el correo desde el blog no pues es un blog y no un cliente de correo pero puedes poner un botón para que al presionarlo pueda abrirse el cliente de correo y puedan escribir el mail:
    http://ciudadblogger.com/2009/10/opcion-de-enviar-mail-con-asunto-y.html

    ResponderEliminar
  66. muchas gracias!! si me funciono ahora se ven las imagenes, pero no funciona el efecto de deslizaminento¿tendra que ver con el tipo de plantilla o con el contenido del blog? el menu lo puse en http://huertaspeuhec.blogspot.com/

    ResponderEliminar
  67. No veo que tengas puesto el menú aunque sí veo que es una plantilla de las nuevas de Blogger y sé que la mayoría de los menús no funcionan en ellas.

    ResponderEliminar
  68. Necesito ayuda con mi bloG PARA PODER HACERLO. gRACIAS BESITOS

    ResponderEliminar
  69. Gracios por essta estupenda herramienta :)

    ResponderEliminar
  70. Belen Sanchez, ¿exactamente qué ayuda necesitas?

    Guillem, qué bueno que te ha gustado!

    ResponderEliminar
  71. hola, lo puse en mi blog, pero solo se ven las imagenes estáticas, es decir, no tiene movimiento al pasar el mouse, y el mismo script lo puse en mi blog de pruebas y si sirve! no se a que se deba, me gustaria que me explicaras como puedo solucionar este problema gracias! http://enrike23.blogspot.com/

    ResponderEliminar
  72. Hola [Enrike23],

    Eso es porque usas jQuery, otro script para crear efectos y no es compatible con el que se usa para este menú.

    Saludos.

    ResponderEliminar
  73. OOO, Y NO HAY SOLUCIÓN A ESTE PROBLEMA?

    ResponderEliminar
  74. Pues elegir entre usar uno o el otro. Hay un hack que anda por la red para que se puedan utilizar ambas librerías pero yo nunca he tenido éxito y por lo mismo no podría decirte que te funcionará.

    ResponderEliminar
  75. Buen día amigo auxilio auxilio.....
    Solo me muestra las imagenes pero sin movimiento..
    Saludos y muchas gracias de antemano.

    ResponderEliminar
  76. Hermano es el siguiente blog: http://posadalagoazul.blogspot.com/
    Es un blog de pruebas, te agradezco tu
    interes por ayudarme. Recuerda que solo se
    ven las imagenes (estaticas), sin el efecto
    de acordion....Espero su pronta respuesta.
    Saludos...

    ResponderEliminar
  77. El problema es que en ese blog tienes Prototype y Scriptaculous los cuales no son compatibles con este script (mootools) por lo que no se pueden usar ambos al mismo tiempo.

    ResponderEliminar
  78. Saludos Potro. Y que tengo que hacer ??? quiero aplicar este menu al blog.

    ResponderEliminar
  79. Pues eliminar el otro script, búscalo como Prototype y Scriptaculous y lo encontrarás, pero toma en cuenta que si lo tienes ahí es porque lo has agregado para algún truco así que el truco con el que lo hayas puesto dejará de funcionar.

    ResponderEliminar
  80. Esta muy util y funcional tu post, tenes 10... Bendiciones....

    ResponderEliminar
  81. Buen día Potro, ya funciona perfectamente el menú. Gracias por las aclaratorias. Un millón de gracias. Saludos

    ResponderEliminar
  82. iRojas, qué bueno que te ha gustado :)

    Miguelsld, excelente, me alegra que ya esté funcionando ;)

    ResponderEliminar
  83. lo uso en mi blog pero no se ven las imagenes, están dentro de dropbox pero no se ven, debo tener abierto dropbox para que se vean... ya intente con el codigo ul style="display:none; visibility:hidden;" class="bsm" id="byslidemenu"
    li class="first" antes del otro codigo pero nada espero respuesta muchas gracias
    y lo mismo me pasa con los contenidos FLASH
    http://miamatlan.blogspot.com

    salu2

    ResponderEliminar
  84. Los archivos que subas a Dropbox deben estar dentro de la carpeta Public, sólo de esa forma podrán funcionar en la red.

    Saludos.

    ResponderEliminar
  85. woow eso fue rapido gracias lo intentare sino estare dando lata otra vez jiji salu2 y de nuevo graaacias

    ResponderEliminar
  86. me gustaria saber como hago para que cuando den click en la fotos del menu deslizante no se vaya para el link de dropox, me gustaria direccionarlo a una parte de mi pagina, hay alguna manera. gracias

    ResponderEliminar
  87. No se tiene que ir al enlace de Dropbox, es por eso que en el código hay dos URLs en color rojo que se deben cambiar, una (la primera) es la URL del enlace a la que apuntará, por ejemeplo http://google.com
    Y la segunda es la URL de la imagen del menú, que en tu caso seguramente subiste a Dropbox.

    ResponderEliminar
  88. En mi blog se ve bien, pero las imagenes quedan centradas en vez de a tamaño completo, y son de 300x225

    ResponderEliminar
  89. Pues no he entendido bien ya que no están centradas y conservan el tamaño de 300 x 225px

    ResponderEliminar
  90. Ya lo se... mira mi blog http://bachiller-infantes.blogspot.com/

    ResponderEliminar
  91. Ya lo he visto, pero sigo sin entender cuál es el problema, lo veo todo bien.

    ResponderEliminar
  92. Potro, otra vez yo! ando trabajando en la imagen y suelen haber problemas!

    Mirá mi "menu acordeon": http://comometanfetamina.blogspot.com

    Porque me quedo ese espacio en el cuadro? Creo que no esta bien centrada! :S que puedo hacer?

    ResponderEliminar
  93. Lo que pasa es que tienes muy pocas imágenes. Puedes editar el archivo .js y donde dice compressSize: 40 cambiarlo por otro valor, ese valor es lo que determina qué tan comprimidas quedan las pestañas.
    O si te parece más fácil aun, sólo elimina el borde del recuadro para que no se note ese espacio:

    ul.bsm{
    margin: 0px auto;
    border:1px solid #B0B0B0;

    ResponderEliminar
  94. Hola Potro, me encanta tu sitio. Abri hace poco un blog y tus diversas aplicaciones me fueron de gran utilidad pero aun soy muy novata en esto de tunearlo. No hay caso de que me salga este menu y veo que soy la unica XD...Las imagenes no me aparecen o directamente el menu no lo hace.Subi los archivos por Dropbox y creeria que hice todos los pasos bien pero no sale tal cual. Esta muy lindo el menu y me gustaria tenerlo. Desde ya gracias...

    ResponderEliminar
  95. Potro donde se consigue el url de la imagen? que no me sale!Adios muy buena la pagina

    ResponderEliminar
  96. Sweet Muse, necesitaría ver en cuál blog lo has puesto para decirte cuál puede ser el problema.

    Nicole, sube la imagen a cualquier hosting, incluso puedes subirla a Blogger, verás que te da una URL como esta:
    http://2.bp.blogspot.com/AAASM/e4yECdXL1HA/s1600/h-musica.jpg
    Esa es una URL y así parecida es la que deberás utilizar.

    ResponderEliminar
  97. una pregunta como hago para q el menu solo aparezca en una de las paginas de mi blog y en las otras no?? gracias y saludos

    ResponderEliminar
  98. me refiero a q solo aparezca dentro de una de las páginas estáticas ..

    ResponderEliminar
  99. Mira esta entrada que dice cómo hacer que los gadegts se muestren sólo en la portada, tú harás lo mismo, sólo que en lugar de poner la primera línea en color rojo que se explica en el ejemplo tú deberás poner esta:
    <b:if cond='data:blog.pageType == &quot;static_page&quot;'>

    ResponderEliminar
  100. mil gracias Potro!. ahi aprendi tbn q para q se vea en una pagina especifica tenia q poner la URL de la pagina asi

    muy bueno abrazos y saludos!!

    ResponderEliminar
  101. Este comentario ha sido eliminado por el autor.

    ResponderEliminar
  102. Hola Potro, logre hacer el menu XD.Elimine algo que no era compatible con el menu. Gracias por responderme :).
    Mi pregunta seria ahora si esta clase de menu se podria icorporar como una entrada en el blog igual.
    Gracias...

    ResponderEliminar
  103. Si te refieres a poner el menú dentro de una entrada sí, aunque quizá en algunas plantillas no quede muy bien, pero será cuestión de que pruebes qué tal queda en el tuyo.

    ResponderEliminar
  104. Hola Potro, perdón que moleste.
    Sabes por qué me quedan las imágenes fijas?
    http://incorporarteatro.blogspot.com/
    saludos y gracias miles!
    Rodrigo

    ResponderEliminar
  105. Hola Potro, perdona que sea molesta otra vez...Me olvide de preguntarte de como haría para ingresarlo a una entrada. Así normalmente como esta el codigo completo uno detras de otro en edición html o tengo que hacer algun tipo de modificacion especial para adecuarlo.Perdona mi ignorancia.Gracias...

    ResponderEliminar
  106. Rodrigo, el hosting donde has subido los archivos no te servirá pues la URL que te da es para descargar los archivos, no para ejecutarlos. Necesitas subirlos a otro como Google Sites o Fileden.

    Sweet Muse, los primeros dos pasos son tal como se explican y esos van en el lugar indicado, sólo el tercer paso es el que cambiaría, el código de ese tercer paso es que el pondrías dentro de la entrada.

    ResponderEliminar
  107. Hola, me salio al fin...Me quedo muy bien. Agradezco muchisimo tus contestaciones, ¡¡¡Saludos!!!

    ResponderEliminar
  108. Me da gusto que ya esté funcionando :)

    ResponderEliminar
  109. Gracias por responder Potro. Te cuento que las imágenes las tengo en Google Sites porque me da la opción "ver" pero con los archivos de extensión .js no me da esa opción. Los subi pero sólo me tira "descargar", es por eso que los subi a este servidor. Sabes por qué no me da la opción en Google Sites de "ver" los .js?

    ResponderEliminar
  110. Aunque no te dé la opción de 'Ver' pon el cursor sobre el link que dice 'Descargar' y dando click con el botón derecho copia la URL del enlace, esa URL es la que necesitas, sólo elimina la parte final del enlace que es algo como esto:
    ?attredirects=0&d=1

    ResponderEliminar
  111. exelente tutorial, me gustaria saber como podria aplicarlo en dreamweaver para alguna pagina web cualquiera,si puedes contestarme te lo agredeceria demasiado :D
    eso,saludos!

    ResponderEliminar
  112. Pues no manejo Dreamweaver pero en teoría debería ser exactamente el mismo procedimiento para cualquier página Web, sólo que el último código que dice que va dentro de un elemento HTML/Javascript se pondría después de <body>

    ResponderEliminar
  113. si mi sidebar es de pequeño como dejo pequeñas las imagenes?

    ResponderEliminar
  114. En la parte donde va la URL de la imagen agrega lo que está en negrita:
    <img src="URL de la imagen" style="width:200px; height:100px;" />

    Ahí puedes determinar el tamaño de las imágenes.

    ResponderEliminar
  115. ee amigo me puedes explicar bien sobre..cuando tengo que descomprimir el archivo como lo pego o como copio los urls porque cuando los baje eran dos archivos.gracias

    ResponderEliminar
  116. Esos archivos debes subirlos a un hosting como Google Sites, Filenden, Dropbox, etc. para tener su URL. Esa URL es la que tendrás que poner en el código donde se indica.

    ResponderEliminar
  117. Hola, a mi, al pasar el cursor sobre una imagen, esta se desplaza pero me queda un hueco en blanco a la derecha entre imagen e imagen......tengo sólo 3 imágenes puestas...y debajo de las imágenes me aparece un punto gris...como se quita......alguien sabe la solución....gracias

    ResponderEliminar
  118. Cuando son pocas imágenes usualmente sucede eso. Puedes editar el archivo byslidemenu.js y donde dice compressSize: 50, cámbialo por otro valor, probablemente con uno más bajo tengas los resultados que esperas.

    Para eliminar los puntos prueba poner en esta parte lo que está en negrita:

    ul.bsm{
    margin: 0px auto;
    border:1px solid #B0B0B0;
    list-style-type: none !important;
    }

    ResponderEliminar
  119. Potro, lo de los puntos perfecto, si cambio compressSize a cualquier valor se siguen viendo los espacios a la derecha...probé con muchos valores y nada..si se te ocurre otra cosa ...!! sino MUCHAS GRACIAS

    ResponderEliminar
  120. Al poner 5 imágenes me pasa lo mismo..el borde no se queda fijo sino que se agranda todo a lo ancho para que cojan las 5 imágenes.Por debajo del borde me queda un espacio todo alrededor..solo aparece la imagen pegada al borde por el lado derecho...

    ResponderEliminar
  121. mccartu, entonces es por la plantilla, arriba de ul.bsm{ agrega esto:

    .bsm img {padding:0 !important; margin:0 !important;}

    Quizá veas un pequeño espacio, pero eso es porque tus imágenes tienen bordes blancos.

    ResponderEliminar
  122. Estimadisimo Potro, te agradezco una vez mas tu grandiosa colaboracion con todos nosotros... Adapte este menu a la pagina ke estoy construyendo para mi pequeño negocio de comidas (al ke estas cordialmente invitado si en algun momento visitas Ecuador), la direccion actual es http://lascanastasdeverde.blogspot.com/ , pero como podras observar esteticamente no queda muy bien esta como recortado a la mitad de la pagina y los bordes no son parejos... existe posiblidad de remediar esta situacion? me gustaria que cubra el ancho completo y kizas quitarle los bordes para ke no se vea como cortado. Una vez mas millon gracias y espero que exista una solucion para estos detalles ya que el menu esta increible, suerte y exitos!!!

    ResponderEliminar
  123. Hola Pepe Lynch,

    Qué gusto leerte de nuevo por aquí. Gracias por la invitación, ten por seguro que si un día voy a Ecuador pasaré ahí :)

    Esos bordes son de la plantilla, puedes eliminarlos quitando todo lo que hay dentro de:

    /* Tabs
    ----------------------------------------------- */

    Para que se extienda más necesitas dos cosas, una, agregar más pestañas, y otra, editar el archivo byslidemenu.js y donde dice compressSize: 40, cambiarlo por otro valor más alto, por ejemplo 80

    Con un valor de 80 o 90 y una o dos pestañas más que le agregues al menú quedará a todo el ancho de tu blog.

    Saludos y mucha suerte con el negocio.

    ResponderEliminar
  124. http://lislianoche.blogspot.com/

    por alguna razon a mi no me saliooo :( ayudaaa!
    me encanto tu blogger! ^^

    ResponderEliminar
  125. Es porque como mencioné, no es compatible con Prototype y Scriptaculous, mismos que tú usas.
    Saludos.

    ResponderEliminar
  126. Hola Potro, muchas gracias por tus trucos, gracias a ti gente que no tenemos ni idea podemos hacer cosas algo aparentes. Tengo un problema con las fotos del menú porque salen desplazadas hacia la derecha y abajo. He probado todas las cosas que le has dicho a otra gente y a modificar el compresssize pero aún así no me va. A ver si tú puedes saber lo que es: http://www.aulaabalar.blogspot.com/
    Muchas gracias

    ResponderEliminar
  127. Hola aulaabalar,

    En las plantillas hechas con el Diseñador de plantillas de Blogger siempre hay problemas con los menús pues nunca se ven como deberían.
    La única opción que puedo darte es la misma que menciono en el comentario #128, posiblemente te sirva para esa plantilla.

    Saludos.

    ResponderEliminar
  128. Pues al menos este no, de hecho será complicado mientras uses Scriptaculous ya que hay menús tipo acordeón hechos con jQuery pero ese también es incompatible con Scriptaculous :\

    ResponderEliminar
  129. Perfecto, ha funcionado. Muchísimas gracias.
    Un saludo

    ResponderEliminar
  130. hola El Potro
    Yo tengo un problema al hacer eso me deja un espacio entre la linea y la imagen haber si ves el problema este es mi blog
    http://unionanimem.blogspot.com/

    ResponderEliminar
  131. bueno El Potro cureoseando y borrando a la adivinanza lo arregle gracias por el post

    ResponderEliminar
  132. Qué bueno que ya lo has solucionado :)

    ResponderEliminar
  133. Hola, me gustaría saber cómo quitar el sidebar del menú que he puesto, sin quitarlo en si. Me refiero al marco que ahora mismo tiene y me parece muy feo. Pero no encuentro cómo quitarlo en ningún lado.

    Blog. www.planescaping.blogspot.com

    Gracias por adelantado, un saludo.

    ResponderEliminar
  134. Lo que sucede es que tu plantilla agrega esos bordes. Puedes quitarlos buscando esta parte en tu plantilla y eliminando lo que está en negrita:

    .main-inner .widget ul li, .main-inner .widget #ArchiveList ul.flat li {
    padding: .5em 15px;
    text-indent: 0;
    color: #666666;
    border-top: 1px solid #000000;
    border-bottom: 1px solid #000000;

    ResponderEliminar
  135. Ya lo he hecho y está perfecto. Muchísimas gracias. He aprendido mucho con los trucos de tu blog; agradezco además el haberme respondido tan rápido.

    Un saludo.

    ResponderEliminar
  136. Hola POTRO, segui todos los pasos pero no veo resultado :( me podrias decir que sucede, porque yo quiero hacer un menu con 7 imagenes de 246px × 27px, gracias
    http://radiofh.blogspot.com/

    ResponderEliminar
  137. Podría ser porque tienes el archivo de mootools 3 veces.

    ResponderEliminar
  138. y que tengo q hacer??? donde se encuentran los 2 q estan de mas, Gracias saludos

    ResponderEliminar
  139. Búscalos en tu plantilla, usa las teclas CTRL+F para encontrar los que se llaman Mootools. Ignoro para qué trucos los hayas puesto.

    ResponderEliminar
  140. Bueno, he tratado de hacer un menú nuevo, con imágenes algo más pequeñas, pero parece ser que estas no se centran. Antes las mías eran de 200 px, pero ahora las hice de 150. ¿Sabes a qué se debe y si se puede arreglar?

    ResponderEliminar
  141. El blog: www.planescaping.blogspot.com

    ResponderEliminar
  142. Muchas gracias por tus tutoriales, estoy empezando a administrar un blog(blogspot) y esto me ayudará a personalizarlo como yo quiero^^..sin embargo, tengo una duda. En muchos de tu tutos, indicas que vayamos aquí ->Diseño | Elementos de la página | Añadir un gadget | HTML/Javascript, pero la entrada al HTML, por aquí, no la encuentro, me podrías decir dónde está específicamente. Lo agradecería, así pudiera utilizar muchos de tus manuales.

    Feliz Navidad!^^

    ResponderEliminar
  143. Foro Laruku, pues ahí donde se indica lo puedes encontrar, cuando haces click en Añadir un gadget se abrirá una ventana, sólo fijate que en esa ventana del lado izquierdo diga 'Básico' y del lado derecho podrás localizar el elemento que se llama HTML/Javascript.

    ResponderEliminar
  144. hola me encanto esta entrada, solo tengo una duda se pueden poner mas de un menu, ya lo intente pero solo con uno funsiona el otro se desconfigura X.x

    ResponderEliminar
  145. No estoy seguro pues nunca lo he hecho pero podrías editar el script byslidemenu.js, buscar ahí en el script esto y agregar lo que está en negrita:


    this.containerId = $pick(containerId, 'byslidemenu', byslidemenu2);

    Luego en el elemento HTML/Javascript donde agregues el otro menú cambia donde dice:
    <ul class="bsm" id="byslidemenu">

    Por:
    <ul class="bsm" id="byslidemenu2">

    ResponderEliminar
  146. Entonces quizá no es posible usar 2 al mismo tiempo :\

    ResponderEliminar
  147. ami no me funciona T_T mira www.distritourbano.net

    ResponderEliminar
  148. Es porque usas jQuery, y ese script no es compatible con Mootools que es el que se usa para este menú.

    ResponderEliminar
  149. POTRO SOY NUEVO EN ESTO. COMO PUEDO PONERLE MAS IMAGENES AL ACORDEON? TRAE SOLO 5 Y LO NECESITO CON 8

    ResponderEliminar
  150. En el código que has agregado en el elemento HTML/Javascript agrega antes de </ul> una línea como esta por cada imagen extra que quieras añadir:

    <li><a href="URL del enlace"><img src="URL de la imagen" /></a></li>

    ResponderEliminar
  151. hay alguna forma de yo cambiar el jquery en que lugar esta eso?

    ResponderEliminar
  152. Pues podrías quitar el script de jQuery, el problema es que lo estás usando para algunos otros trucos y si lo quitas esos trucos o gadgets dejarán de funcionar.

    ResponderEliminar
  153. Hola, queria consultarte, porque puse el menu en mi blog, y me salio bien, pero me queda como si fuese un recuadro, no se como sacarlo, probe un par de cosas que aconsejaste arriba, pero nada, si me podes ayudar te lo agradeceria. Gracias.

    ResponderEliminar
  154. ya esta, ya lo pudo arreglar. gracias!
    excelentes consejos, me quedo atento a tu blog.

    ResponderEliminar
  155. Me alegro que ya lo hayas resuelto :)

    ResponderEliminar
  156. a mi no me funciona e hice todo al pie de la letra...

    ResponderEliminar
  157. Sin saber la dirección de tu blog no puedo saber cuál es el problema.

    ResponderEliminar
  158. Hola Potro, yo estoy haciendo un blog nuevo:
    http://bazar-indefensos-peludos.blogspot.com/
    Estoy haciendo pruebas y he intentado poner éste menú, pero no se me desplazan las imágenes.
    He buscado en mi plantilla alguna de las librerías que mencionas como incompatibles pero no encuentro ninguna...
    ¿Qué me recomiendas?

    ResponderEliminar
  159. Hola IndefenS.O.S Peludos,

    Recuerda el primer paso que es descargar el archivo que se menciona, descomprimirlo y subir su contenido a un hosting como Google Sites o Dropbox.
    Luego, donde dice URL del archivo debes poner la URL del archivo que previamente subiste al hosting.

    Saludos.

    ResponderEliminar
  160. Hola, soy IndefenS.O.S Peludos otra vez...
    Lo que me comentas Potro lo he hecho, de hecho lo tengo en Google Sites.
    He seguido todos y cada uno de los pasos pero veo que no se me desplazan las imágenes. Leyendo los comentarios que le has hecho a la gente en situaciones similares he seguido tus consejos, pero nada.
    De hecho, ni siquiera sé si tengo alguna de las librerias de JQuery, o las otras que son incompatibles, pero no sé si he buscado bien. He buscado en la plantilla de mi blog, es decir en la sección HTML de diseño, pero nada, sigo igual....

    ResponderEliminar
  161. En tu código sigue igual que como lo tengo en la entrada, es decir, aún no has cambiado las URLs del primer código.
    Si te fijas en tu plantilla verás que aun tienes esto:

    URL del archivo mootools-core.js
    URL del archivo byslidemenu.js

    Eso es lo que debes cambiar por las URLs de los archivos que subiste a Google Sites.

    ResponderEliminar
  162. Hola Potro, otra ves la de IndefenS.O.S Peludos...
    Primero que nada muchas gracias por tu atención y tu tiempo.
    Después comentarte que eso ya lo había hecho pero por alguna extraña razón se me ha cambiado solo!!!
    La cuestión es que he vuelto a poner las URLs del sitio donde tengo las librerías y seguimos en las mismas...
    Ains!

    ResponderEliminar
  163. Veo que te ha hecho falta esta parte en el gadget donde has puesto el menú:

    <ul style="display:none; visibility:hidden;" class="bsm" id="byslidemenu">
    <li></li></ul>

    Quizá es por eso que no se muestra.

    ResponderEliminar
  164. Hola Potro, muchas gracias, eso lo quité porque la verdad es que me extrañaba mucho, pensé que era un error, no entiendo muy bien para qué está ese trozo de código, ya que si te das cuenta en la versión horizontal no es necesario ponerlo. Además parece ser una simple lista vacía con su inicio ul y su fin /ul, no sé, me suena raro, pero aún así lo he puesto otra vez siguiendo tu consejo, y seguimos igual.
    Lo que si veo es que le añade unas huellas de perro al lado de cada foto, y es que supongo que es por la plantilla que define para la sidebar que los items de las listas empiezan por esa huella...
    En fin... que parece que se me resiste...

    ResponderEliminar
  165. Ya sale!!! jejeje
    gracias!!!!
    Tuve que esperar a que cargara!
    Mil gracias potro era eso..
    A ver si me entero bien de para qué sirve cada cosa...

    ResponderEliminar
  166. Ese pedazo de código aunque parece no ser indispensable sí lo es pues desde ahí se llama al script para que reconozca los estilos y pueda aplicar el efecto, es por eso que se ha puesto ;)

    ResponderEliminar
  167. Buenas, he intentado poner este menú en mi blog pero no consigo que quede horizontal como debería, y mucho menos que se muevan las pestañas..

    Las imágenes son en JPG de 330x225 pixels y subidas a la carpeta PUBLIC de dropbox.

    He hecho todo según se dice pero no consigo mejorarlo de ahí...

    Aquí puedes ver el resultado tan penoso en el que he dejado el blog:

    www.bionic.tk o www.bionic-spain.blogspot.com

    Gracias de antemano y muy buen blog, estoy atento siempre y mirando tutoriales para intentar mejorar el mío poco a poco.

    ResponderEliminar
  168. Hola Bionic,

    Revisa el código que está dentro del HTML/Javascript, si te fijas el cierre </ul> debe ir justo al final de todo y tú lo has puesto en medio.

    ResponderEliminar
  169. hola , no puedo descargar el archivo con los URLs por lo que queria saber si no me los podrias pasar como comentario
    muchas gracias

    ResponderEliminar
  170. Gracias, ya lo cambié y sigue igual...no sé si es por el tamaño de las imágenes o por qué...me recomiendas borrar todo y empezar de nuevo?

    Gracias de nuevo

    ResponderEliminar
  171. Camila Aleida Rocha, son demasiado largos para que quepan en un comentario, prueba de nuevo que el enlace lo acabo de probar y está funcionando bien.


    Bionic, pues puedes intentar de nuevo o hacerlo en otro blog que tenga una plantilla que NO sea hecha con el Diseñador de plantillas pues me temo que el problema podría ser el tipo de plantilla que usas.

    ResponderEliminar
  172. Y eso de la plantilla cómo puedo quitarla de mi blog? es que quiero empezar a personalizar más mi blog e ir mejorándolo: la cabecera que le hice que queda muy cutre, ponerle los botones del menú, más opciones y eso...

    La verdad que aprendo bastante en este blog, pero como no entiendo demasiado pues me cuesta un poco...

    Gracias de nuevo, gran curro.

    ResponderEliminar
  173. Pues la plantilla Mínima de Blogger es la más moldeable para personalizar. Para instalarla entra en Diseño > Edición de HTML y hasta abajo dice 'Plantillas de diseño (lanzado en 2006)' haz click ahí y elige la Mínima.
    A partir de ahí puedes ir personalizando la plantilla poco a poco; la apariencia es muy simple pero con ella tendrás menos problemas para irle metiendo más cosas.

    ResponderEliminar
  174. He cambiado a la plantilla Mínima y he puesto todo de nuevo, pero nada..lo he puesto en la barra lateral para que al menos no me descuadre tanto, pero ni se mueven ni nada.

    Hace falta que sean al menos 5 o 6? o puedo poner solo 3? No sé qué hago mal, soy un negado XD gracias de nuevo!

    ResponderEliminar
  175. En el primer código te ha faltado agregar la URL del archivo byslidemenu.js
    Sólo has agregado la URL del archivo mootools-core.js

    ResponderEliminar
  176. Muchas gracias de nuevo El Potro, al final opté por una plantilla a la que con un gadget le he podido poner un menú y ya de paso renovar todo el blog. Me gusta mucho más ahora que antes.

    De verdad, gracias por tu interés y dedicación (tiempo y esfuerzo), pero con este menú mismamente me va bien de momento, si veo que quiero ir a más volveré a intentar poner este:)

    Un saludo y tienes un seguidor más!

    ResponderEliminar
  177. Vale, lo importante es que el blog esté como a ti te gusta :)

    ResponderEliminar
  178. Potro, otra vez vengo a molestar XP.
    He probado el script. Me funciona en mi PC con Firefox, pero al parecer no funciona en otras PCs y tampoco en mi PC en IE. En IE me sale un mensaje de error:
    Detalles de error de página web

    Mensaje: El objeto no acepta esta propiedad o método
    Línea: 2065
    Carácter: 1
    Código: 0
    URI: http://lasscanlations.blogspot.com/

    ¿Qué podrá ser?
    Saludos.

    ResponderEliminar
  179. Probablemente en esas PCs no tienes instalada la última versión oficial de Internet Explorer que es la 8.

    ResponderEliminar
  180. Hola Potro... coloque este menú pero aunque le puse el código para la imagen vertical las imágenes se ven horizontales...
    no se que paso... gracias y saludos
    www.artedigitalmcy.blogspot.com

    ResponderEliminar
  181. Hola artedigital,

    Debes modificar las imágenes para que el texto no aparezca a un costado sino arriba para que de este modo el texto de la imagen se aprecie de forma vertical.

    Cuando se pone el texto de la imagen a un costado es para usarla en modo horizontal.
    Saludos.

    ResponderEliminar
  182. Hola potro. El menu que pretendo esta explicado en este blog: http://www.madeincima.eu/blog/jquery-plugin-easy-accordion/

    Pero es muy complicado para mi. Tendrías la amabilidad de ver como simplificarlo para los brutos como yo?

    Te agradezco

    ResponderEliminar
  183. Hola anibal,

    Hay un par de menús muy parecidos igual con jQuery que explican en Vagabundia que quizá te puedan interesar:
    http://vagabundia.blogspot.com/2008/06/un-acorden-horizontal-en-slo-unas-lneas.html

    http://vagabundia.blogspot.com/2011/02/acordeones-simples-con-jquery.html

    ResponderEliminar
  184. Hey loco, que buena onda!!! gracias por el aporte,
    Igual sigo fiel a ciudad blogger

    ResponderEliminar
  185. Hola, está genial este menú, pero ¿podrías decirme algún otro menú parecido a este? con efecto deslizante y eso..
    Gracias.

    ResponderEliminar
  186. Hola potro, tengo un problema con este blog http://erikalarb.blogspot.com/
    he incertado todo m salen las imagenes pero no el efecto de deslizamiento quisiera saber a q se debe el problema t agredeceria vastante

    ResponderEliminar
  187. David, mira el comentario #192.


    ERIK, no funciona porque como mencioné al inicio de la entrada, requiere Mootools el cual no es compatible con la mayoría de las librerías de efectos como jQuery, Prototype o Scriptaculous y tú usas estos dos últimos, justamente para el menú deslizante que está del lado derecho.

    ResponderEliminar
  188. Gracias Potro por el aporte, y hay alguna forma de modificar para mootools y/o colocar otro menu deslizante con imagenes xq el menu que he incertado no tiene imagenes, disculpa por las molestias, y viendo que eres un AZ en esto tengo una duda sobre adsense ya que he llenado todos los requisitos y seguido los pasos y no se apertura los vinculos de adsense, sera porque cuando m dan un codigo dice q tengo q pegar en la pagina q desee, no entiendo esa parte o mejor dicho no se como hacerlo m gustaria que me expliques gracias

    ResponderEliminar
  189. Modificarse no se puede, y para que trabaje con Scriptaculous lo veo más difícil aun. Será más sencillo que encuentres uno basado en jQuery, pero ese también es incompatible con Scriptaculous.

    Si ya creaste tu anuncio de Adsense prueba primero pegar el código dentro de un elemento HTML/Javascript. Al cabo de 10 mins. verifica si ya se ve en el blog.

    ResponderEliminar
  190. man esta bien xvr tu blog gracias pero no sale el menu horizontal porque sale como vertical osea para abajo todo ps ayudame q haGo

    ResponderEliminar
  191. ¿Y en cuál blog lo has puesto...?

    ResponderEliminar

Los comentarios están siendo moderados y serán publicados una vez que hayan sido revisados por un administrador.
Si tu blog contiene material protegido por derechos de autor habilita tu perfil y deja únicamente el nombre de tu blog, no dejes la dirección del mismo, de lo contrario el comentario será eliminado.

 
Ir Arriba Ir Abajo
¿Te gusta Ciudad Blogger?