Combo 2: diminuir espaço entre sidebar e posts, colocar cor de fundo e deixar as imagens dos posts em mesmo tamanho

Vá até o Modelo de seu blog, clique em Editar modelo

  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

A primeira coisa a fazer é diminuir o espaço entre as postagens e a sidebar. Para isso, procure por:


 <Variable name="main.section.margin" description="Main Section Margin" type="length" default="15px" value="15px"/>
   <Variable name="main.padding" description="Main Padding" type="length" default="15px" value="15px"/>
   <Variable name="main.padding.top" description="Main Padding Top" type="length" default="30px" value="30px"/>
   <Variable name="main.padding.bottom" description="Main Padding Bottom" type="length" default="30px" value="30px"/>

E troque por:

   <Variable name="main.section.margin" description="Main Section Margin" type="length" default="5px" value="5px"/>
   <Variable name="main.padding" description="Main Padding" type="length" default="5px" value="5px"/>
   <Variable name="main.padding.top" description="Main Padding Top" type="length" default="3px" value="3px"/>
   <Variable name="main.padding.bottom" description="Main Padding Bottom" type="length" default="3px" value="3px"/>

Salve

Agora vamos retirar as bordas.

Procure por:

border-right: 1px solid $(body.rule.color);

E troque por:

border-right: 0px solid $(body.rule.color);

Agora troque:

border-left: 1px solid $(body.rule.color);

por:

border-left: 0px solid $(body.rule.color);

Procure por:

border-$startSide: 1px solid $(body.rule.color);

Troque por:

border-$startSide: 0px solid $(body.rule.color);

Agora que tiramos as bordas de cada elemento da sidebar, vamos dar estilo, dininuindo os espaços entre cada widget.



SE VOCÊ TEM 3 COLUNAS NO FOOTER

Acima de:

/* Headings


Cole o código abaixo

/*Sidebar---------------------------------------------------*/
#sidebar-left-1,  #sidebar-left-3{
margin: 5px -20px 5px -20px;
padding: 10px 5px 10px 5px;
background: #ccc;
}
#sidebar-right-1,  #sidebar-right-3{
margin: 5px -20px 5px -20px;
padding: 10px 5px 10px 5px;
background: #ccc;
}
#sidebar-right-2-1, #sidebar-left-2-1 {
margin: 5px 2px 5px -20px;
padding: 10px 5px 10px 5px;
background: #eee;
}
#sidebar-left-2-2,  #sidebar-right-2-2 {
margin: 5px -20px 5px 2px;
padding: 10px 5px 10px 5px;
background: #eee;
}
#footer-1{
margin: 5px -20px 5px -20px;
padding: 10px 5px 10px 5px;
background: #eee;
}
#footer-2-1{
margin: 5px 2px 5px -20px;
padding: 10px 5px 10px 5px;
background: #eee;
}
#footer-2-2 {
margin: 5px 2px 5px 2px;
padding: 10px 5px 10px 5px;
background: #eee;
}

#footer-2-3 {
margin: 5px -20px 5px 2px;
padding: 10px 5px 10px 5px;
background: #eee;

}


SE VOCÊ TEM 2 COLUNAS NO FOOTER O CÓDIGO ENTÃO É ESTE

Acima de:

/* Headings

/*Sidebar---------------------------------------------------*/
#sidebar-left-1,  #sidebar-left-3{
margin: 5px -20px 5px -20px;
padding: 10px 5px 10px 5px;
background: #ccc;
}
#sidebar-right-1,  #sidebar-right-3{
margin: 5px -20px 5px -20px;
padding: 10px 5px 10px 5px;
background: #ccc;
}
#sidebar-right-2-1, #sidebar-left-2-1 {
margin: 5px 2px 5px -20px;
padding: 10px 5px 10px 5px;
background: #eee;
}
#sidebar-left-2-2,  #sidebar-right-2-2 {
margin: 5px -20px 5px 2px;
padding: 10px 5px 10px 5px;
background: #eee;
}
#footer-1, #footer-3{
margin: 5px -20px 5px -20px;
padding: 10px 5px 10px 5px;
background: #eee;
}
#footer-2-1{
margin: 5px 2px 5px -20px;
padding: 10px 5px 10px 5px;
background: #eee;
}
#footer-2-2 {
margin: 5px -20px 5px 2px;
padding: 10px 5px 10px 5px;
background: #eee;
}

#footer-2-3 {
margin: 5px -20px 5px 2px;
padding: 10px 5px 10px 5px;
background: #eee;
}

Salve.


Prontinho. Agora vamos dar um espaço entra a postagem e regular o tamanho das imagens.

Procure por:


.main-inner .column-center-inner .section {
  margin: 0 $(main.section.margin);
}

E troque por:

.main-inner .column-center-inner .section {
  margin: 5px 10px 10px 10px;
 background: #eee;
 padding: 10px 10px 10px;
}

.post-body img {
width: 280px;
height: 200px;
}