Colocar nome do autor e data abaixo do titulo do post

Neste tutorial ensinarei como colocar o nome do autor e a data abaixo do titulo do post , o que torna mais fácil aos leitores saber por quem e quando o artigo foi escrito logo no início das postagens. Acompanhe!

Tutorial

Acesse o painel do blogger.
Vá em Design / Editar HTML e marque a opção Expandir modelos de widgets.
Utilizando as teclas CTRL+F procure pelo seguinte trecho:

Modelos novos do Blogger

<!-- quickedit pencil -->
        <b:include data='post' name='postQuickEdit'/>
      </span> <span class='post-author vcard'>
        <b:if cond='data:top.showAuthor'>
          <data:top.authorLabel/>
          <span class='fn'><data:post.author/></span>
        </b:if>
      </span>
ou em Modelos antigos do Blogger

<span class='post-author vcard'>

                <b:if cond='data:top.showAuthor'>
                  <data:top.authorLabel/>
                  <span class='fn'><data:post.author/></span>
                </b:if>
              </span>
Selecione e apague todo o trecho em vermelho. Salve o modelo!

Novamente vá em Editar HTML, clique em Expandir modelos de widgets e procure pelo trecho:

Modelos novos do Blogger

<b:if cond='data:post.isDateStart'>
          &lt;div class=&quot;date-outer&quot;&gt;
        </b:if>
        <b:if cond='data:post.dateHeader'>
          <h2 class='date-header'><span><data:post.dateHeader/></span></h2>
        </b:if>
ou em Modelos antigos do Blogger

        <b:if cond='data:post.dateHeader'>
          <h2 class='date-header'><span><data:post.dateHeader/></span></h2>
        </b:if>
Selecione e apague o trecho destacado em vermelho. Salve o modelo novamente!

No ultimo passo, ainda na opção Editar HTML marque a opção Expandir modelos de widgets e procure pelo trecho:

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

    <div class='post-body entry-content' expr:id='&quot;post-body-&quot; + data:post.id'>
      <data:post.body/>
      <div style='clear: both;'/> <!-- clear for photos floats -->
    </div>

    <b:if cond='data:post.hasJumpLink'>
Logo abaixo da seguinte linha...

   <div class='post-header'>
Cole todo este código:

<!--Autor e data-->
<div style='display:inline;width:auto;color:#999;font:normal 10px Arial;'>
<span class='post-author vcard'>
        <b:if cond='data:top.showAuthor'>
          <data:top.authorLabel/>
          <span class='fn'><data:post.author/></span>
        </b:if>
      </span>
<b:if cond='data:post.dateHeader'>-
<data:post.dateHeader/>
        </b:if>
</div><p/>
<!--Fim -->
Salve o modelo e pronto!