Poner un buscador en el blog

                               

Cuando tienes bastantes entradas en el blog siempre va a ser un poco complicado dar con la entrada que nos interesa, o muchas veces no recordamos cómo iba la entrada específica, por lo que resulta de mucha utilidad para nuestro visitante tener un buscador dentro del blog donde pueda buscar el post que le interesa utilizando palabras que se asocien a dicha entrada en cuestión. Aunque existe un buscadorde Google que viene ya insertado en las plantillas de Blogger, éste tiene como punto bajo el hecho que te muestra entradas que solamente están indexadas a Google, o demora demasiado en indexarlas, por lo que muchas entradas de tu blog podrían “quedarse fuera” con este buscador. Aquí te dejo un buscador que puedes agregar en el sidebar de tu blog y que, además, puedes personalizar a tu gusto. Para ponerlo entra en Diseño, Añadir Gadget, Html Javascript y lo colocas donde mejor prefieras. Este es el código:

<div id='nav-right'>

      <form action='/search' id='searchbarform' method='get'>

        <div id='search'>

          <input id='s' name='q' size='35' onblur='clearText(this)' onfocus='clearText(this)' type='text' value='Enter search keyword'/> <input class='btn' name='' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg7p0p8GUOXTc5LDPzudpgP8HF52O5UE03E5bLw0aUszUtICJFpx8B0k70B_XTR_t9gH0Mc9i3vlw7aQ1YRKFUGtt5sCRwrG1iDxiUJrxHGJjFVgwjb9y9RKj2XqOa6s5pnsYIV90Y4zNI/s1600/search_button.png' type='image' value=''/>

        </div><!--/search -->

      </form>

    </div><!--/nav-right -->         

     <!--end #search -->

Las partes que están con color son las que puedes personalizar, puedes cambiar las palabras que se muestran dentro del buscador 'Enter search keyword', por las que prefieras; ajustar el tamaño del buscador donde dice Size='35' hasta que se ajuste al ancho de tu sidebar. Si no te gusta la imagen del ícono del buscador, aquí te dejo otros para que puedas cambiarlo, o puedes poner una imagen que tu prefieras, cambiando lo que está en celeste, teniendo en cuenta que no deberá ser mayor a 30x30px la imagen cuadrada, y 110x40px la imagen horizontal. Aquí el código de las imágenes:

https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhsQWmUKcw2tiPJZCuWLDL2voJw4RUO-eIdcVvm24LVydnyCC1b-vSEoKPiZ12Fn80bYVBzVqSX0U_tcmLK8IhkBLHFxNM9GkkyMQYKDLSej9MY5K6_Dy4toMj_54ZIF6JbZX-whQMZQTE/s30/search-icon-byb.png

https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiLZxZqu8lanZv5UWpWNElitLrbbPYNboFS6Mz5u3KX6bEfa1B6HBKWIUG-inbhT9AIIXcMYB4_5hzKPUs5HX19T1YL1PL1Rky0Z6BbJpmI3MrPnhEq9UyOourhrxpfJREH7PObjfMu2BI/s30/SearchIcon-40px-byb.png

https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjPvDd-uxi80SSqkaU7aH6F_BxtLVhmEn3dBhceaRQxuo4tXyWs4xsj4JSqxH3I88AApnqfSu_FZwF3BaqEWtMtaSpqFMbdU9U9PC2ZgekRPaTYtK6ODaa4hhfaoYyLQdEOZBieoGNNzpE/s30/icono-search-byb.jpg

https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg4KFCMSn5-8e7C0XM69w0AUkIwQFjStGf_my9OEaBGRieH_-WHEmcfUbs1aZSe5LRvvLBXYs4740g4355U9xgvZVYQs4pSUB2a0BMcWtW-oEvHUWhueY0HXUAGuVqvT3Kj1ONq-7Lg2JQ/s110/boton-search-byb2.jpg

https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiPAn-l9zFSOzKbQrgOkxp9xPpcjJ3qNNpdBpGX9FjpWbQW79WcDaYhHQSNBs56z5swzhgWczbWXlO4q96ZE0WwT1TECfcsDs8W3BEcun-vIoEFznZ7ykbO08etsqg6-kIq_6RM6JaIW5s/s110/boton-search-byb.jpg1.jpg

https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiEaGR-K_8gvehTgMMfMIlr7ov-r2z1KLBFM7gdfzym_w-P6qR-fPFylgDgz7CtOI8HoV6109hytpBafAk-zOA1Q7v581MoUqHTzuvgTr3lE_A3eVumtdu4u9DPDh60VK6OSAeDp23m9Bw/s110/boton-search-byb.jpg