Como inserir gadget de busca do Google em sites do blogger

Vou mostrar como colocar um gadget caixa de busca em blogs e sites que usam o sistema Blogger.com para gerenciar e postar, e, no final deste post, darei umas dicas para personalização, mas, isso será a parte e só para pessoas que entendem Css, ou, 'destemidas'.

Atualização 2014
Este gadget do blogger andou apresentando problemas, pode não funcionar mais, recomendo que use e crie um formulário de busca do Google Adsense

Tanto um blog como site deveria ter um modo de fazer uma busca interna(que exiba resultados do site ou blog), se você olhar a maioria de grandes e bons sites tem uma ferramenta de busca, geralmente no canto direito superior.

Esse gadget para blogs do blogger tem a vantagem de ser fácil de instalar e a pessoa não sair da página ao fazer a pesquisa, não dá para exibir anúncios nos resultados, pois, se você quiser o fazer você adiciona no próprio blog.

Adicionar caixa de pesquisa do Google em blogs do Blogger

1. Acesse o blogger.com
2. Se estiver na página inicial do blogger, clique na seta de menu que fica ao lado do nome de seu blog
3. Abrirá o menu, talvez apareça uma barra de rolagem, se ocorrer, role ela para encontrar a opção Layout
4. Clique em Layout

   Se você estiver em outra área do blogger(correspondente a seu blog), aí a opção Layout poderá estar no menu lateral esquerdo do blogger(observe imagem abaixo)

5. Na página que abrir escolha o local onde quer o gadget e clique no link Adicionar um Gadget

6. Na página que abrir, que provavelmente você estará em Noções básicas, se não clique nela
7. Atenção, talvez você possa ignorar esse passo, algumas vezes o gadget não está na primeira página, se acontecer, aí clique no link que diz próximo >> que mostrará a próxima página com mais gadgets, esse link muda para "anterior" para voltar aos gadgets vistos antes.
8. Encontre e clique em Caixa de pesquisa

9. Abrirá uma página para configurar caixa de pesquisa e você pode digitar um título para o gadget ou apagar ele e deixar sem título
10. Deixe marcado a opção Este blog e escolha se quer marcar as outras opções, como Link daqui que são sites e blogs para os quais você criou link e A web que é busca na internet
11. Estando pronto precisa clicar em Salvar

Personalizar gadget de busca do blogger?

O gadget já terá a personalização parecido com seu modelo, mas você pode personalizar um pouco o gadget de pesquisa, mas precisa entender Css e saber onde adiciona Css no blogger, clique aqui
Entre chaves vão os estilos, de cada área e antes dos caracteres abre-chaves está o nome da área, por exemplo, .gsc-search-button é o botão, observe o código incompleto abaixo:.gsc-results-wrapper-visible{//estilo de toda área de resultado}
input.gsc-input{//estilo de campo para escrever}
.gsc-search-button{//estilo de Botão}
Abaixo vou mostrar um estilo pronto, o botão eu optei apenas por deixar a fonte em negrito, e toda a área com uma borda vermelha e o campo para escrever a busca com cor de fundo cor de laranja e borda azul com efeito de profundidade(inset), veja o código de exemplo:.gsc-results-wrapper-visible{border:solid 2px red !important;}
input.gsc-input{border:inset 1px blue !important; background:orange !important;}
.gsc-search-button,input.gsc-search-button{font-weight:600 !important;}
Abaixo são outras áreas, o que está entre-chaves deve ser removido e substituído por estilos Css:.gsc-results-wrapper-visible{//estilo do quadro de resultados}
.gsc-cursor-page{//estilo número da paginação de resultado}
.gsc-cursor-current-page{//estilo número da página de resultado}
a.gs-visibleUrl,.gs-visibleUrl{//estilo da Url}
a.gs-title{//estilo do link de título de cada resultado}
.gs-snippet{//estilo do resumo de cada resultado}
.gsc-tabHeader{//estilo das opções, 'este blog, link daqui, A web'}
.gsc-tabhInactive{//estilo da opção ativa}
Quem quiser um determinado estilo para o gadget de busca que mostrei acima, se for algo simples, pode perguntar nos comentários abaixo, já que não tem como eu explicar aqui de maneira que agrade gregos e romanos.

• Colocar o blog em sites de buscas?
• Formulário de busca do Google, resultado em outra página