Nos Templates padrões do Blogger(Designer de Modelo e Minima), a data dos posts aparecem sempre na linha acima dos títulos das postagens. ...

Data da Postagem no Rodapé do Post no Blogger

Nos Templates padrões do Blogger(Designer de Modelo e Minima), a data dos posts aparecem sempre na linha acima dos títulos das postagens.
Data padrão do Blogger

Se você quiser Colocar a Data das Postagens na linha do rodapé do post, ao lado do nome do autor, conforme a imagem demonstrativa abaixo, terá que fazer algumas modificações no código do seu template.
Data abaixo do Título do Post
[becape]Lembrando que: Antes de qualquer modificação, é sempre bom fazer um backup do seu Template para evitar transtornos.[/becape]

Colocar a Data da postagem do Blogger na linha do Rodapé do post:

Vamos localizar o trecho do código referente a data dos posts no template.
Acesse o painel do blogger e clique no menu “modelo >> Editar HTML” e marque a caixinha “Expandir modelos de widgets”, e procure por este código:

<b:if cond='data:post.dateHeader'>
<h2 class='date-header'><span><data:post.dateHeader/></span></h2>
</b:if>
Dica: Se tiver dificuldades para localizar o código completo, utilize ctrl+f e tente localizar a 1º linha do código.
SUBSTITUA TODO o código acima por este aqui:

<b:if cond='data:post.dateHeader'>
<span class='date-header'><data:post.dateHeader/></span>
<script>var lastDate= '<data:post.dateHeader/>';</script>
<b:else/> 
<span class='date-header'><data:post.dateHeader/>
<script>document.write(lastDate);</script> 
</span>
        </b:if>
SALVE!
Agora você deverá COPIAR TODO O CÓDIGO que você acabou de alterar e deverá:
1) Salvá-lo no bloco de notas
2) Apagar ele do seu template.
Retorne no modo “editar html” do seu template e agora procure por:

<span class='post-author vcard'>
        <b:if cond='data:top.showAuthor'>
          <data:top.authorLabel/>
            <b:if cond='data:post.authorProfileUrl'>
              <span class='fn' itemprop='author' itemscope='itemscope' itemtype='http://schema.org/Person'>
                <meta expr:content='data:post.authorProfileUrl' itemprop='url'/>
                <a expr:href='data:post.authorProfileUrl' rel='author' title='author profile'>
                  <span itemprop='name'><data:post.author/></span>
                </a>
              </span>
            <b:else/>
              <span class='fn' itemprop='author' itemscope='itemscope' itemtype='http://schema.org/Person'>
                <span itemprop='name'><data:post.author/></span>
              </span>
            </b:if>
        </b:if>
      </span>
E cole logo ABAIXO deste trecho o código que você copiou no bloco de notas.
Visualize, e se estiver tudo certo, salve!
 
Após modificar o código, você pode aplicar estilos para a data. Procure epal tag ]]></b:skin>
E cole logo ACIMA dela, o código a seguir, incluindo os trechos definindo os estilos que você deseja.

.date-header {
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*/
}
[alerta]ATENÇÃO:
Antes que me perguntem: Os códigos postados neste tutorial, foram retirados do Template padrões do Blogger (Designer de Modelo e Minima).
Nos templates padrões do Blogger, tanto os modelos Minima, quanto os Designer de Modelo, todo trecho referente a data dos posts, se apresentam desta maneira.
Dependendo do modelo de template que você usa, se ele já sofreu muitas modificações, pode ser que este trecho se apresente de outra maneira, portanto é bem capaz que este hack não funcione para alguns casos.
Caso não dê certo no seu blog, pode ter certeza que seu template já sofreu bastante modificação e infelizmente a sua única solução é: tentar encontrar trechos ao menos parecidos e testar![/alerta]

0 comentários: