3 de mar. de 2013

4

Caixa de Pesquisa Personalizada

Heey princess
Tumblr_ly2qh67gso1qhi766o1_500_large
((amo esse filme))
Hoje eu vou ensinar um tutorial suuuper útil, de como fazer a caixa de pesquisa como esta que temos aqui no blog,preview 

1.Vá em Design>>Layout>>Adicionar um Gadget>>HTML JavaScript
Cole o seguinte:
<form action="/search" class="search" method="get">
<input class="searchbar" id="s" name="q" placeholder='Escreva o que procura' type="text" value="" />
<input class="searchbut" type="submit" value="" />
</form>
2.Vá em Editar HTML e procure por :]]></b:skin>
3.Acima da Tag cole:
/*caixa de perquisa*/
search{
float: left; /* Lado da Barrinha - Right (Direita) e Left (Esquerda) */
font-family: Tahoma; /* Fonte */
}
.searchbar{
height: 20px;/*altura da caixa*/
width: 200px;/*largura da caixa*/
color: #FF82AB; /* Cor da fonte */
-moz-border-radius: 6px;-webkit-border-radius: 6px;-goog-ms-border-radius: 6px;background: #fdd5ed; /* Cor de fundo da parte onde escrevemos */
}
.searchbut{
background: url('http://i.imgur.com/2fgCBuq.png'); /* Link da imagem do botão de pesquisar*/
width:28px;
height:30px;
border: 0;
padding:7px;
}
/*caixa de pesquisa*/
Visualize e salve!!
Eu fiz umas imagens para vocês colocarem no botão:



Kissi

4 comentários:

Blood good disse... Best Blogger TipsAnswerBest Blogger Templates

aaa vou salvar esse tuto aqui, no proximo lay vou usar
acervo-de-livros.blogspot.com

Amanda e Rafaella! disse... Best Blogger TipsAnswerBest Blogger Templates

Bem legal, ficou super lindo :3
Amei.

Beijos
www.Be--Different.blogspot.com
(estou seguindo*)

Bia Costa disse... Best Blogger TipsAnswerBest Blogger Templates

Que bom que gostaram!!
Beijos amadas
Kissi

Unknown disse... Best Blogger TipsAnswerBest Blogger Templates

Meu Deus, não use o josh hutcherson, isso acaba com o meu emocional!