eaew galéra hj venho trazer uma ótima opção para vcs q querem colocar caixa de pesquisa no blog de vcs, esse tutorial encina-rá colocar uma caixa de pesquisa em seu site/blog são 5 cores diferentes, a melhor opção delas é q tbm vem com reconhecimento de voz, o seu site ficará bem profissa.

Clicke no post para ler o artigo por inteiro.

Obs: Não esquçam de comentar, sua mão não irá cair, sei q as veses pode ser chato mais vcs não sabem a diferença q faz cada comentário, além de nos animar a postar mais coisas nos ficamos gratos e as vezes ainda damos um bonus para vcs, então comentem ae pf, vlw.



 1º- Faça o login no blogger.

2º- Acesse a guia “Designer” –> “Elementos da página” –> “Adicionar um gadget” e clique na opção “HTML/Javascript”.

3º- Agora cole um dos códigos abaixo conforme seu gosto. Depois salve.
Modelo 1:
<br /> <br /> <style> .botprocura1 { background: url(http://dl.dropbox.com/u/47734544/Buscadores/buscadores-com-reconhecimente-de-voz.png); border: none; height: 35px; background-position-x: -181px; width: 45px; cursor: pointer; float: right; } .botprocura1:hover { background: url(http://dl.dropbox.com/u/47734544/Buscadores/buscadores-com-reconhecimente-de-voz.png); background-position-x: -413px; } .caixadetexto1 { background: url(http://dl.dropbox.com/u/47734544/Buscadores/buscadores-com-reconhecimente-de-voz.png); border: none; height: 34px; width: 160px; padding-right: 9px; padding-left: 10px; } .acaixaproc1 { width: 227px; } </style><br /> <br /> <form method="get" class="acaixaproc1" action="/search"><input type="text" class="caixadetexto1" name="q" size="30" x-webkit-speech/><br /> <input type="submit" class="botprocura1" value=""/></form><br />

Modelo 2:
<br /> <br /> <style> .botprocura2 { background: url(http://dl.dropbox.com/u/47734544/Buscadores/buscadores-com-reconhecimente-de-voz.png); border: none; height: 35px; background-position-x: -181px; background-position-y: -35px; width: 45px; cursor: pointer; float: right; } .botprocura2:hover { background: url(http://dl.dropbox.com/u/47734544/Buscadores/buscadores-com-reconhecimente-de-voz.png); background-position-x: -413px; background-position-y: -35px; } .caixadetexto2 { background: url(http://dl.dropbox.com/u/47734544/Buscadores/buscadores-com-reconhecimente-de-voz.png); border: none; height: 34px; width: 160px; padding-right: 9px; padding-left: 10px; } .acaixaproc2 { width: 227px; } </style><br /> <br /> <form method="get" class="acaixaproc2" action="/search"><input type="text" class="caixadetexto2" name="q" size="30" x-webkit-speech/><br /> <input type="submit" class="botprocura2" value=""/></form><br />

Modelo 3:
<br /> <br /> <style> .botprocura3 { background: url(http://dl.dropbox.com/u/47734544/Buscadores/buscadores-com-reconhecimente-de-voz.png); border: none; height: 35px; background-position-x: -181px; background-position-y: -70px; width: 45px; cursor: pointer; float: right; } .botprocura3:hover { background: url(http://dl.dropbox.com/u/47734544/Buscadores/buscadores-com-reconhecimente-de-voz.png); background-position-x: -413px; background-position-y: -70px; } .caixadetexto3 { background: url(http://dl.dropbox.com/u/47734544/Buscadores/buscadores-com-reconhecimente-de-voz.png); border: none; height: 34px; width: 160px; padding-right: 9px; padding-left: 10px; } .acaixaproc3 { width: 227px; } </style><br /> <br /> <form method="get" class="acaixaproc3" action="/search"><input type="text" class="caixadetexto3" name="q" size="30" x-webkit-speech/><br /> <input type="submit" class="botprocura3" value=""/></form><br />

Modelo 4:
<br /> <br /> <style> .botprocura4 { background: url(http://dl.dropbox.com/u/47734544/Buscadores/buscadores-com-reconhecimente-de-voz.png); border: none; height: 35px; background-position-x: -181px; background-position-y: -105px; width: 45px; cursor: pointer; float: right; } .botprocura4:hover { background: url(http://dl.dropbox.com/u/47734544/Buscadores/buscadores-com-reconhecimente-de-voz.png); background-position-x: -413px; background-position-y: -105px; } .caixadetexto4 { background: url(http://dl.dropbox.com/u/47734544/Buscadores/buscadores-com-reconhecimente-de-voz.png); border: none; height: 34px; width: 160px; padding-right: 9px; padding-left: 10px; } .acaixaproc4 { width: 227px; } </style><br /> <br /> <form method="get" class="acaixaproc4" action="/search"><input type="text" class="caixadetexto4" name="q" size="30" x-webkit-speech/><br /> <input type="submit" class="botprocura4" value=""/></form><br />

Modelo 5:
<br /> <br /> <style> .botprocura5 { background: url(http://dl.dropbox.com/u/47734544/Buscadores/buscadores-com-reconhecimente-de-voz.png); border: none; height: 35px; background-position-x: -181px; background-position-y: -140px; width: 45px; cursor: pointer; float: right; } .botprocura5:hover { background: url(http://dl.dropbox.com/u/47734544/Buscadores/buscadores-com-reconhecimente-de-voz.png); background-position-x: -413px; background-position-y: -140px; } .caixadetexto5 { background: url(http://dl.dropbox.com/u/47734544/Buscadores/buscadores-com-reconhecimente-de-voz.png); border: none; height: 34px; width: 160px; padding-right: 9px; padding-left: 10px; } .acaixaproc5 { width: 227px; } </style><br /> <br /> <form method="get" class="acaixaproc5" action="/search"><input type="text" class="caixadetexto5" name="q" size="30" x-webkit-speech/><br /> <input type="submit" class="botprocura5" value=""/></form><br />

Pronto ta ae, espero que gostem.