A Beatriz pediu-me para ensinar a adicionar o widget de comentários do Facebook no Blogger e aqui estou eu, com um novo tutorial, pronta a ajudar-vos.Embora este tutorial tenha alguns passos a seguir, não é de todo um bicho de sete cabeças. Vou tentar explicar tudo direitinho, dividindo por categorias os passos a tomar, e se seguirem tudo à risca não devem ter nenhum problema a fazer esta instalação. Vamos começar?
Info: Este tutorial é apenas para Bloggers que usam a plataforma Blogger.com
Criar uma app no Facebook
Pode parecer estranho, mas é necessário criar uma app no facebook para conseguir utilizar os comentários no vosso blog.
1º Passo Para isso só precisam de ir à página do Facebook, na barra de menu do lado esquerdo vão encontrar a opção "Gerir Aplicações".
2º Passo Ao clicar nesse botão vão ser redireccionados para a página "Facebook for developers".
Cliquem no botão verde que diz "+ Add a New App".
3º Passo Preencham o formulário com o vosso nome e um endereço de e-mail. Quando terminarem cliquem em Create App ID. (Escrevam o captcha para provarem que não são robôs)
4º Passo Ao carregar nesse botão vão ser direccionados para uma página da vossa app. Tudo que vamos precisar daí é apenas o vosso App ID que se encontra do lado direito do nome da vossa app. Deixem essa janela aberta, vamos precisar desse ID futuramente, e passem para o próximo passo.
Adicionar código Base
Para adicionar o código html ao vosso blog têm de ir à página Tema (no Blogger.com), e clicar em Editar Html.
1º Passo No início do vosso código (deve estar logo nas primeiras linhas) existe um texto que diz
Coloquem logo a seguir este código no final deve ficar algo como:
2º Passo Agora cliquem na caixa com o código html (qualquer sítio) e cliquem nas teclas CTRL + F, para abrir uma janelinha de pesquisa no canto superior direito dessa caixa.
Na caixa ao lado da palavra Search escreve o seguinte código e pressiona no enter para pesquisar.
3º Passo Vais encontrar no meio de todo o código a zona do body. Logo a seguir à frase do body que eu sublinhei coloca logo a baixo o seguinte código.
Substitui onde diz ID (5º Linha) (apenas as letras ID), pelo ID da tua app que criaste no início deste tutorial.
O meu ID é o 1927434620866017, vê onde o coloquei na imagem a baixo.
4º Passo Agora vamos pesquisar outro código no nosso código de html, cliquem nas teclas CTRL + F e na janela de pesquisa escrevam (ATENÇÃO! é o HEAD não é o HEADER)
Logo a seguir a esse código que encontraste coloca este código:
Substitiu na terceira linha o meu ID pelo teu, substitiu na quarta linha o LovableMaria pelo o nome do teu blog e substitiu o meu link do facebook pelo teu.
Posicionar o widget
Está quase, prometo! Se vocês guardarem o vosso código agora nada vai acontecer no vosso blog, porque é agora, neste último passo que a magia acontece.
1º Passo Posicionar o comentário no vosso blog vai depender do vosso gosto, mas se quiserem colocar os comentários da forma como os tenho agora no blog é só preciso ir ao vosso código html, clicar em CTRL+F, na janela de pesquisar procura por
Agora vem a parte um bocado mais complicada para quem não entende nada de código, depois desse código que procuraste, umas 24 linhas para baixo vais ver um div e um b includable. Vê a imagem abaixo. (Atenção: Se por acaso não encontrares este código troca o número 3 por um 1 e coloca logo a seguir a esse código. (Coloca no segundo código que encontrares, existem dois)
Entre o div e o b includable, encontras na imagem uma zona a vermelho, aí vais colar o código que te vou colocar aqui em baixo:
Eu coloquei a minha largura a 600 px, mas se ficar muito grande para vocês mudem esse número onde diz width. Podem ver o código colocado no html aqui em baixo:
E é só isso! Yeah! Prometo que é mais difícil explicar que fazer ahah
Boas edições e até ao próximo post!
0 Comments