sábado, 4 de junio de 2011

Buscador interno de Blogger mejorado

Y cuando digo mejorado, cabe dentro de las posibilidades de su diseño, comparado con mi anterior versión del buscador interno de blogger, porque es un buscador les funcionará perfectamente únicamente si hacemos modificaciones en modo de resumen con miniaturas, pero sin Javascript, pues si han hecho una búsqueda con este buscador -extirpado de la barra de navegación de blogger-, se darán cuenta que siempre da un número de resultados de entradas diferentes, sin respetar valores como max-result.

Esto es un dolor de cabeza para cuestiones de diseño; más si se te ocurrió agregar uno de los hacks de resúmenes con miniaturas que hay en la red, pues las páginas tendrán marcadamente diversos tamaños.

Como se ve en la imagen de arriba, que muestra el resultado final, agregaremos un bonito buscador interno en un plis-plas como un remedio temporal a la infuncional Caja de búsqueda.

Agregando el estilo, vamos a Diseño - Edición HTML y antes ]]></b:skin> pegamos el siguiente código:
/* buscador interno por cgnauta blog */
#contbuscint
{width:260px; /* Este es el ancho de todo el buscador */
margin:0 auto 0 auto; /* Quita el margin o ponlo a 0 si no quieres centrarlo */
}
#search-box
{
/* Agrega por ejemplo width:140px; para cambiar el tamaño de la caja de texto*/
background:#fff url(http://lh3.ggpht.com/_NNS6r_z4aeg/St_LEuQJSCI/AAAAAAAANzI/XV4G0A5MqUo/lupa.jpg) 3px 3px no-repeat;
padding: 5px 5px 5px 35px;
border: 2px solid #000;}
#search-btn
{
padding:5px;
border: 2px solid #fff;
background:#000;
color:#fff;
}
#search-btn:hover
{padding:5px;border: 2px solid #000;background:#fff;color:#000;}
/* fin estilo buscador interno */
Guardamos nuestra plantilla.

Vamos nuevamente a Diseño - Elementos de la plantilla:
Y donde queramos ponerlo pulsamos en Agregar un Gadget:
Buscamos el artilugio HTML/Javascript y pulsamos en el "+":
Y agregamos el siguiente código:
<div id="contbuscint">
<form id="searchthis" action="/search/"  method="get">
<input id="search-box" name="q" type="text"/>
<input id="search-btn" value="Buscar" type="submit"/>
</form>
</div>
Pulsamos en Guardar y Listo.
Y mientras vuelve o funcionar la descompuesta Caja de búsquedas de Google, esto es lo que hay.

Comentarios y Consultas

Los mensajes son moderados serán revisados antes de publicarse.

Este no es un foro de adolescentes, no uses letras en vez de palabras completas como "q" en vez de "que", ni escribas tus mensajes en mayúsculas, se respetuoso con los demás, si no estás de acuerdo no comentes.

Una cosa es que no te guste una crítica, otra que uses un lenguaje inapropiado para demostrarlo. No me siento en la obligación de publicar ningún mensaje en específico o de leerlo entero si usas palabras altisonantes.

7 comentarios:

  1. Creo que no queda claro que hacés este buscador porque el gadget de blogger no funciona. Yo lo agregué en mi blog, muchas gracias.

    Esperemos que se arregle pronto lo del buscador "oficial"

    ResponderEliminar
  2. Sí, tienes razón, agregaré una notita al repecto.

    ResponderEliminar
  3. Hola matius:
    Yo lo he colocado en mi blog y no me encentra algunos términos. Ya no sé si es blogger, o qué; pero gracias de todas formas.

    No he colocado la primera parte porque no sé qué líneas son las correspondientes al códigoe xactamente (lo mismo meto alguna de más, si dejaras en un color la explicación y en otro el html sería más fácil para l@s que no controlamos de este tema)

    Por cierto, ahora blogger no me deja eliminar el gadget de su buscador de la zona de diseño :S

    Un abrazo!

    ResponderEliminar
  4. La primera parte no es necesaria, son los estilos para la caja, puedes usar los propios.

    Puedes enviarme la plantilla para implementarle el buscador.

    ResponderEliminar
  5. Como este buscador tampoco me servía mucho, ya que no devolvía muy bien y no daba la lista de resultados sino que directamente los resultados, y era lo mismo que usar el buscador "de arriba", usé otro código.

    Te dejo el código, seguramente irá a SPAM, y si querés luego eliminalo, solo espero que te sirva (ojo, es el código para buscar en mi blog, hay que modificarlo) y agregarle "colorcitos":

    <form id="b-search" name="b-search" action="http://blogsearch.google.com.ar/blogsearch">
    <input type="text" id="b-query" name="as_q" />
    <input type="hidden" name="ie" value="UTF-8" />
    <input type="hidden" name="bl_url" value="http://howtoarsenio.blogspot.com/" />
    <input type="submit" name="Search" id="b-searchbtn" value="Buscar"
    onclick="document.forms['b-search'].bl_url.value='http://howtoarsenio.blogspot.com/'" />
    </form>

    ResponderEliminar
  6. Si pero es un buscador externo, no sería distinto a insertar el que te ofrece Adsense o Google.

    Si quieres un buscador interno, con resultados internos dentro de tu sitio con el API de Google, mejor haz este tutorial:
    Reactivar el Cuadro de búsqueda de Blogger: Usando otro cuadro de Búsqueda

    ResponderEliminar
  7. Gracias Me Gusto Mucho, ya esta instalado en mi blog.

    ResponderEliminar

Samurai Jack (2017), episodio 10 "Final"

Samurai Jack (2017)Jack se enfrenta por fin con Aku, todos tratan de ayudar al samurai y la sorpresa vendrá del pasado.

[Leer artículo...]

Noragami entra en paro indefinido

Noragami es suspendida temporalmenteUna de las autoras no puede continuar con su trabajo al frente del manga y se ha decidido meter la historia en hiatus, lo que puede significar...

[Leer artículo...]

Tales of Zestiria y su final Yuri

El final de Tales the Zestiria The XLas aventuras de Sorey llega a su fin con un final de lo más raro que he visto hasta ahora.

[Leer artículo...]

Warau Salesman New (2017) El vendedor sonriente

Warau Salesman New (2017) EstrenosSatoru descubre al culpable de la trama, es el momento de enfrentarse y tendrá que dar todo de sí para cambiar su suerte.

[Leer artículo...]

  © Cgnauta | CGsign blog | [Ver Licencia de uso] | Matius Lenin, Creative Commons, algunos derechos reservados

Regresar ARRIBA  

Vistas desde Mayo 2009

▼/▲ Archivo del Blog

Visitas totales

Información

IBSN: Internet Blog Serial Number 01-77-94-2008

Esta plantilla es creada y diseñada por Matius Lenin para CGnauta blog. Con Scripts de JQuery bajo licencia GNU/GPL. CGnauta es una marca registrada propiedad de Matius Lenin.

Anexos

Bitacoras.com