Para melhorar ainda mais o visual do seu blog,nada melhor do que uma barra de pesquisa personalizada não é ? Esse tutorial eu peguei da net e fui personalizando conforme meu template,o código esta bem explicado e fácil de compreender.Lembrando : Você poderá usar esse código direto no seu HTML ( como eu fiz ) ou usando uma gadget nos "Elementos da pagina" com a tradicional "HTML/JavaScript".

A minha barrinha,essa ai que esta no cabeçalho é essa aqui :

Mas usando a paleta de cores, e a criatividade você pode personalizar do jeito que quiser.Vamos aos passos.

Passo a Passo :


01. Faça login na sua conta blogger 
02.Clique na aba "Design" > em seguida clique em "editar HTML"
03.Procure por ]]></b:skin> (utilize CTRL + F)
04: Acima desse código copie e cole o seguinte código:

 

#searchbox {
border: 0 none;
-moz-background-inline-policy: continuous;
background: url("url fundo da barra") no-repeat scroll 0 0 transparent;
display: block;
float: right; /* ---Localizada para direita ---*/
height: 60px; /* ---Altura da barra ---*/
margin-right: 80px; /* ---Margem a direita ---*/
margin-top: 70px; /* ---Margem do topo ---*/
padding-left: 40px; }




#searchbox .textfield {
border: 0 none;
-moz-background-inline-policy: continuous;
background: #000;
font-family: "Comic Sans MS"; /* ---fonte do texto ---*/
color: #FFF; /* ---cor do texto ---*/
border: 0 none;
float: left;
height: 25px;
margin: 0px 0 0 -23px;
width: 143px; }




#searchbox .button {
background: url("URL DO BOTÃO") no-repeat;
border: 0 none;
cursor: pointer;
float: left;
height: 28px; /* ---altura do botao ---*/
margin-left: -1px; 
margin-top: 0px;
width: 30px; }

05. Após ter feito isso,vá alterando o código a seu gosto. 
06. Feito isso,visualize > se gostar SALVE !

          Autora:

@Nmesquita

Clic e Comente