Tutoriais : Caixa de Pesquisa Personalizada +

             

Boa noite ! Como eu disse hoje é um Tutorial  de caixa de pesquisa personalizada  + Personalizar á areá dos comentários. 
Vamos Lá !
Tutorial #1
 Vá em Modelo > Editar HTML > Ctrl + F 
Quando pressionar  cole este código : ]]></b:skin>
E cole isso ACIMA : 

.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;



}


Os que estão de ROXO  é pra modificar .

Tutorial #2

O código foi pego no blog  Cherry Bomb!  

ATENÇÃO:

Antes de começar o tutorial eu recomendo que vocês façam em um blog de testes primeiro ou baixe seu modelo para evitar possíveis transtornos! 

Vá no seu HTML e procure por: #comments e apague todo o código que o acompanha: 

#comments {
  background: $(comments.background);
  padding: 15px;
}
#comments .comment-author {
  padding-top: 1.5em;
}
#comments h4,
#comments .comment-author a,
#comments .comment-timestamp a {
  color: $(post.title.text.color);
}
#comments .comment-author:first-child {
  padding-top: 0;
  border-top: none;
}
.avatar-image-container {
  margin: .2em 0 0;
} 

E subistitua por esse:

#comments h4 { /* Este é titulo do formulario, onde mostra "X Comentários" e "Postar um comentário" */

margin:0;
color:#ff4d8e;
font-family: Lucida Handwriting;
font-weight: normal;
font-size:26px;
text-shadow: none;
}
#comments-block .comment-author { /* O espaço do nome de quem comentou */
background: #FFF; /*Cor de fundo do nome de quem comentou*/
color: #8fddf6; /*Cor da fonte*/
font-family: Trebuchet MS; /*Nome da fonte*/
font-size:16px; /*Tamanho da fonte*/
border-bottom: dashed 1px #8fddf6; /*Borda de baixo do nome*/
padding: 5px;
margin:.5em 0;
height:30px; /*Altura do espaço do nome*/
}
text-decoration: none;
}
#comments-block .comment-body { /* Area do texto do comentario */
background: #FFF8DC; /*Fundo da área do comentário*/
margin-top: -2px; /*Margem externa do topo*/
padding: 5px;
font-family:'Oleo Script', cursive; /*Nome da Fonte*/
font-size: 15px;/*Tamanho da fonte*/
color:#696969; /*Cor da fonte*/
width: 480px; /*Largura da área dos comentários, altere de acordo com seu blog*/
/*Bordas arredondadas da área do comentário*/
-moz-border-radius: 10px;
-webkit-border-radius: 10px;
border-radius: 10px;
/*Fim do código da borda arredondada*/
}

Fiim ! ;D até a próxima