{"id":247,"date":"2014-05-21T08:21:00","date_gmt":"2014-05-21T08:21:00","guid":{"rendered":"https:\/\/www.euroresidentes.com\/tecnologia\/trucos-diseno-web\/como-poner-un-buscador-en-mi-blog"},"modified":"2016-03-02T08:25:01","modified_gmt":"2016-03-02T08:25:01","slug":"como-poner-un-buscador-en-mi-blog","status":"publish","type":"post","link":"https:\/\/www.euroresidentes.com\/tecnologia\/trucos-diseno-web\/como-poner-un-buscador-en-mi-blog\/","title":{"rendered":"C\u00f3mo poner un buscador en mi blog"},"content":{"rendered":"

\nC\u00f3mo poner un buscador en blogger y personalizarlo.<\/h3>\n
\n<\/div>\n
\nPoner un buscador en tu blog puede ser muy \u00fatil sobre  todo para facilitar a la gente que te visita que encuentren lo que est\u00e1n buscando de un forma sencilla y r\u00e1pida.<\/p>\n
\n<\/a><\/div>\n

El editor de blogger tiene una opci\u00f3n. Abres el editor y vas a Dise\u00f1o<\/b>, despu\u00e9s haz click en la opci\u00f3n A\u00f1adir un  gadget que sale a la derecha, se abre una ventana con difererentes opciones para elegir. Haz click en la que pone HTML\/Javascript.<\/b><\/p>\n

Se abre una ventana nueva con dos cajas. Una para poner el t\u00edtulo y otra para el contenido, en el t\u00edtulo puedes poner Buscar en este blog, y en el espacio para el contenido pega este c\u00f3digo de abajo:<\/p>\n

\n
\n

<table width=\u00bb100%\u00bb border=\u00bb0″ cellspacing=\u00bb5″ cellpadding=\u00bb14″><\/i><\/div>\n

\n<tr><\/i><\/div>\n
\n <td bgcolor=\u00bb<\/i>#FFBF00<\/i>\u00ab><\/i><\/p>\n
\n <form action=’\/search’ id=’searchthis’ method=’get’ style=’display:inline;’><\/div>\n
\n    <input id=’search-box’ name=’q’ type=’text’\/> <\/div>\n
\n    <input id=’search-btn’ type=’submit’ value=’Buscar’\/><\/div>\n

\n<\/form>
\n<\/td><\/i><\/div>\n

\n<\/tr><\/i><\/div>\n
\n<\/table><\/i><\/div>\n<\/div>\n<\/div>\n
\n<\/div>\n
\n

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\u00e1s te guste o que mejor se adapte a tu dise\u00f1o (en esta web<\/a> puedes generar colores hexadecimales f\u00e1cilmente, importante, f\u00edjate que los colores hexadecimales van siempre con # delante)<\/div>\n

\n<\/div>\n
\nPara terminar haz click en guardar y listo. Si quieres cambiar el buscador de lugar s\u00f3lo tienes que pinchar y arrastrarlo para cambiarlo de orden.<\/div>\n
\n

Tambi\u00e9n puedes poner una imagen como fondo<\/b> de la celda el c\u00f3digo es el siguiente:<\/p>\n

<\/p>\n

\n<table width=\u00bb100%\u00bb border=\u00bb0″ cellspacing=\u00bb5″ cellpadding=\u00bb14″><\/div>\n
\n  <tr><\/div>\n
\n    <td  background=\u00bburl de la imagen de fondo\u00bb ><\/div>\n
\n
\n <form action=’\/search’ id=’searchthis’ method=’get’ style=’display:inline;’><\/div>\n
\n    <input id=’search-box’ name=’q’ type=’text’\/> <\/div>\n
\n    <input id=’search-btn’ type=’submit’ value=’Buscar’\/><\/div>\n

<\/p>\n

\n<\/form><\/div>\n<\/div>\n
\n<\/td><\/div>\n
\n  <\/tr><\/div>\n
\n<\/table><\/p>\n

<\/div>\n

\nDonde dice url de la imagen de fondo<\/i> tienes que poner la direcci\u00f3n 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.<\/p>\n

<\/p>\n

\n
\nEjemplo de c\u00f3mo quedar\u00eda el buscador con una imagen de fondo<\/div>\n
\n<\/a><\/div>\n
\n<\/div>\n
\n<\/div>\n
\n<\/div>\n

\nEn el video tutorial pod\u00e9is ver el paso a paso:<\/h3>\n
\n
\n<\/div>\n<\/div>\n
\n
\n