segunda-feira, 12 de julho de 2010

Cute caixa de busca

Uma caixa de busca facilita o visitante a buscar o que procura de forma fácil e direta sem ficar clicando em cada categoria para ver se encontra alguma coisa - seus leitores agradecem - olha que fofa essa caixa de busca:
para inseri-la é muito fácil veja abaixo o tutorial>>

Cole o código abaixo ACIMA de




.search{
float: left; /* Flutuando a esquerda, poderá também mudar para Right (Direita) e Left (Esquerda) */
font-family: Tahoma, Tahoma; /* Fonte */
}
.searchbar{
height: 20px;
width: 140px;
color: #FF82AB; /* Cor da fonte */
-moz-border-radius: 6px;-webkit-border-radius: 6px;-goog-ms-border-radius: 6px;background: #FFF; /* Cor de fundo da parte onde escrevemos */
}
.searchbut{
background: url('http://i39.tinypic.com/25ezh8z.png'); /* Link da imagem do botão de pesquisar*/
width:30px;
height:30px;
border: 0;
padding:7px;
}



Agora vá em Design > Elementos da página > Adicionar Gadget > Adicione um gadget de HTML/Javascript. Cole nele:
                                                 
Espero que gostem beijinhooos *--*

19 comentários :

  1. Nossa amei esse post muito legal , e me ajudou bastante , :D amei seu blog
    você um anjo flor , sério graças aos seus tutoriais eu consegui melhora um pouco a aparência do meu blog , beijokas :)

    http://lorhannyschneeider.blogspot.com.br/

    ResponderExcluir
  2. Minha caxinha de busca \õ/ guria seus tutus estão sendo muito uteis para min viu :D

    ResponderExcluir
  3. Muito Lindo !!!

    http://codysimpsonfcs.blogspot.com.br/

    ResponderExcluir
  4. Não tem outros estilos de caixinhas de busca?Beijos ta tudo lindo ;3 :l:

    ResponderExcluir
  5. valeu me ajudoou muito estava tentando achar uma caixa de busca muito fofa assim
    visitem meusblogs:http://nosuniversofeminino.blogspot.com.br/search?q=

    http://larimodafeminina.blogspot.com/

    ResponderExcluir
  6. Simplesmente não consigo personalizar a caixa de busca nem os comentários... já tentei de tudo quanto é código e nada! :(
    http://vanille-vie.blogspot.com.br/

    ResponderExcluir
  7. Eu já tentei mas não conseguir personalizar colocar a caixinha eu coloquei mais eu não consegui colocar, Jackie me ajuda pfvr?

    ResponderExcluir
    Respostas
    1. Descupe não entendi a parte que vc colocou e não conseguiu colocar (?) '-'

      Excluir
  8. Ai Jackie .Acompanho seu blog a poouco tempo ! Mas acho ele lindo ! e todos o tutooos e dicas dão super certo e ficam muitooooo fooofooos obrigada

    ResponderExcluir
    Respostas
    1. Brigada guria, pelo carinho!

      Volte sempre *--*

      Excluir
  9. Gente visitem meu blog vagas para afiliados e para a equipe.
    http://www.planet-imagine.blogspot.com.br/

    ResponderExcluir
  10. Sério,sinceramente,você está me ajudando mto eu nem tenho palavras pq eu quero dar uma melhorada no meu blog e seus tutoriais me ajudam!
    MUITO OBRIGADA DE VERDADE!

    ResponderExcluir
  11. Jackie eu consegui colocar tudo direitinho , mas como faço pra ajustar a barra na parte de cima ? :/ . qual o html que coloco pra ajustar a barra +ou- igual a sua ? . Obrigado pelas dicas <3

    ResponderExcluir
    Respostas
    1. aqui guri >> http://isjackiezzdream.blogspot.com.br/2013/01/caixa-de-pesquisa-personalizada-estilo.html

      Excluir
  12. Adorei, ajudou muito. Aliás, não só esse como outros tutoriais daqui, seu blog é demais <3
    Muito fofo! *--*

    ResponderExcluir

.