Boa noite pra vocês, vocês já devem ter se perguntado como fazer pra colocar os comentários no blog né mesmo? pois então vou postar aqui um tutorial pra vocês poderem usar em seus blogs. cliquem em leia mais pra ver o tutorial.
Para quem não sabe, irá ficar assim:
1- Primeiro vá em Painel de controle, depois em Designer e em seguida clique em Editar HTML e então marque a opção expandir modelo de Widgets. Depois de ter feito isso, clique em Ctrl + F no seu teclado, e irá aparecer uma caixinha de busca, então procure pelo seguinte código:
<div class='comments' id='comments'>
2- abaixo dessa linha acrescente esse código:
<div class='comments-tab' id='fb-comments' onclick='javascript:commentToggle("#fb-comments");' title='Comentários no Facebook'>
<img class='comments-tab-icon' src='http://static.ak.fbcdn.net/rsrc.php/v1/yH/r/eIpbnVKI9lR.png'/>
<fb:comments-count expr:href='data:post.url'/> Comentários
</div>
<div class='comments-tab inactive-select-tab' id='blogger-comments' onclick='javascript:commentToggle("#blogger-comments");' title='Comentários no Blogger'>
<img class='comments-tab-icon' src='http://www.blogger.com/img/icon_logo32.gif'/> <data:post.numComments/> Comentários
</div><div class='clear'/>
</div>
<div class='comments-page' id='fb-comments-page'>
<b:if cond='data:blog.pageType == "item"'>
<div id='fb-root'/>
<fb:comments expr:href='data:post.url' num_posts='2' width='400'/>
</b:if>
</div>
<div class='comments comments-page' id='blogger-comments-page'>
O número em vermelho você irá determinar a largura do formulário de comentários do Facebook. Só altere esse número se você souber a medida do espaço que tem para os formulários.
3- Agora procure pela seguinte tag:
<head>4- Logo abaixo cole esse código:
<script src='http://connect.facebook.net/pt_BR/all.js#xfbml=1'/>5- Agora salve tudo, e depois procure pela seguinte tag:
<script src='http://code.jquery.com/jquery-latest.js'/>
<meta content='YOUR_FB_ID' property='fb:admins'/>
<script type='text/javascript'>
function commentToggle(selectTab) {
$(".comments-tab").addClass("inactive-select-tab");
$(selectTab).removeClass("inactive-select-tab");
$(".comments-page").hide();
$(selectTab + "-page").show();
}
</script>
]]></b:skin>
6- Logo acima dela, cole esse código:
.comments-page { background-color: #FFFDF2;}Entenda:
#blogger-comments-page { padding: 0px 5px; display: none;}
.comments-tab { float: left; padding: 5px; margin-right: 3px; cursor: pointer; background-color: #FFFDF2;}
.comments-tab-icon { height: 14px; width: auto; margin-right: 3px;}
.comments-tab:hover { background-color: #F5FCFE;}
.inactive-select-tab { background-color: #FFFDF2;}
Em amarelo é o fundo da área do comentário.
Em verde é a cor do botão Facebook, Comentários.
Em azul é a cor do botão quando passar o mause em cima.
Em Roxo é a cor do botão quando selecionado.
Agora salve clicando no botão laranja, e pronto. Agora já está funcionando o seu novo modelo de formulário de comentários, integrando Blogger e Facebook ao mesmo tempo.
Observações: Para funcionar perfeitamente, recomendo que escolha a opção de moderar comentários do Blogger e retire a verificação de palavras.
Não é possível, segundo esse modelo, moderar os comentários feitos no Facebook.
Créditos: Ferramentas Blog
Por:
6 Comentários
adoreeeeeeeeeei saber disso :O
ResponderExcluirbeijoss
www.portefeminino.blogspot.com
Muito bacana este sistema néah!!!
ResponderExcluirfacilita a vida da gente..
Estou seguindo acabei de montar um blog
ajuda seguindo??
http://momentsofteens.blogspot.com.br/
AAAI VOU USAR***** QUE MASSA
ResponderExcluirTO SEGUINDO AKII PODERIA RETRIBUIR A VISITA ?
http://bellalautner.blogspot.com.br/
Esse tutorial serve para wp?
ResponderExcluirAi finalmente achei um tutorial que funcione!
ResponderExcluirProcurei tanto por ele, valeu *---------*
Beijinhos~~> Unicorns of Plush
O tutorial é muito bom, super bem explicado ^^
ResponderExcluirFiz no meu blog e deu super certo :33
1-maginer.blogspot.com