[Blogger] - Como colocar uma frase padrão no formulário de busca

Olá caro leitor, depois de ter ensinado como colocar um formulário de busca em HTML no Blogger, eu me deparei com um pequeno detalhe que havia me escapo completamente: eu reparei que na maioria dos sites e blogs o formulário de busca contém uma frase padrão dentro do campo de digitação, que quando clicamos para digitar o que queremos procurar, ela some e quando clicamos fora do campo de busca, ela volta a aparecer. Isso estava me tirando o sono. Foi então que fazendo uma busca rápida pelo Oráculo da Internet, descobri como fazer esse "efeito".

Ele pode ser utilizado em qualquer tipo de formulário criado com HTML, ou em qualquer formulário de busca que você tenha acesso a estrutura do mesmo. Para adicionar o efeito ao seu formulário, basta adicionar a parte que está destacada em vermelho no código abaixo dentro do código do seu formulário de busca, mais precisamente dentro da tag input (destacada em azul) do tipo texto — que é a indicação do lugar onde será digitado o texto a ser procurado.

<form name="input" action="/search" method="get">
<input type="text" name="q" placeholder="TEXTO QUE APARECERÁ NO CAMPO..."/><input type="submit" value="Pesquisar" />
</form>


Após adicionar o código à sua busca ou formulário, salve as alterações. Abaixo você pode conferir como ficará o seu formulário depois de adicionar o código. Clique dentro da área de digitação, escreva algo e note como a frase some. Em seguida, apague o que escreveu e clique em qualquer parte em branco do blog para ver a frase aparecer novamente.



Caso você queira um formulário de busca mais customizado, aconselho que veja o artigo:

Atualização — 15.06.2012 às 05h50
O código responsável por adicionar o texto dentro do campo de texto (destacado em vermelho no código acima), foi alterado para refletir o novo padrão HTML5. É importante que você utilize esse novo padrão em seu blog, embora alguns navegadores ainda não o suportem (me refiro ao Internet Explorer). É importante também que você saiba que diferente do código antigo, que "apagava" o texto padrão logo após o usuário clicar dentro do campo, esse novo código possui reações diferentes dependendo do navegador que está sendo utilizado. Em alguns navegadores a frase continua sumindo ao clicar no campo, mas em outros a frase só some após o usuário começar a digitar alguma coisa.
É terminantemente proibida a cópia de nossos artigos sem nossa expressa autorização!
Plágio é crime previsto no artigo 184 do Código Penal brasileiro e na Lei 9.610/98.
As informações contidas neste artigo estão desatualizadas? Notifique-me! Editar artigo
Igor Sousa é dono e criador do blog Hdblog (antigo Bloggando Na Web). Tem 24 anos, é paulistano e atualmente cursa o 8° Semestre em Ciências Contábeis. Blogar era apenas um modo de melhorar sua redação de texto, mas unida a sua vontade de ajudar as pessoas passou a ser um hobby.

Foi postado 1 comentário neste artigo!