Esse é um tutorial fundamental e que faltava em meus arquivos. Basicamente vou mostrar como adicionar uma pequena biografia (“Sobre o Autor”) no rodapé dos artigos de seu blog. Isso é útil principalmente para blogs com vários autores, mas é ótimo para aqueles que precisam vincular sua imagem diretamente ao conteúdo do Blog.

Existem várias possibilidades, mas resolvi optar pela mais simples e objetiva forma de colocar uma pequena biografia (resumida) do autor de um post no Blogger (Blogspot). A vantagem desse modelo é que você poderá configurar como achar melhor e aprenderá um pouco de HTML.

O modelo que vamos usar é este do exemplo:

Como adicionar nos posts manualmente.

Vamos começar com o modelo mais simples e manual, ou seja, sempre que for publicar um artigo terá que adicionar o código da mini biografia ao final de cada post. Pode parecer um pouco chato, mas te dará mais controle.

Depois de digitar seu post e estiver tudo pronto para ser publicado, clique na aba do editor de posts que permite a edição no HTML do texto. Veja a imagem que mostra a aba “HTML”:

Vá até o final e adicione o seguinte código fazendo as mudanças como indicado:

<p style="border-bottom: 1px dotted #3A6DA1;"></p>
<font style="font-size:18px"><b>Sobre o Autor:</b></font>
<table border="0">
<tr>
<td><img src="URL_da_IMAGEM" alt="SEU_NOME" border="0" style="border-bottom: 0px; border-left: 0px; margin-left: 0px; border-top: 0px; margin-right: 5px; border-right: 0px" /></td>
<td>Texto que deseja usar para descrever-se. Recomendo que não tenha mais que 45 palavras e coloque ao menos um link para a página completa da Biografia.</td>
</tr>
</table>
<p style="border-bottom: 1px dotted #3A6DA1;"></p>

• De verde onde está “Sobre o Autor:” você pode escrever um pequeno título para a mini-biografia.
• Onde está rosa, “URL_da_IMAGEM”, coloque o endereço de uma foto sua, que tenha um tamanho adequado. Recomendo que não seja maior que 75px de altura. Para usar uma URL de imagem recomendo o PicasaWeb que é padrão do Blogger (“Como enviar imagens para o PicasaWeb“).
• No azul, “SEU_NOME, coloque o seu nome de autor, que será exibido quando o mouse estiver sobre a foto.
• Por fim, o que está em negrito preto, escreva um pequeno resumo de sua biografia ou apresentação, como achar mais adequado.

Feitas essas alterações, basta agora publicar normalmente seu post e a mini biografia aparecerá no rodapé daquela postagem em que foi adicionada. Lembrando que só aparecerá nos artigos que você adicionar isso. Não vai automático para todos.

Para aparecer automático em todos os Posts do Blogger.

Usando exatamente o mesmo código acima, mas adicionando uma condicional, vou mostrar como colocar a mini biografia de forma automática para aparecer em todos os posts de seu blog, mesmo o que já existem, sem precisar alterar um por um.

1. Abra o painel do Blogger, e clique no menu “Layout” ~> “Editar HTML”, marcando a opção “Expandir modelos de widgets”.

2. Procure pela seguinte linha:

<div class=’post-footer’>

3. Imediatamente ACIMA dela, cole o seguinte trecho fazendo as mesmas modificações que citei anteriormente:

<b:if cond='data:blog.pageType == &quot;item&quot;'>
<p style="border-bottom: 1px dotted #3A6DA1;"></p>
<font style="font-size:18px"><b>Sobre o Autor:</b></font>
<table border="0">
<tr>
<td><img src="URL_da_IMAGEM" alt="SEU_NOME" border="0" style="border-bottom: 0px; border-left: 0px; margin-left: 0px; border-top: 0px; margin-right: 5px; border-right: 0px" /></td>
<td>Texto que deseja usar para descrever-se. Recomendo que não tenha mais que 45 palavras e coloque ao menos um link para a página completa da Biografia.</td>
</tr>
</table>
<p style="border-bottom: 1px dotted #3A6DA1;"></p>
</b:if>

4. Salve o modelo e pronto, todos os artigos agora terão o resumo de sua biografia com uma foto, bem no rodapé de todos os textos publicados e para os futuros também. Totalmente automático.

Mais tutoriais para personalizar seu Blog:

• Criar um Formulário de Contatos para Blog: Ferramentas ContactForm
• 10 dicas para melhorar a estrutura de layout do seu Blog
• Anatomia de uma Sidebar perfeita para seu Blog