16 de abr de 2012

Customizar a caixa de pesquisa nativa do Blogger



Você acha a caixa de pesquisa do Blogger sem gracinha ? Eu também, por isso resolvi colocar uma corzinha, dar um arzinho de graça a esse widget tão importante em nosso blog.

Para isso, vá até o modelo do blog


Vá até o Modelo de seu blog, clique em Editar modelo e clique em editar HTML.
  Não se esqueça de antes de começar salvar uma cópia de seu template, caso não dê certo, é só reinstalá-lo. Essa dica é para o template Simple, do novo Blogger, implementado em julho de 2011
Agora procure por: ]]></b:skin>  



 
Acima deste código cole o código abaixo.



/*CustomSearch-----------------------------------------------------*/
#input.gsc-input{margin: 10px 10px; background: #eee; }
.gsc-branding-text, .gsc-branding-img-noclear {display:none;}
input.gsc-search-button {
 -moz-border-radius-bottomright: 4px;
  -webkit-border-bottom-right-radius: 4px;
  border-bottom-right-radius: 4px;
  -moz-border-radius-topright: 4px;
  -webkit-border-top-right-radius: 4px;
  border-top-right-radius: 4px;
font-family:'trebuchet ms';
font-size:18px; padding: 6px 6px;
color:#fff;
background:$(link.color);
border:0px;
font-weight:bold;
}
input.gsc-search-button:hover {
background: $(link.hover.color);
color:#fff;
}
input .gsc-input{ background: #cc0000;
}

div#CustomSearch1.widget.CustomSearch{background: $(link.color); padding: 4px 4px; margin: -20px 0 0 0;}
div#CustomSearch1_form{background: #eee; padding: 8px 8px;-moz-border-radius:2px 2px 2px 2px;-webkit-border-radius: 2px 2px 2px 2px;border-radius:5px 5px 5px 5px;}




Salve.

Se não deu certo, tente este abaixo:




/*CustomSearch-----------------------------------------------------*/
#input.gsc-input{margin: 10px 10px; background: #eee; }
.gsc-branding-text, .gsc-branding-img-noclear {display:none;}
input.gsc-search-button {
 -moz-border-radius-bottomright: 4px;
  -webkit-border-bottom-right-radius: 4px;
  border-bottom-right-radius: 4px;
  -moz-border-radius-topright: 4px;
  -webkit-border-top-right-radius: 4px;
  border-top-right-radius: 4px;
font-family:'trebuchet ms';
font-size:18px; padding: 6px 6px;
color:#fff;
background:#808080;
border:0px;
font-weight:bold;
}
div#CustomSearch1.widget.CustomSearch{background: #cc0000; padding: 4px 4px; margin: -20px 0 0 0;}
div#CustomSearch1_form{background: #000; padding: 8px 8px;-moz-border-radius:2px 2px 2px 2px;-webkit-border-radius: 2px 2px 2px 2px;border-radius:5px 5px 5px 5px;}

4 comentários:

  1. Oi amiga, tá sumida, vi tuas postagens ai vim te deixar um beijo e um oi, espero que esteja tudo bem, beijos nas crianças

    ResponderExcluir
    Respostas
    1. Ei Mimo, estou aqui na vidinha de sempre. Beijos.

      Excluir

A legislação brasileira prevê a possibilidade de se responsabilizar o blogueiro pelo conteúdo do blog, inclusive quanto a comentários; portanto, o autor deste blog reserva a si o direito de não publicar comentários que firam a lei, a ética ou quaisquer outros princípios da boa convivência. Não serão aceitos comentários anônimos ou que envolvam crimes de calúnia, ofensa, falsidade ideológica, multiplicidade de nomes para um mesmo IP ou invasão de privacidade pessoal / familiar a qualquer pessoa. Comentários sobre assuntos que não são tratados aqui também poderão ser suprimidos, bem como comentários com links. Este é um espaço público e coletivo e merece ser mantido limpo para o bem-estar de todos nós.


Copyright © Templates e Acessórios |
Design by Elke di Barros | Tecnologia do Blogger
    Twitter Facebook Google + YouTube