13 de ago. de 2011

3 tutoriais em um!



Sabe o final da postagem, que tem aquele "postado por", "marcadores" e "comentários? Bom, hoje vou encinar a vocês colocarem uma imgem do lado da escrita, como pode ver na imaem abaixo:


Primeiro de tudo, entre em sua conta do blogger > Editar HTML.
Fez isso? Então vamos lá!

Colocar imagem no link "postado por": 

Antes de começarmos a mecher no HTML, aperte a caixinha "Expandir modelos de widgets
Depois disso aperte ctrl + F e pesquise por:
          <b:if cond='data:top.showAuthor'>

Quando encontrar o código, do lado dele adicione o seguinte código:
         <img src='URL DO MINE GIF' style='border:0px;'/>

Ficando assim:
        <div class='post-footer'>    <div class='post-footer-line post-footer-line-1'><span class='post-author vcard'>        <b:if cond='data:top.showAuthor'><img src='URL DO MINE GIF' style='border:0px;'/>          <data:top.authorLabel/>

Visualize, ficou direitinho? Então vamos para o próximo tutorial:

Colocar imagem no link "marcadores":

Sem tirar a opsão "Expandir modelos de widgets" , aperte novamente Ctrl + F e pesquise por:
              <b:if cond='data:post.labels'>

E novamente, achando este código, adicione este ao lado dele:
              <img src='URL DO MINE GIF' style='border:0px;'/>

Ficando assim:

<div class='post-footer-line post-footer-line-2'><span class='post-labels'>        <b:if cond='data:post.labels'> <img src='URL DO MINE GIF' style='border:0px;'/>          <data:postLabelsLabel/>


       Visualizou? Ficou legal? Vamos agora para o ultimo tutorial:

Colocar imagem no link "comentários":

Novamente, não tire a opsão  "Expandir modelos de widgets" , aperte novamente Ctrl + F e pesquise por:
            post-comment-link'>

ABAIXO dele coloque o seguinte código: 
           <img src='url da sua imagem' style='border:0px;'/>

Ficando assim: 

</span> <span class='post-comment-link'><img src='url da sua imagem' style='border:0px;'/>        <b:if cond='data:blog.pageType != &quot;item&quot;'>

OBS: As escritas e Azul você substitui pela imagem do guif que você quer colocar do lado da imagem.   
Agora visualize, Ficou legal? Salve! Se não gostou, Aperte em "limpar edisões"

      



Nenhum comentário:

Postar um comentário