Hace ya bastante tiempo os presenté el menú horizontal flotante con buscador incluido. Esta vez te traigo algo similar, un menú que construí enteramente con una sola imagen de fondo (un sprite) a la que le atribuí propiedades distintas. Al tratarse de una única imagen, no retrasará en ningún aspecto la carga del contenido y el efecto al pasar el cursor sobre un link será inmediato.
Además, lleva incrustado en el lado derecho un buscador interno que facilitará a tus visitantes la búsqueda de una publicación específica en tu blog y, a diferencia del otro menú con buscador incluido, éste permanece fijo en el lugar que lo colocamos.
Lo creas o no, su instalación está basada en tan solo dos pasos y obtenerlo te llevará menos de un minuto.
Diseño>Edición de HTML>expandimos artilugios
Busca la etiqueta </head> y añade esta línea encima (antes):
<link href="https://sites.google.com/site/scriptsbalcon/b/blmenuBlueice.css" rel="stylesheet" type="text/css"/>
Guarda la plantilla.
Diseño>añadir gadget (elemento de página)>html-javascript
Pega este código en su interior:
<div id="menuBlueice">
<ul>
<li><a href="URL PAGINA">Texto 1</a></li>
<li><a href="URL PAGINA">Texto 2</a></li>
<li><a href="URL PAGINA">Texto 3</a></li>
<li><a href="URL PAGINA">Texto 4</a></li>
<li><a href="URL PAGINA">Texto 5</a></li>
<li class="blbusc"><form id="searchthis" action="/search" style="display:inline;" method="get"><input id="blcbuscc1" name="q" type="text"/><input id="blcbuscc2" value="Buscar" type="submit"/></form></li>
</ul>
</div>
Reemplaza URL PAGINA por la dirección del blog, la web o el artículo a enlazar así como Texto X por el nombre que llevará el enlace.
Puedes editar el término que llevará el botón del buscador borrando la palabra 'Buscar' y escribiendo algo personal.
En caso de querer agregar más enlaces al menú, incluye líneas como esta:
<li><a href="URL PAGINA">Texto 5</a></li>
Házlo siempre antes del bloque que comienza por <li class="blbusc"><form...
Guarda el gadget y arrástralo hasta colocarlo bajo la cabecera. Accede a tu blog, comprueba el correcto funcionamiento del menú y... ¡Disfruta!
¿Problemas al comentar? Utiliza 
Chico yo no entiendo como haces estas cosas. Otro aparatito más que funciona de maravilla en mi blog.
Lindo menu, vos sois una joya. Ya lo puse a mi blogg!
Ariana, ¿Verdad que es fácil de instalar? Lo mejor de todo es que apenas tiene que cargarse, aparece junto al contenido sin retrasar la carga del blog.
Perfecto Marcos, ahora disfruta de una cómoda herramienta para navegar por el blog.
Pongo el código de CENTER al principio y al final /CENTER y me queda como podrías ver en mi blog, ¿Cómo puedo arreglar eso?.
Onalem, ¿Dónde incluyes las etiquetas? Debes hacerlo antes de la línea <div id="menuBlueice"> y después del cierre </div>.
Jaime realemente debo felicitarte por tu gran trabajo. Este menu va de maravilla. Te invito a que te pases por mi proyecto blog musical
www.el-vinilo.blogspot.com
Quiza podamos hacer un intercambio de links si te interesara.
Por cierto al pasar el mouse sobre los links de la barra esta se torna blanca y no azul como deberia, podrias ayudarme?
Gracias por las felicitaciones, Tomaster. Para deshacerte del fondo blanco (el cual aparece por un atributo en tu plantilla, no por el menú -que instalaste a la perfección-) encuentra esto en tu plantilla:
.tabs-inner .widget li.selected a, .tabs-inner .widget li a:hover {
background-color: #FFF9EE;
Reemplaza la línea en negrita con background:none;.
El resultado no aparecerá en vista previa por lo que debes guardar la plantilla para asegurarte de su correcto funcionamiento.
Con respecto al intercambio de enlaces, debo decirte que actualmente no lo hago pero puede que en el futuro me proponga ampliar la lista.
PuroJuego, aunque desconozco a que efectos te refieres, puedo comentarte que -tal y como describes el problema- se trata de un problema con el hosting de archivos. ¿Haces uso de Google Sites para subir los scripts a tu cuenta y posteriormente utilizar su dirección o simplemente copias la URL ofrecida por el autor del truco?
Perfecto entonces. Ten en cuenta que cosas tan simples como la configuración de un servicio de hosting puede afectar a la carga de scripts.
Estimado jaime como hago para que quede mas limpio y sin los blancos que queda en mi blog, http://juancarlosegales.blogspot.com/ bueno un saludo y gracias por pasarnos estos trucos...
Juan Carlos, prueba a incluir el siguiente bloque de CSS en tu plantilla, bajo la primera línea de código a insertar:
<style>#menuBlueice ul {
background: url("http://1.bp.blogspot.com/_Bvhqq3YFEx4/TPDcYFVynnI/AAAAAAAAAeM/ESlN88fvuWc/s320/blblackiceblcn.png") repeat-x scroll 0 0 transparent;
list-style: none outside none;
}</style>
Esto hará que el menú pierda el color grisáceo y se iguale el fondo. Si deseas centrar los enlaces del menú, encierra el código que agregaste en un gadget html-javascript entre las etiquetas que se citan en esta entrada. Gracias a ti seguir las entradas del Balcón.
muchas gracias Jaime, tus concejos siempre nos ayudan, gracias nuevamente...
Gracias a ti, Juan Carlos. Por cierto, quedó muy bien el menú vertical desplegable; es muy cómodo navegar por tu blog ;).