Pesquisa personalizada

que boquinha perfect!

Helo, magics! Eaí gente beleza? Hoje eu trago um tutorial super bacana. Como colocar caixa de busca no blog, super fácil da pra entender tranquilex! Se quer saber como colocar continue lendo!

Primeiro vou falar uma coisa: existem dois modos de se fazer, um pelo próprio gadget e outro pelo código html.

1° MODO

pelo próprio gadget

Vá no modelo, editar html e de ctrl+f e procure a tag ]]></b:skin> e cole e acima dela:

/*Para remover o logo do google*/ .gsc-branding-text, .gsc-branding-img-noclear {display:none;} /* Personalização do Campo de texto */ td.gsc-input input {border: 2px solid #e7e7e7; background:#fff; color:#ff0048; font-family:verdana; font-size:11px; } /* Fim da personalização do Campo de texto */ /*personalização do botão*/ input.gsc-search-button {font-family:'trebuchet ms'; font-size:14px; color:#fff; background:#ff0048; border:0px; font-weight:normal; -moz-border-radius: 20px; -webkit-border-radius: 20px; border-radius: 20px; } input.gsc-search-button:hover {background:#b779db; color:#fff;} /*fundo e cor do texto quando passa o mouse*/ /*fim da personalização do botão*/

O que está em rosa deixa a borda da caixa arredondada, se não quiser é só excluir essa parte.

2° MODO

pelo método html

Cole esse código asseguir, no html/java script:

<form action="/search" class="search" method="get"> <input class="searchbar" id="s" name="q" placeholder='Digite o que procura' type="text" value="" /> <input class="searchbut" type="submit" value="" /> </form>

No que está em rosa novamente, você pode trocar e colocar o que quer que fique escrito dentro da caixa de pesquisa.

Depois vá em modelo de ctrl+f e procure a tag ]]></b:skin> e cole o código acima dela:

.search{ float: left; font-family: Century Gothic !important; /* Fonte do campo de texto*/ } .searchbar{ height: 20px; /*Altura da caixa*/ width: 190px; /*largura da caixa*/ border-radius:15px; background:#fff; text-align:center; color:#ff048c !important; /*cor do texto*/ font: 12px Century Gothic !important; /*fonte do texto*/ } .searchbut{ background: url('Url da imagem do botão'); width:30px; /*Largura do botão*/ height:30px; /*altura do botão*/ border: 0; padding:7px; }

Agora é só mudar o que se pede! É isso tchau tchau.