Colocando Caixa De Busca Personalizada

Postador Edu-San

Caixa de busca é algo fundamental para um blog,Agora As Maiores Das Caixas De Busca não são muito "bonita".Então que tal uma caixinha de busca personalizada?Vamos aprende agora 

-Em primeiro lugar vá em modelo>editar html 

E procure por 

 ]]></b:skin> 
Quando encontra Cole Acima Dele Esse Código abaixo

div.search-form { right: 0px; top: -71px; display: block; width: 282px; height: 45px; background: url(https://lh3.googleusercontent.com/-nPJQAv57wOw/T5TKdK3q5HI/AAAAAAAAA4U/pCfSM3sLXsY/s0/pesquisa.png) top right no-repeat; } div.search-form .search-sliding { position: relative; top: 11px; left: 14px; border: none; background: none; width: 220px; font-style: italic; color: #999; height: 27px; } div.search-form .search-label-sliding { position:absolute; top:34px; left:-4000px; } div.search-form .search-button { position: absolute; left: 263px; top: 10 px; background: url(https://lh3.googleusercontent.com/-nPJQAv57wOw/T5TKdK3q5HI/AAAAAAAAA4U/pCfSM3sLXsY/s0/pesquisa.png) top left; width: 55px; height: 45px; } div.search-form .search-button:hover { background-position:-55px 0;transition: all 0.4s ease;-webkit-transition: all 0.3s ease;-moz-transition: all 0.4s ease;-o-transition: all 0.3s ease;transition: all 0.4s ease; } div.search-form .search-button:active { background-position:-55px 0; -webkit-transition: all .8s ease;-o-transition: all 0.4s ease;-moz-transition: all 0.5s ease;transition: all 0.6s ease; -webkit-transform: scale(0.8);-moz-transform: scale(0.8);-o-transform: scale(0.8); -webkit-transition-duration: 0.2s;-moz-transition-duration: 0.2s;-o-transition-duration: 0.2s; div.search-form .search-button a { background-position:-55px 0; margin:1px 0 0 1px; }
Em seguida salve é vá em layout e adicionar gadgets é escolha  html/javascript e coloque esse código abaixo 


<form action='/search' class='search' method='get'> <div class='search-form'> <label class='search-label-sliding' for='search-sliding' style='left: 15px; opacity: 0.4;'></label> <input class='search-sliding' id='search-sliding' name='q' onblur='if (this.value == "") {this.value = "pesquisar";}' onfocus='if (this.value == "pesquisar") {this.value = ""}' title='Pesquisar post' type='text'x-webkit-speech="x-webkit-speech" value='Pesquisar'/> <input class='search-button' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj_g7VZSlyGmWMG10xjPBlGOjcfaqv7LZQYtNNatHgPEX_8tm-qb9DVcRZWcNS8PgF9G0D8Wlqpy6wuTjWMn15BKd-ekYphpCgSNa5Qiju8BrypOrI_dZyi7vj_PDxrXv0X8HUIB-63Rpps/s0/transparent.gif' type='image'/> </div> </form>

Pronto agora é só ser feliz