JMiur [E]

Por alguna razón que desconozco, Blogbar la barra de búsquedas que había incluido, dejó de funcionar. El problema no era visible en Firefox, pero, al usar Internet Explorer, las páginas no se cargaban y muchas imágenes desaparecían misteriosamente.

No le encontré solución así que decidí quitarla pero, como quería tener algún buscador incorporado, me puse en campaña y recorrí la web de uno a otro lado. Nada me convencía. Por fin, me encontré con una rutina en PurpleMoggy's Blog que, si bien no satisfacía mis necesidades, me permitiría adaptarla con cierta facilidad.

Lo que sigue es la explicación del elemento búsqueda que está en en la barra lateral del blog, bajo el título BUSCAR AQUI Y ALLÁ.

La idea de la llamada Searh Box 4-in1 creada por PurpleMoggy es tener la posibilidad de seleccionar entre cuatro tipos de búsquedas diferentes: en el blog, en Google, en Blogger y en Technorati. La primera es igual que buscar desde la barra superior, la segunda y la tercera utilizan Blogsearch y la tercera busca entradas del blog, dentro de Technorati. Como ninguna hace una búsqueda normal. Se me ocurrió dejar lo esencial y modificar las acciones de los formularios para que, simplemente, buscaran en mi blog y en Google.

Se necesitan tres cosas, una serie de declaraciones de estilo CSS, una rutina JavaScript y un elemento HTML en donde insertar el código en si mismo.

El script es igual al original, salvo que he quitado dos de las opciones y debe ser agregado en el HEADER de la plantilla:

<script type='text/javascript'>
//<![CDATA[
var search_which_one = "pm-f-h";
function selectH() {
document.getElementById('li-h').className = 'pm-search-selected';
document.getElementById('li-g').className = 'pm-search-unselected';
document.getElementById('pm-search-h').style.display = 'block';
document.getElementById('pm-search-g').style.display = 'none';
document.getElementById('pm-f-h').value = document.getElementById(search_which_one).value;
search_which_one = "pm-f-h";
}
function selectG() {
document.getElementById('li-h').className = 'pm-search-unselected';
document.getElementById('li-g').className = 'pm-search-selected';
document.getElementById('pm-search-h').style.display = 'none';
document.getElementById('pm-search-g').style.display = 'block';
document.getElementById('pm-f-g').value = document.getElementById(search_which_one).value;
search_which_one = "pm-f-g";
}
//]]>
</script>

Ahora, el código CSS mínimo que debe insertarse dentro de la sección de la plantilla.


div#pm-search {margin: 0; padding: 0;}
div#pm-search ul {margin: 0; padding: 0; text-align: center;}

div#pm-search li {
/* blanquear estilos previos */
list-style-type: none;
display: inline;
cursor: pointer;
background-image: none;
text-indent: 0px;
margin: 0; padding: 0;
/* ... agregar tipo de fuente, colores, etc ... */
}

div#pm-search form {margin: 0; padding: 0;}

/* estilo de los vínculos de selección */
div#pm-search-h {display: block;} /* visible por defecto */
div#pm-search-g {display: none;} /* oculto por defecto */

.pm-search-selected { } /* del tipo seleccionado */
.pm-search-unselected { } /* del tipo no seleccionado */
/* ... agregar tipo de fuente, colores, etc ... */

.pm-input { } /* cuadro ingreso textos */
.pm-boton { } /* pseudo-botón ejecutar la búsqueda */
/* ... agregar tipo de fuente, colores, etc ... */

Lamentablemente no puedo dar demasiados detalles porque todo va a depender del tipo de plantilla, de color de fondo, etc. En este caso, no queda más remedio que recurrir al viejo método de PRUEBA Y ERROR hasta lograr el efecto gráfico que se deseado.

Por último, este es el código que debe ser insertado en un elemento HTML en la barra lateral. Personalmente, me resultó más cómodo incluirlo en una tabla pero pueden probarse otras alternativas.


<div id="pm-search" align="center">

<ul>
<li id="li-h" class="pm-search-selected"
onclick="selectH()">AQUI</li>
<li id="li-g" class="pm-search-unselected"
onclick="selectG()">GOOGLE</li>
</ul>

<!-- busqueda en el Blog -->
<div id="pm-search-h" align="center">
<form action="URL_DEL_BLOG/search" method="get">
<input id="pm-f-h" class="pm-input" value=""
name="q" size="25" type="text"/>
<input class="pm-boton" value="BUSCAR" type="submit"/>
</form>
</div>

<!-- busqueda en Google -->
<div id="pm-search-g" align="center">
<form action="http://www.google.com.ar/search" method="get">
<input value="es" name="hl" type="hidden"/>
<input id="pm-f-g" class="pm-input" value=""
name="as_q" size="25" type="text"/>
<input class="pm-boton" value="BUSCAR" type="submit"/>
</form>
</div>

</div>

AGREGAR UN BUSCADOR (Search Box)
  • Searh Box 4-in1
  • w3.org - FORMS
  • December - FORMS
  • 32 comentarios:

    Daniel  

    Prueba el buscador de mi blog, quizás te interese.

    Responder
    JMiur  

    Debo conseguir otros anteojos. Lo había pasado por alto y me hubiera ahorrado bastante trabajo. El código es similar, cambian los nombres pero lo fundamental es igual.

    Ya lo he "guardado" por las dudas. Gracias por tu aporte.

    Responder
    Pablo Bozzolo  

    Amigo: tienes idea porque las busquedas del tipo: dominio/search?q=keyword no funcionan en Google Pages ? :(

    Disculpa si saco temas que no estas tratando ahora...

    // Un abrazo

    Responder
    JMiur  

    No entiendo por qué deberían funcionar. Hasta escribiéndolas en la barra de direcciones del navegador funcionan ¿No habrá algún otro problema?

    Probá agregar una como si fuera un enlace común y corriente, escribiendo la URL y la palabra a buscar y fijate si anda. No tengo mucha experiencia en eso e GooglePages, lo uso sólo como alojamiento y las páginas web que he puesto, las he creado aparte y las he subido.

    Responder
    Pablo Bozzolo  

    Jmiur: es exacto lo que hice.... probe directamente modificando la url, pero no veo que funcione.

    Podrias especializarte tambien en Google Pages... que da alojamiento y es de Google como Blogger :)

    El error que me reporta es: "The page you have requested could not be found. (404)"

    Responder
    Pablo Bozzolo  

    Tenes idea de cuales son los requisitos para que funcionen asi las busquedas ? quien hace la busqueda ?

    Gracias!!!

    Responder
    JMiur  

    Sigo sin ser un experto pero hice una prueba y está ACÁ (prohibido reirse)

    :D

    Hay un enlace simple que dice:
    <a href="http://vagabundia.blogspot.com/search?q=google">TEST BUSCAR</a>

    y abajo hay un formulario que coloqué en Edición HTML y dice:

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

    Por lo que vi, también existe una opción para agregar gadgets de Google y creo que hay alguna con buscadores.

    ¿Ayuda en algo?

    Responder
    Pablo Bozzolo  

    Hola! todo ayuda!!

    En realidad, me refería a que no vi que busque internamente [dentro de GP] pero me gustó la página que hicistes y me sirve eso que dices de que puede haber algun gadget para buscar.

    La verdad es que te has tomado DEMASIADAS molestias, así que MUCHAS gracias!!!!

    Voy a investigar un poquito más...

    Estoy encantado de ver como te preocupas por las dudas que todos tenemos..... sin dejar alguna sin responder.

    gracias de nuevo! // un abrazo.. Pablo

    Responder
    Pablo Bozzolo  

    Lo resolvi con Google Custom Search :D

    Responder
    JMiur  

    Genial Pablo :)

    Siento no haber comprendido eso de la búsqueda interna.

    Responder
    Anónimo  

    Hola: que buen blog che , lo felicito al dueño , la verdad aprendi mucho!!
    vamos al grano , tengo una pagina en googlepages, use una plantilla que viene con el googlepage e intento insertar botones en flash lo cual los pude subir pero no pude poner!
    Vi que decias que hacias la pagina y despues la subias completa !! se puede hacer eso? como hiciste, copiaste y pegaste el html¡?
    Use para hacer los botones el macromedia flash , pero al final al pedo , las plantillas son muy cerradas , no encuentro los head para poner un metatag para aparecer en el google aunque sea ultimo! :)
    y entre otras cosas poner un post
    Espero sus respuestas y desde ya agradecido!!!
    saludos_

    Responder
    JMiur  

    Fijate en este post.

    Sobre el final se muestra como subir archivos. Los archivos pueden ser de casi cualquier tipo, incluyendo HTML así que, se crea la página en la PC y luego, se sube completa, como si fuera una imagen o cualquier otro tipo de archivo.

    Responder
    Claudio  

    Utilizo el último elemento html para insertar un buscador de la barra lateral. He reducido el buscador y lo único que hay es para buscar "AQUÍ".
    Después del término "value" se le puede asignar una o varias palabras para que haga la funcion de botón. MI pregunta es:
    -¿Podría substituir el boton de buscar por una imagen?

    La imagen es esta

    Responder
    JMiur  

    Sí, eso es posible, Claudio:

    <input type="image" src="URL_imagen" />

    Algunos detalles de esa personalización pueden verse en esta entrada.

    Responder
    Carlos Martínez  

    Ya debes estar agobiado de tantos comentarios, pero ya lo solucione, gracias, de todos modos me gustaria que vieras como ha quedado, esta es la imagen que use para el buscador...

    Imagen

    El buscador que utilice es el que nos da blogger como elemento HTML. Luego fui subiendolo, acomodando los margenes hasta que quedo en el tope, pero me pregunto ¿no abra otra forma?, porque pienso que es algo poco estático :S... También me pregunto, ¿no se podra obtener el CSS de ese buscador para colocarlo fuera de un widget? Que quede directo de la plantilla para usarlo fuera de un elemento HTML y colocarlo en cualquier parte sin mayor dificultad....

    Mi Blog.

    Responder
    JMiur  

    Vi que había varios comentarios eliminados así que no estoy demasaido al tanto del problema aunque me alegro que se solucionara.
    No es posible colocarlo fuera de un elemento ya que es un gadget que maneja Blogger pero, así, en general, un gadget podría ser ubicado en cualquier parte, no hace falta que esté en la sidebar.

    Responder
    Carlos Martínez  

    Si, entiendo eso, aunque no esta demás soñar, lo de los comentarios eliminados era porque el gadget lo tenia al final de la sidebar, pero ya resolvi eso. Lo otro es que el buscador no esta bien, no se si seran fallas de google. Por ejemplo, en mi blog tengo explicaciones de "MySQL", y cuando trato de buscar en mi blog con google no me muestra resultados, incluso colocando "dominio/searh...".

    También tengo otra duda, como hago para colocar en el buscador de google el efecto "onfocus", como en esta entrada, no creo que sea fácil pero debe haber una forma.

    Responder
    JMiur  

    Los resultados del buscador no hay forma de controlarlos o por lo menos eso creo. Usando dos diferentes como tengo en este blog, los resultados de ambos varian :)

    Como el gadget lo agrega Blogger de manera directa, no hay código, si miras el código de CustomSearch1 casi no verás nada así que no se me ocurre una forma de crear ese efecto ya que debería ir en la etiqueta INPUT.

    Como curiosidad, no lo he probado, si se leyera el código fuente del blog en el navegador y se pudiera copiar el código ... no sé si eso funcionará o si Blogger lo permite.

    Responder
    RED PEPPY  

    JMiur he instalado el buscador en un blog de domino propio y no funciona. Luego de completar el campo de búsqueda y clickear en buscar no aparecen entradas correspondientes sino que visualizo un espacio en blanco en donde unicamente dice página principal.
    Antes de conseguir el dominio, cuando aún tenia que asigna blogger funcionaba pero actualmente no.
    Agradezco tu ayuda.

    Responder
    JMiur  

    No sabría responderte. No sé cuál es el blog o si sigue funcioanndo bajo Blogger.

    Responder
    Eulalia  

    Querido amigo, los buscadores de blogbar se han convertido en ladrones de blogs. Si tienes uno instalado, cuando alguien entra en tu blog le dicen que está en venta. Me acaba de pasar y aún estoy alucinando.
    ¿Como puede alguien poner en venta lo que no es suyo?
    Si lo quitaste antes de que empezaran a hacerlo, ¡no sabes de la que te has librado! Porqué con lo popular que es tu blog, no dudes que alguien lo hubiera comprado y te quedabas sin el.
    Un abrazo.

    Responder
    JMiur  

    Lo que ocurre, Eulalia, es que Blogbar ya no existe y el dominio http://www.blogbar.org/ tampoco y por lo tanto, al entrar a él se muestra una página que indica eso, que ese dominio está en venta, cosa que ocurre cuando quien lo posería, no lo renueva.

    De ninguna manera alguien puede comprar un dominio que ya existe a menos que el dueño acepte.

    En el caso de Blogger, sería imposible ya que el dominio es blogspot.com y dudo que Google lo quiera vender, no es nuestro, es de ellos.

    Responder
    Eulalia  

    O sea que lo que está en venta no es el blog que es redirigido a esa página, pero en este caso ¿porqué los blogs que tienen o tenian ese gadget son redirigidos a ella? Con que dejara de funcionar el gadget habría sufuciente, ¿no?
    Además da a entender que es el blog al que querias entrar lo que está en venta y que por eso no puedes leerlo.
    Al menos eso ha pensado quien me ha advertido de que no podia entrar a mi blog por ese motivo.
    ¡Es de locos!
    Gracias por tu respuesta amigo.

    Responder
    JMiur  

    No recuerdo cómo funcionaba este gadget en particular pero, si es un script que cargaba un archivo y ese archivo no existe más, lo que se carga es el home del sitio original que es eso que ves.

    Leí por ahí que algo similar está pasando con otro servicio llamado blogrolling.com; al dejar de existir el gadget, se sigue cargando el home del dominio. Incluso, leí en los foros de Blogger que ni siquiera abre el blog, que enseguida se abre la página esa.

    Sí. Puede causar confusión pero no es para preocuparse, se resuelve quitando el gadget.

    Responder
    Josep-Pepe  

    Hola,
    Como podría hacer un buscador que cuando lo utilizas, es como si estuvieses haciendo CTRL + F en esa página.
    Saludos

    JMiur  

    No sabría decirte pero ¿para que hacer algo así si cualqueir navegador posee esa función?

    Josep-Pepe  

    Para tener un buscador que buscase en una página estática. Y una opción que al clicar en un botón se abriese el buscador de CTRL + F del navegador?

    JMiur  

    En Firefox, algo así:

    <a href="#" onclick="find();"< BUSCAR </a>

    En otro navegadores, no sé porque en general, por razones de seguridad, con JavaScript, no pueden ejecutarse comandos del navegador salvo aquellos que estos permitan y siempre que el usuario no los haya limitado.

    Hay algún script que intenta hacer eso y deberás probar si funciona o no:
    http://www.seabreezecomputers.com/tips/find.htm

    Josep-Pepe  

    He probado lo de la web y no funciona ni en FIrefox ni Chrome:
    bestutilidades.blogspot.com

    JMiur  

    Es lo que te dije. Los navegadores no permiten que se actue sobre los controles internos desde una página web, sería muy peligroso si lo permitieran. Sól oadmiten algunas pocas cosas y eso que admiten es variable.

    Responder
    Walter  

    quiero un buscador como el tuyo

    JMiur  

    Tal como dice el mismo buscador, es la búsqueda personalizada de Google

    Responder

    ¿Quiere dejar un comentario?

    recuerde que los comentarios están siendo moderados y serán publicados a la brevedad ...

    Nota: sólo los miembros de este blog pueden publicar comentarios.

    Si le gusta ir a lo seguro utilice este botón para abrir los comentarios en una ventana modal en esta misma pagina.

    Si añora tiempos idos, use este enlace para agregar un comentario al viejo estilo ...

     
    CERRAR