quarta-feira, 8 de fevereiro de 2012

Tags, autor e comentários abaixo do titulo da postagem


" Primeiramente desculpas, pois não pude postar ontem, porque minhas aulas já começaram, esse ano vai ser um pouco mais difícil, pois passei pro ensino médio...então acho que não vou poder postar todo dia aqui, mais sempre que eu estiver com um tempinho, venho correndo postar pra vocês... Vamos ao post de hoje "

Hoje postarei outro tutorial : " Tags, autor e comentários abaixo do titulo da postagem "
Lembrando que sempre que eu postar algum tutorial aqui, é porque eu peguei de algum outro blog, até porque eu não sei fazer certas coisas sem um tutorial, e sempre que pego de outro blog, dou os devidos créditos.


Abra o blog, vá em design, editar HTML e marque a caixinha "expandir modelos de widgets".
Tecle Ctrl F e procure por post-footer-line  , é onde ficam os trechos que vamos recortar. Sempre recorte de <span class=”(…)”> até </span>. Recomendo que recorte e cole no bloco de notas, facilita -e muito- o tutorial. Os trechos são:

(Autor do post)
<span class='post-author vcard'>
<b:if cond='data:top.showAuthor'>
<data:top.authorLabel/>
<span class='fn'><data:post.author/></span>
</b:if>
</span>
(Marcadores)
<span class='post-labels'>
<b:if cond='data:post.labels'>
<data:postLabelsLabel/>
<b:loop values='data:post.labels' var='label'>
<a expr:href='data:label.url' rel='tag'><data:label.name/></a><b:if cond='data:label.isLast != &quot;true&quot;'>,</b:if>
</b:loop>
</b:if>
</span>
(Comentários)
<span class='post-comment-link'>
<b:if cond='data:blog.pageType != &quot;item&quot;'>
<b:if cond='data:blog.pageType != &quot;static_page&quot;'>
<b:if cond='data:post.allowComments'>
<a class='comment-link' expr:href='data:post.addCommentUrl' expr:onclick='data:post.addCommentOnclick'><b:if cond='data:post.numComments == 1'>1 <data:top.commentLabel/><b:else/><data:post.numComments/> <data:top.commentLabelPlural/></b:if></a>
</b:if>
</b:if>
</b:if>
</span>

 Depois de recortá-los procure por <div class='post-header-line-1'/>  de enter e cole os códigos que você recortou. Eles vão ficar como é aqui no blog, todos na mesma linha. Se você quiser colocar um em cada linha  é só colocar <br/> depois de cada </span> . 
Você pode mudar a ordem se quiser, é só trocar os códigos de lugar!
Para deixar com aquela divisória assim: | é só colocar ela depois do primeiro e do segundo </span>
Exemplo: <código do autor> | <código dos marcadores> | <código dos comentários>

Obs: Pode acontecer de ficar por exemplo as tags repetindo abaixo do titulo e no rodapé do post, para corrigir isso é só você procurar pelo código da parte que está repetindo e se tiver mais de um apague o que se refere ao post footer (rolando a página um pouco pra cima você vai achar, então saberá).

Vamos enfeitar?
Procure por h3.post-title { e depois de } (quando acaba o primeiro trecho) cole o seguinte código:

.post-header, .dados {
border-top: 1px solid #ccc;
border-bottom: solid 1px #ccc; /*cinza*/
padding: 1px 0 1px 12px; /*espaço topo direita baixo esquerda/*
margin: 0;
border-bottom: solid 1px #ccc; /*cinza*/
text-align: center;
}
Você pode mudar as cores (#ccc) a espessura das bordas (1px) e trocar solid por dashed para deixar a borda sublinhada.

Obs: Testado somente no template Travel!

Créditos: Go Imagine


2 comentários:

  1. Meu, amei demais seu blog! Tem tudo que eu preciso ahahah'
    Olá, eu fiz um blog e queria fazer ele crescer. Você poderia me ajudar seguindo e comentando nele? http://encantosdeumaadolescente.blogspot.com/
    Já segui seu blog, meu nome de seguidora é @i_jubs. Beijos bebês

    ResponderExcluir
  2. oque é recortar esses códigos como faz isso me ajuda por favor ?

    ResponderExcluir

Comente, opine, dê sua opnião!

Seu comentário é sempre bem vindo!

LinkWithin

Related Posts Plugin for WordPress, Blogger...