sexta-feira, 26 de julho de 2013

Tutorial: Como colocar o Botão Curtir nas postagens do Blog


Olá, leitores queridos!


Bom, gente, tive muita dificuldade pra encontrar um TUTORIAL completo, claro e que funcionasse no novo Blogger explicando como colocar o botão Curtir do Facebook nas postagens aqui do blog. Por esse motivo, decidi criar meu próprio tutorial e ajudar quem também precisar! Vamos lá!


· No seu Blogger (não é no blog) clique em:

> Modelo

É aconselhável que antes você faça um backup do seu template clicando em 
Reverter/Fazer Backup (no topo da página, do lado direito).

· Depois de fazer o backup do template, clique em > Editar HTML.

· Agora, clique em qualquer lugar do código e, usando a caixa de busca (Ctrl+F), procure por:
<div class='post-header-line-1'>



Se você não encontrar, procure pelo mesmo código, só que com a barra no final:
<div class='post-header-line-1'/>

ATENÇÃO! Em alguns casos aparece esse código duas vezes, o certo é o segundo!


OBS: Para adicionar o botão no FIM DA POSTAGEM você deve procurar por:
<P class='post-footer-line post-footer-line-1'>
(Se não encontrar, tente com a barra no final, antes do >)

· Na frente desse código, copie e cole um dos códigos abaixo, dependendo do tipo de botão curtir que você escolher!

São eles:

Botão Curtir do Facebook com contador - Vertical

<b:if cond='data:blog.pageType != &quot;static_page&quot;'> <iframe allowTransparency='true' expr:src='&quot;http://www.facebook.com/plugins/like.php?href=&quot; + data:post.canonicalUrl + &quot;&amp;send=false&amp;layout=box_count&amp;show_faces=false&amp;width=55&amp;action=like&amp;font=arial&amp;colorscheme=light&amp;height=62&quot;' frameborder='0' scrolling='no' style='border:none; overflow:hidden; width:55px; height:62px;'/> </b:if>


Botão Curtir do Facebook com contador - Horizontal

<b:if cond='data:blog.pageType != &quot;static_page&quot;'> <iframe allowTransparency='true' expr:src='&quot;http://www.facebook.com/plugins/like.php?href=&quot; + data:post.canonicalUrl + &quot;&amp;send=false&amp;layout=button_count&amp;show_faces=false&amp;width=90&amp;action=like&amp;font=arial&amp;colorscheme=light&amp;height=21&quot;' frameborder='0' scrolling='no' style='border:none; overflow:hidden; width:90px; height:21px;'/> </b:if>


Botão Curtir do Facebook sem contador

<b:if cond='data:blog.pageType != &quot;static_page&quot;'> <iframe allowTransparency='true' expr:src='&quot;http://www.facebook.com/plugins/like.php?href=&quot; + data:post.canonicalUrl + &quot;&amp;send=false&amp;layout=standard&amp;show_faces=false&amp;width=450&amp;action=like&amp;font=arial&amp;colorscheme=light&amp;height=35&quot;' frameborder='0' scrolling='no' style='border:none; overflow:hidden; width:450px; height:35px;'/> </b:if>

· Prontinho! Seus seguidores já podem curtir todas as postagens maravilhosas que vocês preparam pra eles!!


FONTES:
http://www.redeseblogger.com/2012/08/como-adicionar-o-botao-curtir-dentro-das-postagens-do-blogger.html#.UfHW_Y3VA6k

http://www.meublogdicas.com.br/2013/05/como-adicionar-o-botao-curtir-do-face.html

56 comentários:

Deixei Florir disse...

Finlmente consegui encontrar um tutorial descente. Parabéns pela dica, valeu muito!!1

Unknown disse...

Enfim um tuto q deu certo.... adorei!!!!

Alex Alves disse...

valeu !! :)

Maquina do Tempo disse...

n consegui achar esse código :(

Unknown disse...

Pela primeira vez um tutorial que funciona!!! Já tinha tentado diversas vezes sem sucesso, finalmente consegui!

Obrigada, um beijo e um abraço ;)

Unknown disse...

Parabéns pela simplicidade e objetividade que postou esta dica, me ajudou muito. Forte abraço.

Unknown disse...

Não achei esse código no meu blogger.

Alaide Chaded disse...

Oi amiga, o meu ficou acima da postagem, que fiz de errado? Boa noite!

Stéfani Farias disse...

muito obrigada, até q enfim encontrei um alguém que ensine fácil
Amei o blog bjoss

www.pessoafashion.blogspot.com

Anônimo disse...

Cara, tenho que te agradecer MUITO!!!
Tô fazendo sozinha o layout do meu blog e tava pesquisando links de curtir postagem e não achava em lugar algum. Fui em mais de 15 blogs e os links não funcionavam.
Muito obrigada!

geek azores disse...

O meu não tem esses códigos

RÔMULO VIANA disse...

Depois de muito tentar, finalmente consegui. E aproveitando a oportunidade achei muito interessante a descrição que vc faz de si mesma.

Anônimo disse...

muito obrigado!!

Anônimo disse...

Valeu aqui deu certo

adm disse...

Dica super pratica. Parabéns! Valeu! Muito Agradecido pela ajuda!

Unknown disse...

muito bom gostei

Unknown disse...

Nessa página, você pode escolher o modelo do seu botão! ;D

https://developers.facebook.com/docs/plugins/like-button

Página Marcada disse...

Aqui foi o único lugar que consegui entender como fazer! Ficou maravilhoso! Obrigada!

J. disse...

Cara, MUITISSIMO obrigada! Fiquei quase um mês nessa peleja pra conseguir colocar esse bendito botão e só você conseguiu me ajudar! Valeu mesmo!

Beatriz Almeida disse...

Ótimo tutorial, me ajudou hein. Parabéns

Izabelle Sonyara disse...
Este comentário foi removido pelo autor.
Izabelle Sonyara disse...

Não consegui achar os códigos...

Yuri Ferro disse...

Muito bom! Obrigado, moça!

Blog Dona Ingrid disse...

Linda!

Obrigada!

Já consegui!

*Blog Dona Ingrid*

Interage ITTI disse...

Muito obrigado!!! Parabéns pelo trabalho. :-)

Ana Duarte disse...

Olá Michelly, então eu fiz exatamente como você explicou só que no meu blog não aparece nada , não sei se é porque para mim não deve aparecer :/

o link dele é http://www.makemodaeinspiracao.blogspot.com.br/

Unknown disse...

finalmente achei um que deu certo ,obrigado

Unknown disse...

Adorei, e já consegui colocar no meu! Obrigada!
http://classicomulher.blogspot.com.br/

Cielly Gouveia e Pâmella Paranhos disse...

segue o meu blog, que eu sigo o seu!
www.kychique.blogspot.com

Unknown disse...
Este comentário foi removido pelo autor.
DuDa. disse...

Pleeeease!!! Socorro!!!! Achei esse seu o mais facil de entender mas nao estou conseguindo!!!

Maria Rodrigues disse...

Adorei, consegui colocar de primeira, valeu pelo tutorial. Parabéns!
Bjos, Mari.

http://www.studioartecasa.com.br/

Casa do Inspetor disse...

Muito boa sua dica parabéns

Unknown disse...

Valeu Michelly muito obrigado a minha ficou em todas as postagens na página inicial do meu blog, vejam:http://igorsantanaribeiro.blogspot.com.br/

Abraço!

Gjr Darco disse...

obrigado.

Unknown disse...

muito bom o tutorial deu certinho veja no meu blog como ficou
http://tchellofilmestorrent.blogspot.com.br/

Obrigado!

João Guilherme Carte disse...

Muito obrigado! me ajudou muito!

FlangoTetudo disse...

nossa obrigado msm me ajudo muito :)

Ana Cristina disse...

Muito obrigada pela ajuda!!!!!

Esta Pessoa é uma Bagunça disse...

Ainda não consegui, quando procuro o código que você falou não o encontro! :/ !

Já seguindo, se puder segue de volta!

http://vestida-de-rosa.blogspot.com.br/

Unknown disse...

Encontrei os códigos, mas não ficou. :\

rfonlineguiaBR disse...

Não funcionou no meu :/

Unknown disse...

Muito obrigado ajudo muito esse post. estava procurando a tempos isso.

Tamiris Sindice disse...

Obrigada!

www.tamirissindice.com

Unknown disse...

infelizmente não achei nenhum desses códigos :(

Douglas Guimarães disse...

você utiliza esse código? no meu precisa confirmar a curtida, no seu não, sabe porque?

Laís Sousa disse...

E como coloca "compartilhar"?

Unknown disse...

O Meu não deu Certo :(

Unknown disse...

o meu não deu certo, fiz tudo como no tuto, mas não apareceu nenhum botão.............. help me.............
http://recicleedesignartesanato.blogspot.com.br

Beleza Mariê? disse...

muito obrigada!!!!

CarlosProg disse...

No meu deu certo logo de primeira, desde ontem que estava pelejando com isso! Obrigado!!

Unknown disse...

Seu tutorial me ajudou muito, apesar de eu ter lido direto da fonte. O seu foi mais esclarecedor. Obrigado!

Unknown disse...

Olá galera, este post me ajudou más encontrei um tutorial mais completo!
http://www.digatech.com.br/2015/08/como-adicionar-o-botao-curtir-e-a-fanpage-do-facebook-ao-meu-blogger.html
Tá ai o link. Até mais!!

Acnologia disse...

vlw você me ajudou pra caramba

Unknown disse...

Muito obrigada, flor. Me ajudou muito!

http://sefosseprimavera.blogspot.com.br/

ClickMais Grafica & Convites disse...

Não achei o codigo

Postar um comentário

Template by:

Free Blog Templates