lunes, 9 de noviembre de 2015

Colocar un buscador dentro de tu blog de blogger 2016

Unknown | 9:01 | | | | |
El editor de blogger tiene una opción. Abres el editor y vas a Diseño, después haz click en la opción Añadir un  gadget que sale a la derecha, se abre una ventana con difererentes opciones para elegir. Haz click en la que pone HTML/Javascript.

Se abre una ventana nueva con dos cajas. Una para poner el título y otra para el contenido, en el título puedes poner Buscar en este blog, y en el espacio para el contenido pega este código de abajo:




<table width="100%" border="0" cellspacing="5" cellpadding="14">
<tr>
 <td bgcolor="#FFBF00">
 <form action='/search' id='searchthis' method='get' style='display:inline;'>
    <input id='search-box' name='q' type='text'/> 
    <input id='search-btn' type='submit' value='Buscar'/>

</form>
</td>
</tr>
</table>


Lo que he puesto resaltado en naranja es el color de fondo de la celda que lo contiene y puedes ponerle el color que más te guste o que mejor se adapte a tu diseño (en esta web puedes generar colores hexadecimales fácilmente, importante, fíjate que los colores hexadecimales van siempre con # delante)
Para terminar haz click en guardar y listo. Si quieres cambiar el buscador de lugar sólo tienes que pinchar y arrastrarlo para cambiarlo de orden.


También puedes poner una imagen como fondo de la celda el código es el siguiente:


<table width="100%" border="0" cellspacing="5" cellpadding="14">
  <tr>
    <td  background="url de la imagen de fondo" >
 <form action='/search' id='searchthis' method='get' style='display:inline;'>
    <input id='search-box' name='q' type='text'/> 
    <input id='search-btn' type='submit' value='Buscar'/>

</form>
</td>
  </tr>
</table>


Donde dice url de la imagen de fondo tienes que poner la dirección de la imagen que quieres usar de fondo y que previamente tienes que haber subido al blog o a un servidor, a dropbox... la imagen tiene que estar subida a internet para poder usarla.



Ejemplo de cómo quedaría el buscador con una imagen de fondo
Share this article

0 comentarios:

Publicar un comentario

 
Copyright © 2015 Creando Un Blog Creativo • All Rights Reserved.
Template Design by BTDesigner • Powered by Blogger