Caixa de pesquisa Personalizada .

Olá cupcakes !

Vou ensinar a vocês como personalizar a caixa de pesquisa , O tutorial é bem simples é muito fácil , Espero que o meu tutorial ajude a vocês , Vamos ao tutorial ...


Vá em seu HTML, dê um CTRL + F  e procure por:

]]></b:skin>

Acima da tag, cole o seguinte código:

.search{float: left;font-family: arial !important; /* Fonte do campo de texto*/}.searchbar{height: 20px; /*Altura da caixa*/width: 120px; /*largura da caixa*/text-align:center;color:#000000; /* cor da fonte da caixa*/background:#dcdcdc!important; /* cor de fundo da caixa */box-shadow: inset 1px 1px 6px  #dcdcdc; /* sombra interna*/font: 11px arial !important; /*fonte do texto*/border: 2px solid  #000000; /* borda */-webkit-border-radius: 10px;-moz-border-radius: 10px;border-radius: 10px;}.searchbut{background: url('URL DO BOTÃO');width:27px; /*Largura do botão*/height:20px; /*altura do botão*/border: 0;padding:2px;}

Para alterar o Url Do botão , achei esse aqui são bem interessantes , acho que vão ajudar !

         

Adicione um gadget HTML/JavaScript e cole o seguinte código:

<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>
Salve é Pronto !


3 comentários

  1. Ai que lindo ^^ adorei seu blog seguindo retribui *agradeço* ^^

    http://cantinhodaevilyn.blogspot.com.br/

    ResponderExcluir
  2. Nossa obrigado adorei .. Vou seguir seu blog tá ? Segue de volta ?

    ResponderExcluir