Publicações incorporadas
As publicações incorporadas são uma maneira simples de colocar publicações abertas (de uma Página ou pessoa no Facebook) no conteúdo do site ou da página da web. Só é possível incorporar as publicações abertas de Páginas e perfis do Facebook.
Configurações
| Configuração | Descrição | Padrão |
|---|---|---|
| A URL absoluta da publicação. |
|
|
|
|
| A largura da publicação. Mínimo de | largura flexível |
| Aplica-se à publicação de fotos. Defina como |
|
Como obter o código de uma publicação
1. Navegue até a publicação
É possível obter o código de incorporação na própria publicação. Se a publicação for pública, clique no ícone que aparece no canto superior direito dela no Facebook.
Escolha Embed Post no menu suspenso:
Caso seja uma publicação de foto, selecione o botão Embed Post no canto inferior direito:
2. Copie e cole o código
Aparecerá uma caixa de diálogo com o código para incorporar a publicação. Copie e cole esse código na sua página da web, no ponto onde você quer que ele apareça.
Para ver os detalhes técnicos, consulte a seção Adicionar código manualmente
Adicionar código manualmente
Além do Gerador de Códigos, é possível incorporar o código manualmente.
1. Obtenha a URL da publicação
Primeiro, é necessário obter a URL da publicação que você quer compartilhar. A publicação deve ser pública, o que é indicado pelo ícone de globo cinza que fica ao lado do horário de publicação: 
Para fins de teste, você pode usar esta URL de exemplo:
"https://www.facebook.com/20531316728/posts/10154009990506729/"2. Carregue o SDK para JavaScript
Para usar o plugin de publicações incorporadas ou qualquer outro Plugin Social, é preciso adicionar o SDK do Facebook para JavaScript ao seu site. Você só precisa carregar o SDK na página uma vez, e o ideal é que ele fique após a tag de abertura <body>:
<div id="fb-root"></div> <script async defer src="https://connect.facebook.net/en_US/sdk.js#xfbml=1&version=v3.2"></script>
Para receber mais ajuda com a implementação do SDK para JavaScript, consulte SDK para JavaScript — Início rápido.
3. Posicione a tag de publicação incorporada
Depois, posicione a tag da publicação incorporada em qualquer ponto do site. Substitua {your-post-url} pela URL da publicação.
<div class="fb-post" data-href="{your-post-url}"></div>
4. Faça testes
Depois de concluir essas etapas, você pode testar a publicação incorporada. A integração completa será mais ou menos assim:
<html> <title>My Website</title> <body> <script async defer src="https://connect.facebook.net/en_US/sdk.js#xfbml=1&version=v3.2"></script> <div class="fb-post" data-href="https://www.facebook.com/20531316728/posts/10154009990506729/" data-width="500"></div> </body> </html>
A captura de tela abaixo mostra o resultado do nosso exemplo de teste.
5. Personalização
Siga as instruções mais abaixo na página para alterar o tamanho, o idioma e outras configurações.
Como obter a URL de uma publicação
Em alguns casos, o código incorporado é criado por um CMS, e você só precisa da URL bruta da publicação. Existem duas formas de obter a URL da publicação:
- Copie a URL do link permanente na barra de endereços do navegador.
- Clique com o botão direito do mouse no horário de publicação e copie o endereço do link.
Os dois métodos estão destacados em vermelho na captura de tela abaixo.
Pela Graph API
Se você quiser integrar automaticamente as publicações incorporadas ao seu site, provavelmente usará a Graph API para agregar publicações. Por exemplo, você pode usar o Ponto de extremidade da API do feed da página e o parâmetro fieldspermalink_url.
A resposta à sua solicitação para /{page-id}/feed?fields=permalink_url enviará a você algo semelhante ao seguinte:
{ "data": [ { "id": "1234567890_3456789012", "permalink_url": "https://www.facebook.com/1234567890/posts/3456789012" } ] }
Layout no desktop
É possível ajustar a largura das publicações incorporadas no desktop por meio do atributo data-width da tag de publicações incorporadas, como no exemplo abaixo. Escolha um valor entre 350 e 750 pixels.
Não use tags de estilo CSS para ajustar o tamanho de um plugin. Isso pode causar erros de exibição.
<!-- WRONG! --> <style type="text/css"> .fb-post { width: 500px; } </style> <div class="fb-post" data-href="{your-post-url}"> </div> <!-- CORRECT --> <div class="fb-post" data-width="500" data-href="{your-post-url}"> </div>
Layout na web móvel
Na web móvel, as publicações incorporadas são automaticamente dimensionadas para ter a largura do contêiner.
Wordpress
Caso você já use o Facebook SDK for JavaScript em seu site do Wordpress, poderá usar o plugin de publicações incorporadas simplesmente acrescentando a tag fb-post à sua publicação:
<div class="fb-post" data-href="https://www.facebook.com/20531316728/posts/10154009990506729/" data-width="500"></div>
Se não estiver usando o Facebook SDK for JavaScript e fizer a incorporação pelo trecho de copiar e colar (que você pode obter na própria publicação), o plugin de publicações incorporadas provavelmente não será renderizado, já que o Wordpress converterá todos os caracteres & em #038; e interromperá o plugin.
Em vez disso, use este código para adicionar o plugin:
<script>
window.fbAsyncInit = function() {
FB.init({
xfbml : true,
version : 'v9.0'
});
};
</script>
<script async defer src="https://connect.facebook.net/en_US/sdk.js"></script>
<div
class="fb-post"
data-href="https://www.facebook.com/20531316728/posts/10154009990506729/"
data-width="500"></div>Uma nova integração mais simples com o Wordpress será lançada em breve.
Perguntas frequentes
Se você estiver usando as versões HTML5 ou XFBML, você deve incluir o código de linguagem ao instanciar a biblioteca.
Quando você carregar o SDK, altere o valor de js.src para usar sua localidade. Substitua en_US pela sua localidade, por exemplo, fr_FR para usar francês (França):
// Example 1: 'https://connect.facebook.net/fr_FR/sdk.js'; // Example 2: js.src = "https://connect.facebook.net/fr_FR/sdk.js#xfbml=1&version=v2.6";
As localidades compatíveis estão listadas no arquivo XML de localidades do Facebook.
Talvez você tenha que ajustar a largura do Plugin Social para acomodar idiomas diferentes. Encontre mais informações sobre sua página Localização e Tradução.
A publicação incorporada mostra qualquer mídia vinculada a ela, bem como seu número de curtidas, compartilhamentos e comentários. Com a incorporação de publicações, os visitantes do site podem ver as mesmas informações avançadas mostradas no Facebook.com e seguir ou curtir autores de conteúdo ou de Páginas diretamente na incorporação.
A mensagem a seguir será mostrada no lugar da publicação incorporada:
