Agregar un menú en el Blog
Al crear mi Blog me encontré con algunos ítems que son bastante molestos a la hora de customizar el diseño. Si bien existen muchos templates en la web yo quería customizar uno que ya trae Blogger, además porque ya lo estaba terminando de acomodar como a mi me gustaba. Por ejemplo un ítem que quería agregar era la barra de navegación. Blogger no incluye esta herramienta nativa así que hay que agregarla editando el HTML.
Una aplicación muy útil que me encontré en la web es la CSS Tab Designer.
Con esta utilidad podemos agregar los menús que nosotros querramos de la forma que querramos, tanto vertical como horizontal. Con los colores, botones y fuentes que querramos. La aplicación es simple, armas el menú, elegís el template y después solo tenes que copiar el contenido del código dentro de tu plantilla de Blogger.
El código CSS hay que copiarlo dentro de <>, en cambio la lista con el menú hay que copiarlo dentro de un ítem HTML que agreguemos a nuestro template en la ubicación que nosotros querramos.
Email
| 
Imprimir
| 
PDF
De kevin el naci el 28 Oct, 2007 | Responder
ey me funciona mucha gracias
kevin el naci
De Diego Cabai el 29 Oct, 2007 | Responder
Me alegro que te haya servido la aplicación, pero también podes visitar a CSS Play que tiene muy buenos menús CSS entre otras cosas por si no estas conforme con el de la herramienta. El link está en la Sidebar. Saludos
De Vsk el 5 Jan, 2008 | Responder
Es muy útil pero no entiendo como subo a blogger los .gif necesarios que me genera la aplicación que nombras.
Es decir, copie el html generado dentro de un ítem html/jscript, pero me aparece pero sin el formato de selección etc.
Alguna ayuda?
De Diego Cabai el 5 Jan, 2008 | Responder
VSK, gracias por el comentario, te cuento que las imagenes las debes subir a algun hosting para que esten accesibles desde Blogger. Luego cambias dentro del html el nombre del archivo .gif por la ruta completa.
Podrías crearte un sitio en http://www.googlepages.com donde solo subirías las imagenes y las linkeas desde ahí. Sino tambien las podes subir a picasaweb.google.com que se accedería con el mismo usuario que el de blogger. Sino como ultima opcion podes recurrir a un hosting de archivos gratis como http://www.mediafire.com/.
Espero te haya servido sino avisame.
Saludos!
De skorns el 24 Jan, 2008 | Responder
hola sabes estuve provando la utilidad se ve interesante pero tengo un problema no logro que reconoscael menu me parecen siertos errores no me deja ni ver vista previa cuando agrego un menu…
creo agregarlo bien… pues tenia otro menu que se instalaba de la misma manera creo y queria estosque son m,as novedosos peo no puedo se agradeseria ayudaras… o exoplicaras la instalacion..
De Diego Cabai el 24 Jan, 2008 | Responder
Hola skorns, gracias por el comentario. Te cuento que la instalación del menú es bastante sencilla. Lo primero y principal es dónde vas a alojar las imágenes del menú. Si vas a usar menú sólo de colores no hace falta pero si vas a usar una linda botonera necesitas un lugar dónde alojar las imágenes. Con esto me refiero a algún hosting en particular o bien podés usar picasaweb.google.com. Una vez que tengas las imágenes arriba, necesitas subir el código del menú que se divide en dos partes, el código CSS que le va a dar el formato y el código HTML que es el menú en si. En el código CSS asegurate de cambiar la ruta de las imágenes por la ruta donde las subiste, me refiero a toda la dirección html de donde subiste cada imagen. Luego ese código va en “Edición HTML” del menú de Blogger en la primera parte del código. Tiene que ser antes del </head> para que lo tome. Guardás esa modificación y luego vas a los Elementos y agregás un nuevo elemento HTML que lo posicionas arriba del Blog para que abarque toda la pantalla a lo ancho y ahí pegás el código HTML que te dió. Con eso quedaría instalado. Decime si te queda alguna duda y lo vemos.
Saludos!
De skorns el 24 Jan, 2008 | Responder
hola nuevamente xP
weno mira lo que sucede que yo probe un menu similar que se utiliza igual.. osea de las dos partes tal como me explicaste.. y me funciona el problema esta en que cuando agrego el codigo que me da el programa .. la primera parte
blogger me da este error:
——————————
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: Scanner State 24 not Recognized
————————–
he intentado de varias maneras pero no ahi caso…
no se como agregarlo =( se veia tan genial el menu negro ajajajaj bueno si puedes ayudarme se agradeseria xP
lo mas provable es que lo inserte mal pero no se porque si lo pongo antes de que termine head y la otra parte no alcanso ni a ponerla porque en la primera parte me da ese error
De Diego Cabai el 24 Jan, 2008 | Responder
mmm me parece que estas copiando absolutamente TODO el código y no sólo lo necesario. Te cuento, por ejemplo tomemos el menú negro de ejemplo. La parte que tenes que copiar justo antes del </head> es la que comienza con
/*- Menu Tabs H————————— */
a partir de ahí hasta –> tenes que copiarlo antes del </head>.
Despuès lo que copias en el contenido HTML es a partir de <div id="tabsH"> hasta </div>. Espero que con esto lo puedas instalar.
Saludos!
De skorns el 25 Jan, 2008 | Responder
xP grasias… intentare ahi te aviso como me funciono xP … espero no seguir molestando jajajaja bueno ahi te cuento..
De skorns anime el 25 Jan, 2008 | Responder
grasias por tu ayuda te cuento que logre que funcionara pero…. no me funciono colocandole en el lugar que me dijiste … en la unica ubicacion que me funciono correctamente fue antes de
:skin >
fue en el unico lugar que funciono bien.. xP
bueno muxas grasias por tu ayuda..
aun sigo personalizando mi blog.. xP pronto lo tendre mejor de loq ue pense grasias nuevamente …
De Diego Cabai el 25 Jan, 2008 | Responder
Me alegro que te funcionara!
Hay que dedicarle tiempo, el cual casi nadie tiene jaja pero una vez que le pones empeño y tiempo las cosas salen. :)
Suerte y Saludos!
De Arturo Fukuda el 17 Apr, 2008 | Responder
Hola Diego, excelente Blog.
Mira, ando incursionando en el mundo de los BLOGGERs y deseo agregar la barra de menu en mi Blog, pero no se como generar la direccion de enlace-destino, es decir…si mi blog es por eg. http://www.abc.com, no se como crear una nueva página para el enlace, por eg. http://www.abc.com/fotos - No se si me puedas ayudar….gracias anticipadas.
De Diego el 17 Apr, 2008 | Responder
Hola Arturo, gracias por el comentario.
Te cuento que si el menú sería para un sitio en Blogger como el tuyo que figura en tu perfil, no podes hacer páginas aparte del sistema de blogging. Por ejemplo no podes hacer una página lalala.blogspot.com/fotos
Lo que si podes hacer es una entrada nueva en el Blog y el menú linkearlo a esa entrada y que en esa entrada tenga la información que vos querías. Cuando la creas podes ponerle una fecha mas vieja para que no figure como ultima entrada. Sino también podes linkear el menú a las categorías como yo tengo en el menú de Blogspot. En unos días no se podrá entrar mas porque va a estar redirigido acá pero voy a levantar uno para muestras. Espero te sirva.
Saludos!