Caixa de pesquisa personalizada

00:26 0 Comments A+ a-


Oooi amores <3 sentiram saudades? Eu sei que ontem não postei mas é que realmente não deu. Mas hoje eu trouxe um tuto pra voc~es, é um caixa de pesquisa super fofa :3

Preview: 
                                  
Se vocês quiserem colocar no blog de voc~es, continuem lendo.
Primeiramente vá no seu HTML e procure por ]]></b:skin> logo em seguida cole isso acima da tag:



.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;
}
Ali onde está url é o url da imagem de ok, se quiser mudar fique à vontade.
Agora adicione um gadget Html/JavaScript e cole o seguinte:
<form action="/search" class="search" method="get">
<input class="searchbar" id="s" name="q" type="text" value="" />
<input class="searchbut" type="submit" value="" />
</form>

Bom, está feito! Qualquer coisa comentem! Fiquem com Deus, beijos <3

Sou Nathalia Nates, adolescente, confusa, que não sabe o que quer da vida, e por isso tenta de tudo(desistindo na maioria das vezes por ter medos e inseguranças).

Nasci em uma pequena cidade do norte do paraná, onde moro até hoje, com meus pais e meus dois cachorros.