Biografia do autor do Blog no rodapé dos posts para Blogger

Gadgets, Layout, Postagens
54
Siga o Ferramentas Blog: Canal no Youtube | Facebook | Twitter | Google+
Acesse AGORA: https://blogueiro.pro e se torne um Blogueiro de Elite.

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.

✅ Canal no Youtube | Inscreva-se AGORA ✅

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:

.

54 Comentários

  1. tem uma maneira mas fácil de você adicionar está mini-biografia sem mecher nos códigos do blog. Basta ir em Configuração, formatação no final da página tem um espaço que se chama modelo de postagem adiciona o código ja pronto da mini-bibliografia e pronto estará lá automaticamente.

    Obrigado pela dica irei usa-lá bastante!

    Responder

  2. Não foi possível salvar o modelo
    Corrija o erro abaixo e envie o seu modelo novamente.
    Não foi possível analisar o seu modelo, pois sua formatação é inadequada. Certifique-se de que todos os elementos XML estão fechados adequadamente.
    Mensagem de erro em XML: The reference to entity "th" must end with the ';' delimiter.

    tentei a segunda maneira,como faço para resolver este erro meu querido marcos lemos ??

    Responder

  3. Amigo acima,

    Veja se vc não mudou nada no código. Não há nenhuma linha do código que ensinei com o trecho "th". Vc mudou alguma coisa que não devia e o erro que você relatou nada tem a ver com o código que ensinei.

    Responder

  4. Hi, Marcos…

    Gostaria de fazer uma colocação, sobre um pequeno deslize.

    O atributo alt=, usado no código deste post, não exibirá nenhum texto "quando o mouse estiver sobre a foto". Este (o texto) será exibido caso esta imagem não seja carregada.

    O atributo title= sim, exibirá um texto descritivo do objeto/imagem a ele relacionado, onmouseover!

    No mais, o post está perfeito. Como sempre!

    []'s @inaciorolim

    Responder

  5. Olá, Marcos.
    Faz um tempinho que eu queria fazer isso mas não tinha visto ainda em nenhum outro blog ou passou despercebido.
    Mais uma vez, você está de parabéns.
    Fiz uma modificação que colocou borda em toda volta, só que não consigo arrumar o padding no texto para que não fique encostando na margem.
    Forte abraço!

    Responder

  6. Gosto muito das dicas de vcs. Sempre venho dar uma olhada e aprender mais um pouco. Parabéns pela linguagem fácil das instruções. Vou tentar mais essa também.
    Abraços.

    Responder

  7. Olá tenho uma dúvida, não é o primeiro tutorial a respeito que vejo…mas esse sem dúvidas é o mais prático, parabéns.
    Em um blog com mais de um autor….o outro autor terá de seguir o mesmo procedimento em seu painel de controle para ter sua biografia em suas postagens?

    Responder

  9. Tentei de outra maneira mas não tinha ficado legal, e fui garimpar novamente e olha que encontrei aqui! =)
    Gostei muito! Suas dicas são as melhores!!!

    Responder

  10. Caro, colega.
    Gostaria de saber se é possível fazer o mesmo no WordPress? E como seria? Tenho tentado fazer um um blog (ao menos razoável)de forma autodidata, tateando neste incrível mundo de possibilidades que é a internet.
    Cordialmente,
    Sandro Menezes

    Responder

  12. Pingback: Gadgets e Elementos de Página para Blogger Blogspot | [ Ferramentas Blog ]

  14. Olá Marcos,

    Eu sinceramente gostei muito do tutorial e estou colocando em nova versão de nosso blog. Mas o que achei mais interessante foi a estrutura de seu perfil no fim da postagem, porque colocava outros dados como facebook, twiiter e também esse contador de postagem de cada um do autores.

    o que acrescentaria para fazer essas modificações no perfil.

    Abraços

    Adolfo Maia

    Responder

  16. Bela postagem Marcos, teria como fazer para o WordPress? porém irá aparecer uma biografia diferente automaticamente para autor que postar…

    Ter como eu acho que tem, porque aqui no FB acredito que sejá assim, irá me ajudar muito.

    Responder

  20. Pingback: Exibir biografia ao final dos posts – Plugin: Author Bio Box | [ Ferramentas Blog ]

  21. Marcos, vc é ótimooooo, muito obrigada pelas dicas,

    Eu sempre colocava uma informação no final dos Posts, mas quando precisava trocar tinha que ser na “unha”, um a um. (agora vou ter que retirar dos posts antigos ;o)

    Agora com essa dica eu consegui deixar a informação sobre o autor e mudei o restante para o que eu precisava…

    Se tiver tempo da uma olhandinha: [link suprimido]

    Valeu!! Uma otima noite!!

    Responder

  26. ai marcos muito bom o tutorial.
    queria saber como coloco um contator de postagem automatico para cada autor, mostarando quantas postagem cada autor fez como tem aqui no seu site, qual é linha de codigo que tenho que inserir?

    Obrigado.

    Responder

  30. Deu quase tudo certo no meu site, só que o texto ficou alinhado á direita e a imagem á esquerda =/
    Não sem como arrumar isso? Não consegui sozinha.

    Responder

  31. no meu blog a postagem fica tipo em cima do inicio da descrição do autor. o que eu posso fazer? eu uso o blogger

    Responder

  32. Oi Marcos, excelente post, já apliquei o método da biografia automática no meu blog, funcionou muito bem. Só tenho uma dúvida: tem como fazer com que a biografia apareça apenas nas situações em que o artigo completo está sendo mostrado e não seu resumo? É que uso o recurso de mostrar apenas um resumo dos artigos na página inicial, assim, como vários posts são mostrados nessa página, a biografia acaba aparecendo várias vezes na página principal. Então, no meu caso, gostaria que a biografia aparecesse apenas quando o leitor clicasse no ícone “leia o artigo completo”.

    Aproveitando, como você faz para incluir essas caixas de notificação de novos comentários aqui em baixo?

    Obrigado e parabéns pelo excelente blog!

    Responder

  33. Oi Marcos, tudo bom?
    Primeiro, parabéns pelo blog e obrigada pelas infos. Funcionou perfeitamente!

    Para blogspot, tem alguma forma que criar o contador de posts escritos por autor que no WordPress é automático?

    Muito obrigada!

    Responder

  36. Oi, Marcos!!
    Fiz o seu tutorial, deu tudo certo, o resumo ficou ótimo, mas toda vez que eu compartilho no facebook, aparece o resumo do autor com o título e não o post.
    Por conta disso, acabei tirando do modelo e mesmo assim a bio continua aparecendo nos compartilhamentos.
    Tem solução ou me jogo da ponte???
    Me ajuda!
    Obrigada

    Responder

  38. Gostaria de colocar esse código igual ao seu (que mostra o números de artigos escritor pelo autor). Gostei muito dessa ferramenta

    ….(Marcos Lemos já escreveu 1634 posts no Ferramentas Blog.)….

    Tem como?

    Responder

  40. Só deu certo no template simples do blogger. Baixei um template da net, neste infelizmente não deu certo. Será q vc poderia me ajudar?

    Responder

  42. Olá amigo, testei aqui no meu blog de teste e não deu certo. O que pode ser que esteja acontecendo?
    Ele está com o template simples, então achei o código bem rápido.

    O meu blog principal tem mais de um autor, nele, usei outro código que encontrei na net. Todos os tutoriais que encontrei não funcionaram, somente esse para um autor que não sei como colocar para mais de um autor.

    Espero que tenha entendido algo..
    Obrigado.
    Att.

    Responder

Deixe um comentário

Ao comentar você concorda com nossa Política de Comentários.