Junte-se a 22.515 pessoas que
decidiram aprender tudo sobre Criação de Blogs Profissionais e Redes Sociais.

Postagens Vanessa S.

Nome do Autor do Post Abaixo do Titulo no blog

Por padrão, no Blogger, sempre que um post é publicado a assinatura do autor da postagem aparece no rodapé do post. (Postado por:…)
Se você quiser que a assinatura do autor da postagem e apareça abaixo do titulo do post e não no rodapé, basta fazer algumas modificações no código do seu template.

1. Modificar o HTML do template

Vá em design >> Editar HTML >> Expandir modelos de widgets, e procure por este código:


<span class='post-author vcard'>
<b:if cond='data:top.showAuthor'>
<data:top.authorLabel/>
<span class='fn'><data:post.author/></span>
</b:if>
</span>

Encontrado código você deverá:
1) Copiá-lo
2) Salvá-lo em um bloco de notas
3) Apagar ele do seu template.

Agora procure por:


<div class='post-header-line-1'/>

E cole logo ABAIXO desta linha o código que você copiou no bloco de notas, e salve as modificações, devendo ficar assim:


<div class='post-header-line-1'/>
<span class='post-author vcard'>
<b:if cond='data:top.showAuthor'>
<data:top.authorLabel/>
<span class='fn'><data:post.author/></span>
</b:if>
</span>

2. Aplicar estilos CSS para assinatura do autor:

Agora você pode estabelecer os estilos para cores e fontes na assinatura do autor da postagem, no CSS do seu template.

Volte na edição HTML, e acrescente a linha de código a seguir, incluindo os estilo de acordo com seu gosto, logo ACIMA da tag ]]></b:skin> :


.post-author {
color:#XXXXXX; /* cor da fonte */
font-size: XXpx; /* tamanho da fonte */
font-weight: normal;
}

Todos os estilos que você incluir neste trecho serão aplicados apenas assinatura do autor da postagem.

Se preferir você também pode adicionar estilos para que sejam aplicados a toda linha abaixo do titulo do post, basta acrescentar o seguinte trecho:


.post-header-line-1{
color: /*coloque a cor de sua preferência*/
margin: /*defina um espaçamento se quiser*/
padding: /*defina um espaçamento se quiser*/
font-size: /*coloque o tamanho da fonte de sua preferência*/
}

Se quiser colocar a data do post na linha abaixo do titulo, recomendo a leitura do artigo:
Colocar a Data abaixo do título do post

Sobre o autor | Website

Fundadora do Mundo Blogger. Autodidata que adora internet, que se encantou com blogs, seus códigos e templates, desde 2009, e por conta disso começou a "brincar" com web design nas horas vagas, até que resolveu criar o Mundo Blogger para compartilhar o que aprendeu com você através dos tutoriais publicados aqui.

Desculpe, os comentários deste artigo estão encerrados.

35 Comentários

  1. Rafa-Kun disse:

    Oi! tudo bem? Adoro seu blog mas tenho uma pergunta para fazer, fiz tudo o que você pediu mas quando vou salvar e visualizar o nome do autor desaparece *0* e o que eu faço?

    • Vanessa disse:

      Lamento, mas alguns recursos podem variar de template para template, e em alguns casos só é possível encontrar alguma resolução testando, e por não dispor de tempo para isso, no momento não estou prestando este tipo de suporte. Infelizmente não há como eu saber o que ocorreu no seu template.

  2. Barbara disse:

    Ola… eu ja tentei de tudo mais nao consigo mudar a posição fica assim…
    19 DE JUNHO DE 2012

    Postado por Barbara Braem

    e continua sendo mostrado abaixo do post, será que tem alguma solução?
    Seu blog me ajudou e muito. Aguardo resposta

    • Vanessa disse:

      Alguns recursos podem variar de template para template. Sendo assim, lamento, mas não tenho como te ajudar, de qualquer forma agradeço pelo comentário.

  3. Davinho_Ever disse:

    Muito obrigado 😉

  4. JubaGomez disse:

    Não sei porque mais o meu não ficou em baixo do post, ficou em cima, o que eu fiz de errado, como corrijo isso?

  5. Juliana Ribeiro disse:

    Deu suuuuper certo no meu blog!
    Não é a toa que o teu blog ta na lista dos meus favoritos aqui.
    Parabéns!

  6. Mae Bonita disse:

    Meu template e do designer do blogger
    nao achei essa parte do codigo ke se refere ao autor
    mesmo assim copiei o codigo ke vc indica aki
    e adicionei no header line 1
    ainda assim nw mudou nada…
    entaw pra ser mais clara no meu template originalmente,
    nw indica nada sobre o autor dos posts..

  7. .:: Clau ::. disse:

    Phoenix
    Valeu 😉

  8. Phoenix disse:

    Olá! Realmente vc não imagina o quanto eu quebrei a cabeça para conseguir colocar esse autor debaixo do título. Mas ainda tive problemas para formatar como queria e após ter feito do jeitinho que falou (e parecia travado, pq não aceitava) eu apertei em reverter modelos widget para padrão e tchanam! lá estava meu autor de baixo do título, como a formatação que eu tinha definido dentro do css. =)

    Adorei o tutorial. Muito obrigada !

  9. Kevvin Oliveira disse:

    Obrigado pela resposta Clau! Desde já agradeço. Vc é d+! =*

  10. .:: Clau ::. disse:

    Kevvin
    No final do post, eu já disponibilizei o código que se refere a toda linha abaixo do titulo.É só vc aplicar os estilos q vc quer nele. Se quer centralizar, tente incluir: float:center;
    ou ajuste as medidas de padding e margin.

  11. Kevvin Oliveira disse:

    Vc não entendeu minha pergunta. Gostaria de saber como faço para CENTRALIZAR tudo isso abaixo do título.
    Desde já agradeço

  12. .:: Clau ::. disse:

    Kevin
    É só vc recortar todos os trechos de código referentes a hora, data, marcador e comentário e colar os códigos abaixo da linha:
    div class='post-header-line-1

  13. Kevvin Oliveira disse:

    Olá! Gostaria de dizer que adoro de ontão o seu site Clau, e eu gostaria de tirar um pequena dúvida. Como faço para centralizar o nome do autor, os comentários, os marcadores e a hora do post tudinho embaixo do título? Eu ficaria muito grato se você pudesse me ajudar!
    Abraços! \o/

  14. ADM-Ikki disse:

    como faço para a data e o autor subir/arredar para o lado ?

  15. Wesley disse:

    Obrigado Clau você é 10 ! 😉

  16. .:: Clau ::. disse:

    Wesley
    No meu menu "Tutoriais Blogger" tem o link de todos os tutoriais que já foram publicados. Procure pelo tutorial "aplicar estilos às páginas estáticas".

  17. Wesley disse:

    Olá Clau, tenho uma dúvida sobre o mesmo tema. Baixei um template de um outro site, e nas páginas estatísticas (.html) aparece o ícone de comentários, ícone do autor, e ícone dos marcadores.
    Eu adoraria ocultar estes itens dessas páginas. Se puder me ajudar agradeço muito!

    Veja a página: http://blogytutoriais.blogspot.com/p/sobre-o-editor-wesley-vicente.html

  18. Lucas disse:

    Desculpa Clau por essa amolação,è porquê eu pedi para minha prima por o blog restrito para ninguèm ver porquê eu ainda estou arrumando e ta uma bagunça,ainda não postei nada mas vou pedi pra minha prima colocar ele no perfil pq não sei fazer isso. 🙂

  19. .:: Clau ::. disse:

    Lucas
    Fui tentar visitar seu blog mas não encontrei..qual é o seu blog? Onde ele está? É que vi q vc deixou vários comentários pedindo ajuda e queria conhecer seu blogpra ver como ele tá ficando =)
    Bom sobre sua pergunta, procure o tutorial: Elementos Básicos das Postagens.

  20. Lucas disse:

    Clau no meu template eu altero aquele texto "postado por",no elementos de pàgina,mas não se aplica ao template,como faço isso manualmente?

  21. .:: Clau ::. disse:

    Paula
    Experimenta mover a data e a hora (post-timestamp)para a linha "post-header-line-1".
    Eu acho que no seu template elas devem estar na linha abaixo, por isso que não ficou alinhado. Se tiver alguma "div" para estes 2 elementos (data e hora) apaga e deixa só o "span", mas tudo na mesma linha. Faz o teste.

  22. Paula disse:

    Outra coisa que ficou errada depois que coloquei esse código foi que segui a dica e adicionei a linha .post-header-line-1, mas qualquer alteração de formatação que eu faça nela afeta todo o post, não só a linha do nome do autor e data.

  23. Paula disse:

    Oi!
    Coloquei o autor do post, a data e a hora embaixo do titulo, mas aí aparece uma quebra de linha entre eles, assim:

    Postado por Paula
    20 de setembro de 2010
    às 18:35

    Já tentei de tudo e não consigo deixar tudo na mesma linha igual o seu blog.

  24. .:: Clau ::. disse:

    @Fabiano Cezar:
    Vc encontra o que vc precisa neste tutorial: Biografia do autor do post no rodapé.
    Obrigada pela visita!

  25. Fabiano Cezar disse:

    Oi tudo bom
    intaum meu blog possui dois autores
    eu queria sabe como eu faço pra coloca a biografia
    dos dois
    mas no modo que, quando eu faça uma postagem apareça
    somente a minha biografia e quando for ele a dele.
    tem como ?

  26. ::Clau:: disse:

    @Lady Dangerous:
    Já acrescentei as informações para personalizar esse campos que vc pediu. Post atualizado!
    Obrigada pela visita e pelo comenta´rio. Volte sempre que precisar!

  27. Lady Dangerous disse:

    Olá linda , amei mesmo seu site está de parabéns , nunca vi outra coisa assim , espetacular *-* , então eu consegui fazer só que , como personaliza essa parte? colocar cor na letra , etc

  28. pousio disse:

    Obrigada! Tuas dicas têm me valido muito!
    Sonia

  29. cleyton josé disse:

    olha eu queria te fala que gosto muito do seu blog e do outro tb…. Só queiria te fala quer seria legau ne alguns poster vc colocar imagem tipo esse poste, mais ta super legau….

  30. dasilv disse:

    Blz, Clau.
    Vou fazer isso, sim!
    Bj, amiga!
    dani

  31. .:: Clau ::. disse:

    @Dani:
    Oba…é bom saber..=)
    Qdo vc quiser aprender alguma coisa que ainda não tenha postada aqui..pode deixar uma sugestão de dica aqui como comentário mesmo.
    Assim é bom pra eu saber tb o q vcs querem aprender pra que eu possa providenciar o tutorial.

  32. DAS disse:

    Ótima dica, Clau!
    Engraçado… algumas dessas dicas que vc tem mostrado aqui são coisas e mudanças que eu já quis saber…

    Beijo, amiga!
    dani

Por gentileza, se deseja alterar o arquivo do rodapé,
entre em contato com o suporte.