26 diciembre 2013

El gadget: "Cuadro de búsqueda" no funciona

El Buscador que ofrece Blogger

El "cuadro de búsqueda" de Blogger no está funcionando ¿ya lo viste? Hace días me comentaban que no funcionaba, inmediatamente después de leer los comentarios lo probé y mostraba los resultados en el recuadro, lo curioso es que ayer según comprobé, dejó de arrojar resultados, así que decidí investigar y todo parece indicar que el problema es general  ya que varios usuarios lo han reportado y según dicen, el equipo de ingenieros de Blogger ya está al tanto del problema, y están buscando una solución definitiva.

Si usas el susodicho gadget, lo mejor será que compruebes por ti mismo que esté funcionando y si no, también creo que lo más práctico es quitarlo y en su lugar poner un cuadro de búsqueda creado con código HTML, tal y como lo mencionan en el foro de ayuda de Blogger, o bien usar un cuadro de búsqueda de Google al que podrás integrar con AdSense, si es que usas el programa para monetizar tu blog.

Para poner un cuadro de búsqueda usando código HTML, necesitas ir a la sección de Diseño de tu blog, y agregar un gadget, eligiendo la opción HTML/Javascript, luego, deberás poner el siguiente código, donde tendrás que editar  lo que está coloreado de azul, tal y como se indica:

<form action="http://Nombre_del_blog.blogspot.com/search" name="input" method="get">
<input value="" name="q" type="text"/>
<input value="Buscar" type="submit"/>
</form>


En el código anterior, la linea que hace que aparezca el campo donde se introduce el texto es esta:

<input value="" name="q" type="text"/>

Y esta otra linea de código, es la que hace que aparezca el botón, y que por defecto mostrará el texto Buscar, ya que así lo hemos puesto, pero si quieres puedes cambiarlo por otro:

<input value="Buscar" type="submit"/>


Cuando un usuario haga una búsqueda, aparecerán las entradas que tengan la(s) palabra(s) que se puso en el campo, y arriba un mensaje con las opciones para que se muestren las entradas por fecha, o por relevancia. Mensaje que también aparece cuando se hace una búsqueda por etiqueta, aunque no muestra la opción de ordenar las entradas por fecha o relevancia.

Cartel que aparece al hacer una busqueda en el blog


Personalizar el botón con CSS


Puedes cambiar la apariencia del botón a tu gusto, usando el CSS que puedes conseguir con uno de los generadores de botones que te mostraba en esta entrada.
Para ello, vas a tener que agregar la parte de código que he resaltado con fondo amarillo. Ahí definí un nombre (por medio del atributo class) para pueda aplicarse el CSS que definiremos con dicho nombre.

<input class="mi_boton" value="Buscar" type="submit"/>

Luego, tendrás que agregar el CSS desde el diseñador de plantillas, yendo a Avanzado > Añadir CSS, usando el mismo nombre de la clase que creamos...

.mi_boton {
/*Aquí el CSS del botón que obtuviste en el generador de botones*/
}



Otra opción muy sencilla en donde no necesitarás agregar CSS para personalizar el botón, es usar el nombre de las clases que identifican al botón de "Enviar" del formulario de contacto de Blogger. Para ello, solo cambias la linea que hace que aparezca el botón, y que arriba menciono, por esta:

<input class="contact-form-button contact-form-button-submit" value="Buscar" type="submit"/>

Y el botón se va a ver azul, tal y como aparece en el formulario de contacto. Claro, esta opción será buena para ti, si el botón se adapta al diseño de tu blog ;)

Artículos recomendados:

Gracias por compartir tu comentario y hacernos saber tu opinión.