Caixa de Pesquisa.
Entre na pagina designer >> adicionar gadget >> html/javascript e coloque o código acima.
Agora vamos mostrar como personalizar sua pesquisa no começo do código tem a formatação (cores, imagens de fundo, posicionamento) tudo isso feito em CSS, então vamos por partes. Neste primeiro trecho temos a imagem de fundo da pesquisa
#barra-busca {
width: 500px;
height: 40px;
background-image: url(pesquisa-fundo.jpg);
Para usar outra imagem você precisa trocar o endereço da imagem(pesquisa-fundo.jpg) e alterar os valores width: 500px; e height: 40px; para o tamanho da imagem que está usando as dimensões da nova imagem.
Nesta parte é a formatação do campo de texto para digitar o que procuramos no site.
#form-busca #sprocura{
height: 20px;
width: 400px;
margin-top: 8px;
margin-left: 8px;
color: #0000CC;
border: 1px solid #000000;
float: left;
padding: 2px;
background-color: #FFFF99;
}
Aqui podemos fazer qualquer tipo de formação: escolher as cores de fundo, trocar as bordas, formatar o texto, veja nestes links que acabamos de mostrar como fazer cada uma destas coisas
botão de pesquisaAqui temos o botão usado na pesquisa.
#form-busca #bt-busca {
height: 33px;
width: 37px;
background-image: url(pesquisa-botao.jpg);
Da mesma maneira que falamos para a imagem de fundo da pesquisa é para trocar a imagem do botão, hospede uma imagem, coloque o endereço dela no lugar onde está pesquisa-botao.jpg e depois altere os valores 33px e 37 px com a largura e altura da imagem que está usando agora.
Ass: Hugo Keyserling.
