Este tutorial ensina a configurar e implementar o plugin social de atividades de feeds da rede social Facebook em seu site. Importante pegar a URL do feed corretamente. Saiba mais…
Página do “Facebook Social Plugin” de atividades de feeds (Aqui é a página do plugin de feeds citado neste tutorial )
Olá, leitor do NuvemSEO, o Facebook quer dominar a web. Novas reformulações no site e novas opções dinâmicas tem dado à rede de Zuckerberg muito mais atração e interação.
Fazer login no Facebook em quaquer site da web, através de um botão (plugin) especial, virou praxe, inserir plugin de fãs (Página de fãs do Facebook) em sidebars de blogs é relevante, não deixaríamos de lado então, uma interação importante como um “stream” dos feeds de atividades da sua home no Facebook.
O que o plugin faz em meu site?
O plugin de feeds exibe as atividades mais recentes e interessantes, dentro de seu site. Como o conteúdo é oferecido pelo Facebook, o plugin pode exibir conteúdo personalizado ou não, isso depende se o usuário está logado ou não no site social.
O “stream” de atividades mostra o histórico de alimentação dos feeds, tanto dos usuários quanto do conteúdo do seu site, quando compartilham conteúdo de seu site no Facebook.
Quando um usuário está logado no Facebook, o plugin personaliza e destaca o conteúdo de seus amigos. Se o usuário estiver off line, ele mostra todos os feeds de atividades do conteúdo do seu site, e oferece ao usuário a opção de de fazer login para o Facebook.
O plugin é preenchido com as atividades dos amigos do utilizador. Se não houver atividades de amigos, ele será preenchido por todos usuários.
Se você definir o parâmetro recomendações para true, o plugin é dividido ao meio, mostrando atividade amigos na metade superior, e as recomendações na metade inferior.
Se não houver atividade amigos o suficiente para encher a metade do plugin, ele incluirá mais recomendações.
Obs: Não é permitido agregar vários domínios!
Veja como configurar e adicioná-lo em nosso site ou blog, siga:
- Domain – Aqui você coloca o domínio de seu site ou blog sem o “http”.
- Width – Largura. Isso é a largura da div que aparecerá no seu site. Por padrão vem 300px, mas você poderá definir um valor que ajusta à sua barra do lado ou outro local. A minha defini com 180px. Não precisa pôr px, somente o valor;
- Height – Altura. Aqui você define altura do widget. Vem com valor 300, mas você definir um valor personalizado;
- Header – cabeçalho. Se você marcar a caixa ele mostra um cabeçalho assim: “Recent activity“. O meu não marquei;
- Color scheme – Esquema de cores. São duas opções, “Light” e “dark”. Claro e escuro. Fundo branco ou fundo preto;
- Font – Estilo de letra. Aqui você escolhe o tipo de letra, Verdana, Arial, Tahoma, etc;
- Border color – configura o código exadecimal do CSS. Ex: #336699 (azul), #000000 (preto), etc.
Agora, depois de configurar seu widget social de atividades de feeds do Facebook e dar uma conferida, você vai clicar em “Get code” para gerar o código, que irá inserir no código da sua página.
Obs: Não feche a página do Facebook com o código e configurações do plugin, pode ser que você tenha que revisar alguma coisa…
Obs: Veja a nota no rodapé da imagem: XFBML é mais flexível que “iFrames”, mas requer o o uso de SDK Javascript. Portanto, utilize o código de “iFrames” mesmo! Mais simples!
Para inserir, você pode colocá-lo diretamente no código HTML do seu site ou blog, ou através da opção widget, como a oferecida no CMS WordPress.
Depois de implentar o código, atualize seu site e veja como ficou, se deu tudo certo, parabéns! Caso não saia belezinha, volte e faça uma revisão e boa sorte!
SRC: Facebook



30 Comentários recebido(s)
abril 25th, 2010 @21:43
Valeu, pelo comentario no meu post e pela visita. Muito legal o seu blog. Dicas e assuntos interessantes! Abraços!
abril 25th, 2010 @22:14
Obrigado a você, Vincent, pelo comentário aqui no NuvemSEO e teu site de altíssima qualidade! Abração!
dezembro 18th, 2010 @10:02
Muito bom, fiz ontem um facebook para a empresa mas já vi que foi uma decisão muito acertada, tendo em vista as diversas possibilidades que o site oferece.
Paulo
dezembro 18th, 2010 @16:56
Primeiro parabens pela sua pagina que é muito bem explicativa.
Segundo, nao estou conseguindo efetuar todo o processo devido a minha pagina do facebook estar personalizada ou seja esta assim:
http://www.facebook.com/sandracantii nao aparece aquele codigo ID.
Será que é por isso que nao estou conseguindo ?
Me oriente por favor
Obrigada
sandra cantii
dezembro 20th, 2010 @8:51
Paulo, é sim, muito obrigado pelo seu comentário!
dezembro 20th, 2010 @9:21
Sandra, primeiro, obrigado pelo “parabéns”, em segundo ja verifiquei e vi mesmo que sua URL não contem o ID de feeds e sim o nome personalizado. Assim, tente inserir o URL personalizado e configure assim mesmo, salve o código e insira na sua página. Acompanhe se vai atualizar como esperado no seu blog, caso não…vamos tentar conseguir o URL com o ID. Obrigado pelo comentário!
março 5th, 2011 @10:08
Olha, não entendo muito pra não dizer nada de FaceBook e redes sociais, mas olha, ou eu sou muito burro ou o negócio é complicado mesmo.
O que eu quero é ter um esquema do faceboo na minha página igual ao que tem neste site. Já pesquesei e não entendi praticamente nada. Se alguém puder me ajudar, ficarei muito grato. No facebook eu tenho o Pierre Gil e criei o asadeltasul.
março 5th, 2011 @20:29
Olá, Pierre, não é que você é burro cara, acho que você apenas não está conseguindo expressar o que você realmente deseja, pelo memnos aqui agora. Quando você diz “O que quero é ter ‘um esquema do Facebook’ na minha página igual neste site, a que se refere? Tenho botões like do Face aqui, botões sociais, você está se referindo à “Caixa de amigos” ou caixa de fãs? Então, se for, a caixa de fãs é configurada lá na página de plugins do Facebook(tem o link no post sobre o assunto aqui), e em seguida é gerado um código, o qual você deve copiar e colar no local da sua página(html), ou seja, onde deseja que pareça a caixa de fãs. Se fez e não deu certo, leia com atenção e segue passo a passo que dá certo. Porém, essa página que você comentou não é a página com o tutorial que ensina pôr a ‘caixa de fãs’ do Facebook no seu site.
O artigo é este, visite tente: http://www.nuvemseo.net/como-colocar-a-caixa-de-fas-do-facebook-no-site-like-box Obrigado por comentar aqui viu, Pierre, abraço amigo!
março 16th, 2011 @11:03
Olá,
Estou com uma dúvida, gostaria que no meu site mostrasse as minhas mensagens e quando estiver off, mostrar os comentarios dos meus amigos… seria possivel ?
março 16th, 2011 @17:15
Olá, Leandro, acho que assim não tem jeito não viu, é o que acho, e também os plugins do Facebook interagem quando estão logados…Obrigado pelo seu comentário!
junho 7th, 2011 @13:39
Po não consigo por nada nesse mundo!
Já coloquei a janela certinha mas não sei o endereço certo pra vincular com meus feeds!
Alguem me ajuda por favor!
alissoncruzguedes@msn.com
junho 8th, 2011 @8:39
Olá, Alisson, eu esclareci lá no post, favor leia novamente. A URL é da sua página inicial do facebook, no topo do face clica em Página Inicial e não em Perfil. Estando em Página Inicial/feeds de notícias pegue esse URL no navegador e cole lá na caixa de configuração. Obrigado pelo comentário!
junho 12th, 2011 @10:27
Olá, gostaria que me ajudasse, eu tentei colocar o plugin do facebook no meu blog mas nao deu muito certo, poderia por faavooooor dar uma olhadinha no meu blog e ver como ficou, queria muito deixar como está no seu, aparecendo as fotos e o nome do meu blog em cima, nao consegui deixar assim, me ajuda please
junho 13th, 2011 @8:23
Olá, Talyta, visitei seu blog, bacaninha, só não vi a caixa do Facebook, vc a tirou? Obrigado pelo comentário!
junho 13th, 2011 @10:36
Por nada consigo achar esse endereço que mostre meu mural, por nada! Já tentei todos que aparecem em todas páginas e não tive sucesso! Com certeza ele está oculto…. :/
junho 13th, 2011 @11:49
Olá, Alisson, visitei seu blog, onde está o widget do Facebook? Você tem certeza que quer colocar uma caixa de feeds das atividades? E não uma caixa de fãs? Obrigado pelo comentário!
junho 15th, 2011 @9:49
Não tinha colocado no ar ainda, estava testando pelo meu PC.
Agora coloquei para que dê uma olhada.
O melhor que consegui foi isso colocando no facebook no domain o endereço do meu própio site “www.djapolo.com.br”
Esse é o meu facebook:
http://www.facebook.com/profile.php?id=100002547249186
Obrigado cara pelo suporte!
Queria muito que aparecesse meus posts do face no site
Ficaria bem dinamico!
Obrigado novamente!
junho 15th, 2011 @15:20
Olá, Alisson, isso insira o dominio sem o “http”, agora espere as atividas acontecerem ou você mesmo compartilhe algo, para que o plugin comece a mostrar interações!Por não utilizá-lo, estava apanhando com o campo domínio também. Obrigado pelo comentário!
setembro 6th, 2011 @10:44
Ola,
Tentei colocar o plugin social do facebook no meu blog, mas não deu certo.
Onde se domain, tentei colocar sem o http mas mesmo assim não deu certo, aparece a mensagem:Could not retrieve id for the specified page. Please verify correct href was passed in
Sabe me dizer o por que?
obrigada
setembro 6th, 2011 @16:20
Olá, Renata, o problema é com a URL mesmo. Qual URL(href) você inseriu? Não pode colocar o protocolo “http”, senão não dá certo! POnha assim: Ex: seusite.com. Obrigado pelo comentário!
setembro 21st, 2011 @16:33
Olá… Tenho uma fan page no facebook: http://www.facebook.com/mucken.digital.
Queria que as postagens que faço nessa página também apareçam no meu site: http://www.mucken.com.br.
Tem um exemplo bacana nesse site >> http://www.agenciapic.com.br <<
Gostaria de algo parecido.
Obrigado pela atenção.
setembro 22nd, 2011 @10:33
Olá, Rodrigo, uma maneira que o Facebook oferece para que feeds são inseridos em sites externos, é com o uso do ‘Plugin social feeds’. Veja tutorial ensinando a implementar: http://www.nuvemseo.net/tutorial-plugin-social-feeds-facebook-no-meu-site. Assim o que rola novidades entre seus circulos de contatos, elas aparecem nos sites. Mas parece que você está querendo é outra coisa.
Observe que todos aquelas notícias no site que você citou como referência, estão linkando para o mesmo link, ou seja, o link da Fan Page deles. E conferindo lá, na fan page deles, notei que tem várias notícias de fontes externas diversas. Umas são da mídia web em geral, outras do próprio site, etc. Se existe algum outro código ou plugin que consegue pegar suas postagens na Fan Page e exibí-las em seu site, como o deles, eu desconheço, Rodrigo. Obrigado pelo comentário!
setembro 23rd, 2011 @17:39
Em que parte do HTML eu devo colocar o código?
setembro 26th, 2011 @11:08
Olá, Neko, o local no layout da página, você escolhe, tipo na barra do lado ou outro lugar. Agora no código, se for blog tipo WordPress ou Blogger, é só inserir uma caixa de texto no Blogger ou WordPress, colando o código do plugin e salvando. Seja qual for o local escolhido no layout, o ‘snippet’(trecho de código) do plugin vai ficar sempre depois da tag ” e antes “. Normalmente vai entre uma DIV(
).Obrigado pelos comentários!
outubro 6th, 2011 @15:24
Estou programando um site para um cliente e quero colocar os plugins do facebook. O erro está na configuração da página do facebook, onde vc fala que é para tirar o http.
Fiz tudo que é teste e a página não é reconhecida.
Quando vc pede para clicar na página inicial do facebook abre o seguinte endereço; http://www.facebook.com/igrejamiranda#!/
no perfil do cara é http://www.facebook.com/igrejamiranda
O que é que eu coloco ao certo então e fazer com que abra o plugin?
O site para visualização do erro é http://devilspeed.org/~periperi/Portal2/
Agradeceria muito se fosse respondida porque ja perdi o dia inteiro tentando solucionar e não consigo.
At. Simoni Lopes
outubro 10th, 2011 @16:17
Olá, Simoni Lopes, no campo ‘Domínio’, você coloca o URL do seu site e não da página de fãs, ok? Sem o protocolo http, com http:// não dá certo. Você forneceu um URL de um site que está fora do ar, suspenso. Mas faz isso, coloque o endereço do site que deseja que apareça os feeds nele, qualquer coisa volte aqui!Obrigado pelo comentário!
outubro 18th, 2011 @8:59
Maneiro!!!
Parabéns pelo post…
Abraços!
outubro 18th, 2011 @14:29
Olá, boa tarde, Heber! Funcionou contigo? Muito obrigado pelo seu comentário amigo! Abraços!!
outubro 18th, 2011 @21:14
Olá Alvimar, valeu, deu certo o sistema ja foi replicado e está visivel. Ainda não terminei o projeto, mas vc pode dar ujma olhada no site. Encontra-se no lado direito da url, praticamente em todas as paginas.
Abraços e agradeço a dica
At. SI
outubro 19th, 2011 @8:31
Olá, Simoni, bom dia! Ah, então tá ótimo, valeu pelo comentário amigo! Sucesso nos projetos! Abraços!!
Participe comentando!