19 de mai de 2012

Como colocar "Autor, Marcadores e Comentarios" abaixo do titulo da postagem.

Yeaa!
A pedido da Nina do Mar de Glitter,  trouxe um tutorial
de como colocar o Autor, os Marcadores e os Comentarios logo abaixo do titulo da postagem,igual esta aqui... Ele é meio complicadinho, então precisa de atenção,
Vamos Lá!
Vá em Design >> Editar HTML e selecione a caixinha de "Expandir Modelos de Widget."
Abra o bloco de notas...
Aperte CTRL + F e:
 1. Procure pela primeira linha de:


 <span class='post-author vcard'>
        <b:if cond='data:top.showAuthor'>
          <data:top.authorLabel/>
            <b:if cond='data:post.authorProfileUrl'>
              <span class='fn'>
                <a expr:href='data:post.authorProfileUrl' rel='author' title='author profile'>
                  <data:post.author/>
                </a>
              </span>
            <b:else/>
              <span class='fn'><data:post.author/></span>
            </b:if>
        </b:if>
      </span>  


E recorte o codigo todo !
 O código acima representa o nome do autor. Recorte ele e cole no bloco de notas, usaremos depois.

2. Agora procure pela primeira linha de:


<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>


E recorte o codigo todo!
 O código acima representa os marcadores. Recorte ele e cole no bloco de notas, usaremos depois.

3. Agora procure pela primeira linha de:

  <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>


E recorte o codigo todo!
O código acima representa os comentários. Recorte ele e cole no bloco de notas, usaremos daqui a pouco.

Agora já conseguimos todos os códigos necessários, certifique-se que você RECORTOU e não somente COPIOU . Se apenas copiou, o autor, as tags e os comentários vão aparecer duas vezes.

Procure por <div class='post-header-line-1'/> e cole os 3 códigos abaixo dela. 

Visualize . Tudo ok? Perfeito! Só falta enfeitar . Se não está, repita novamente as etapas com cuidado.

As barrinhas "||" são a parte mais fácil.  Coloque elas depois de cada </span> dos 3 códigos .

Você pode separar com outras coisas como - ou ♥, a escolha é sua.

Agoras as linhas pontilhadas e tals:

Procure por h3.post-title {  vai haver alguma código abaixo, depois que ele termina, vai aparecer um } e é depois desse } que você vai colar isto:

.post-header, .dados {
    border-top: 1px dashed #ccc;
    border-bottom: dashed 1px #ccc; /*cinza*/
    padding: 1px 0 1px 12px; /*espaço topo direita baixo esquerda/*
    margin: 0;
    border-bottom: 1px dashed #ccc; /*cinza*/
    text-align: center;
    }

 Salve e visualize, ^^
Tirei este tutorial do Kawaii World, Obrigada Kawaii!

11 comentários:

  1. Obrigada flor, me ajudou muito.
    Tem um tag para vc lá no blog.

    Bjs
    http://mar-de-glitter.blogspot.pt/

    ResponderExcluir
  2. Hello☆
    Bom, a pergunta que vc fez no meu blog q e como colocar o player no blog. Entao, eu peguei esse tutorial no blog⇒ http://annyz-kawaii.blogspot.com.br/2012/03/cute-mp3-player-blog.html Esta tudo escrita em espanhol, mas e facil entender♪

    Alguma duvida, fale comigo♪

    candylinee.blogspot.com

    ResponderExcluir
  3. Flor, eu tentei fazer o tuto, mas quando vou visualizar ele diz que a formatação html está errada..! oq eu faço?
    responde no meu blog, pleas
    www.mundomaniateen.blogspot.com
    beijs.
    Cacau

    ResponderExcluir
    Respostas
    1. Confere ai se você não recortou além do necessário, se não for isso, não sei o que fazer ! :c

      Excluir
  4. Obrigada,tentei vários outrou tutoriais desse mas o seu foi o único que deu certo :)
    alemdglitter.blogspot.com.br

    ResponderExcluir
    Respostas
    1. Que boom que gostou ! *-* Fico super feliz, beijão!

      Excluir
  5. Obrigada!!
    Você me ajudou muitooo @@!!
    O tutu é super legal, achei eles em outros blogs mais eles não explicam tão direitinho como você!!
    EU amei seu blog ele é super fofinho!!!!
    ADorei. SEguindo aqui segue de volta??
    Beijinhos Emilia.

    coffemilia.blogspot.com ♥

    ResponderExcluir
    Respostas
    1. Denada! asuhasuash , Poxa *-* estou super feliz que tenha gostado, estou seguindo de volta ok! Beijõoooooes ! hauahuah

      Excluir

Seja educado.
Poder pedir postagens, e sugestões são bem vindas
Obrigada e volte sempre