14 de jun de 2012

tutorial sobre como colar postagens relacianadas + como colocar balão de comentários!


1º lugar retirei todos esses tutoriais do blog da jackie: http://isjackiezzdream.blogspot.com.br
qualquer pergunta vá a esse blog

tutorial como colocar "postagens relacionadas":

você pode ter no seu blog esse tipo de quadro "postagens relacionadas" no seu blog:
 acesse o site linkwithin >clique aqui<
1° Coloque seu email
2° O endereço do seu Blog
3° Plataforma que você usa( no meu caso é Blogger)
4° A quantidade de miniaturas  .
http://i11.photobucket.com/albums/a168/evelynregly/minigifs/miniok.gif Se o seu Blog tem o fundo escuro, marque a opção, se não tiver é só não marcar nada como mostra a imagem acima!

feito tudo isso clique em GET WIDGET, e será redirecionado a uma página semelhante a essa:
Clique em Install Widget e será novamente redirecionado a uma nova página semelhante a essa:
1° se você tem mais de um blog selecione o desejado para o Widget
2° Coloque o titulo
3° clique em ADICIONAR WIDGET  

Faça como nas imagens abaixo

e agora como colacar um balao de nº de comentarios:
         
como é colocar um balãopersonalizado com o número dos comentários.  Ficará mais ou menos assim:

vá no seu HTML marque a opção expandir modelos de widgets  pressione as teclas CTRL F e pesquise por:                        <class='post-title entry-title'>  
Se não encontrar pesquise por:     <b:includable id='post' var='post'>    

 Então coloque esse código logo abaixo, do código destacado (de laranja)

<span class='post-comment-link-arriba' style='background: url(http://i.imgur.com/lfGb2.jpg) no-repeat top right; width:90pxheight:80px; text-align:center; float:right;padding-top:19px'>
<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 <b:else/><data:post.numComments/></b:if></a>
</b:if>
</span>


Ficando assim: 
          
 Trocar a imagem do balão no trecho: (http://i.imgur.com/lfGb2.jpg) apague e coloque a URL da imagem desejada (só apague onde está grifado de azul)

Algumas imagens do blog da Jackie:
                

''Para pegar a URL de uma imagem é só clicar com o botão direito do mouse sobre ela e selecionar a opção COPIAR URL DA IMAGEM''
fonte ou mais informações: http://isjackiezzdream.blogspot.com.br



Nenhum comentário:

Postar um comentário

Leia Também !!!!

Related Posts Plugin for WordPress, Blogger...

Total de visualizações de página