Personalizando a área do Post no Blogger – (Parte2)

No outro artigo sobre Personalizar Área do Post (Parte 1), você já aprendeu como personalizar DATA, POST, CORPO DO POST, PARAGRAFO DO POST E O TITULO DO POST no espaço ocupado pela postagem.

Agora você vai entender sobre outros elementos que compõem a área do post: IMAGEM DO POST (post img), RODAPÉ (post-footer), LINK DOS COMENTÁRIOS (comment-link) E CITAÇÃO DE TEXTOS (.post-blockquote).

Na maioria dos templates, no corpo do HTML, estes elementos estão representados por estas tags abaixo: (Trechos destacados em vermelho)
Para visualizá-lo vá no menu “modelo>>editar HTML” :

.post-footer {
}
.comment-link {
}
.post img {
}
.post blockquote {
}
.post blockquote p {
 }

Imagem do Post (.post img):

Você pode dar efeitos bem interessantes as imagens postadas no corpo de suas postagens, podendo acrescentar fundo (background) e bordas.
Sempre que você quiser modificar algo referente as imagens do post, você deverá fazê-lo no trecho do código abaixo, localizado no corpo HTML do seu blog.
Se no seu template não tiver este trecho, você poderá acrescentá-lo e incluir estilos a sua maneira.
Veja exemplos:

.post img {
background: #ffffff;
padding:4px;
border:2px dashed #000000;
}

Lembrando que “padding” é o espaço entre a borda e a imagem. Você deve estipular os valores de acordo com a sua preferência.
Para dar o efeito desta imagem abaixo eu usei como exemplo o código postado acima:

Você também pode adicionar uma borda com duas cores diferentes, é só usar a imaginação.

Rodapé do Post (.post-footer) :

Este elemento está localizado neste trecho, no html do seu blog:
.post-footer {

Você pode colocar um efeito de moldura no rodapé do seu post, para isso é só acrescentar as linhas “border” e “background” e aplicar os estilos a elas, de acordo com sua preferência.

Veja exemplos:

.post-footer{
background: #ffffff;
border:1px solid #ddd;
}

Para acrescentar uma imagem como plano de fundo no rodapé, acrescente:
background: #ffffff url(URL DA IMAGEM);

Sobre imagem como plano de fundo você pode acrescentar imagem de fundo no rodapé do seu post. 

Link dos comentários:

São os “links para comentário” e os “Links para esta postagem” que por padrão, aparecem no rodapé do post na página inicial.
Está representado por este trecho:
.comment-link {

Se quiser modificar tamanho da fonte ou a cor da fonte, é neste trecho que você deverá acrescentar estilos.
Cores da fonte – acrescente a linha com o código referente a cor que você deseja:
color: #xxxxxx;
Tamanho da fonte – acrescente a linha com o código referente ao tamanho da fonte que vc deseja:
font-size:12px;

Leia também o artigo que explica como corrigir o erro na contagem do link de comentários, talvez você se interesse. Veja o item:
• Corrigindo o erro de contagem no link de comentário

Post Blockquote (.post blockquote) :

Este trecho serve para diferenciar as citações que você queira fazer em seu post.
A maioria dos templates padrões do Blooger já vem com esta função ativada, porém não possuem marcação CSS e nem estilos configurados, isso você terá que fazer manualmente.
Se você quiser ativar a função Blockquote para diferenciar partes de textos em suas postagens, deverá aplicar os estilos dentro do CSS do seu template.

[alerta]ATENÇÃO:
Os códigos da área de postagens publicados neste tutorial, foram retirados do Template Minima.
Nos templates minima todo este trecho se apresenta desta maneira. Dependendo do modelo de template, alguns trechos publicados acima, não estão presentes no designer de modelo. Se o seu template já sofreu muitas modificações na área de post, provavelmente esta parte deve se apresentar de outra maneira.[/alerta]