Twitter Delicious Facebook Digg Stumbleupon Favorites More

Campo de Busca com Texto Autolimpante

Uma caixa de pesquisa é realmente indispensável em qualquer blog. Acredito que 95% dos blogs usam caixa de busca.

Nesta postagem vou colocar o link de uma caixa de busca com texto auto limpamte - a mesma que usamos aqui no Dicas Plugins - que encontrei no Usuário Compulsivo.

O texto que aparece dentro da caixa de texto do campo de busca chama-se dica de tela, é útil para indicar a usuários leigos o local de pesquisa no blog.

Você tem duas opções:

1 - Instalar através do link abaixo:

Box com Dica Autolimpante

2 - Ou adicionar o seguinte código:

<script type="text/javascript">
function clickclear(thisfield, defaulttext) {
if (thisfield.value == defaulttext) {
thisfield.value = "";
}
}
function clickrecall(thisfield, defaulttext) {
if (thisfield.value == "") {
thisfield.value = defaulttext;
}
}
</script>
<center><form id="searchthis" action="/search" style="margin:0;padding:0;display:inline;" method="get"><input onclick="clickclear(this, 'Pesquisar neste blog')" value="Pesquisar neste blog" type="text" id="search-box" onblur="clickrecall(this,'Pesquisar neste blog')" style="color: #999;" size="20" name="q"/> <input id="search-btn" value="Buscar" type="submit"/></form>
<br/></center>

  • Para os que não sabem, se quiser alterar a largura da caixa de texto, altere o valor em size="20" por um valor maior ou menor dependendo da sua necessidade.
  • Para alterar o valor Buscar para, por exemplo, Pesquisar ou Procurar, altere o texto em value="Buscar" para o txto desejado.

9 comentários:

Henrique Silva disse...

Excelente tópico.
Eu tinha visto este tipo de campo de busca em um blog ha uma semana mas não encontrei o código pra usar. Passei por aqui e, de cara, me deparo com essa postagem.

Obrigado

Adelson (TD Séries) disse...

Olá, Willian!

Vim agradecê-lo pelo post, bem interessante. Eu estava procurando uma caixa de pesquisa para meu blog, o TD Séries, e me deparei com este artigo, que me mostrou exatamente o que eu queria.

Um abraço e obrigado.

Anônimo disse...

brigadao aew , tava procurando essa caixinha de pesquisa no google aew achei seu site to procurando nele e achei essa excelente me ajudo muito flws abraço :D

ॐ Tiago ॐ disse...

Muito obrigado post realmente muito util, mas tenho uma duvida.É possivel alterar a cor de fundo do campo de busca?

Anônimo disse...

Obrigada, funcionou com perfeição.

C.P disse...

Máh,Tu é o Cara.Meu blog Ta com a busca perfeita

torrentpopcorn.blogspot.com

é download de filmes torrent

Anônimo disse...

Muito obrigado!
Após diversas tentativas frustradas... finalmente encontrei aqui, no seu site, o modelo de caixa de pesquisa que eu queira.
ELEGANTE, SIMPLES e EFICIENTE!
Obrigado! Obrigado! e mais uma vez, OBRIGADO!

R@fa. :)

Anônimo disse...

onde coloco o link do meu site pra ele pesquisar no meu site??
eu coloquei no meu site só que ñ pesqquisa

Empresa disse...

vc6 são demais. Obrigado muito há quase 3 horas diretas procuro uma solução, essa caiu na mosca.

Tairan França

buscariolargo.blogspot.com

Postar um comentário

Envie um comentário!

 
Design by Free WordPress Themes | Bloggerized by Lasantha - Premium Blogger Themes | Blogger Templates