Post incorporati

I post incorporati sono un modo semplice per inserire post pubblici (di una Pagina o di una persona su Facebook) nel contenuto del tuo sito web o della tua pagina web. È possibile incorporare solo post pubblici da Pagine e profili Facebook.

Generatore di codici

href

width

show_text

Ottieni il codice

Impostazioni

Impostazione	Descrizione	Impostazione predefinita
`data-href`	L'URL assoluto del post.	`n/a`
`data-lazy`	`true` implica l'utilizzo del meccanismo di lazy-loading del browser impostando l'attributo iframe `loading="lazy"`. Ne consegue che il browser non esegue il rendering del plug-in se non è vicino al viewport e potrebbe non essere mai visto. Può essere `true` o `false` (impostazione predefinita).	`false`
`data-width`	La larghezza del post. Minima `350` pixel, massima `750` pixel. Lascia il campo vuoto per una larghezza variabile.	larghezza variabile
`data-show-text`	Applicata a un post con foto. Imposta su `true` per includere il testo del post su Facebook, se presente.	`false`

Acquisizione del codice da un post

1. Vai al tuo post

Puoi ottenere il codice di incorporamento direttamente dal post. Se il post è visibile a Tutti, clicca sull'icona in alto a destra nel post stesso su Facebook.

Scegli Embed Post nel menu a discesa:

Per i post con foto, seleziona il pulsante Embed Post in basso a destra:

2. Copia e incolla il codice

Vedrai apparire una finestra di dialogo con il codice per incorporare il post. Copia e incolla il codice nel punto della tua pagina web in cui desideri posizionarlo.

Per informazioni tecniche dettagliate, consulta la sezione Aggiunta manuale del codice.

Aggiunta manuale del codice

Oltre al Generatore di codici, puoi anche incorporare il codice manualmente.

1. Ottieni l'URL del post

Devi innanzitutto ottenere l'URL del post da condividere. Il post deve essere pubblico; questa condizione è indicata dall'icona del mondo grigio, accanto all'orario di pubblicazione del post:

Per eseguire un test, puoi usare questo URL di esempio:

"https://www.facebook.com/20531316728/posts/10154009990506729/"

2. Carica l'SDK JavaScript

Per usare il plug-in per i post incorporati o altri plug-in social, devi aggiungere l'SDK di Facebook per JavaScript al tuo sito web. Devi caricare l'SDK una volta sola nella pagina, possibilmente subito dopo il tag <body> iniziale:

<div id="fb-root"></div>
<script async defer src="https://connect.facebook.net/en_US/sdk.js#xfbml=1&version=v3.2"></script>

Per ricevere maggiore assistenza con l'implementazione dell'SDK JavaScript, consulta l'apposita guida di avvio rapido.

3. Posiziona il tag del post incorporato

Posiziona il tag del post incorporato in qualsiasi punto del tuo sito web. Sostituisci {your-post-url} con l'URL del post.

<div class="fb-post" data-href="{your-post-url}"></div>

4. Test

Dopo aver completato questi passaggi, puoi testare il tuo post incorporato. Un'integrazione completata avrà un aspetto simile a questo:

<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>

Nello screenshot seguente viene mostrato il risultato del nostro test di esempio.

5. Personalizzazione

Segui le istruzioni più in basso in questa pagina per regolare le dimensioni, la lingua e altre impostazioni.

Acquisizione dell'URL di un post

Potrebbero esserci scenari in cui il tuo codice di incorporamento viene creato da un CMS e hai bisogno dell'URL del post raw. Puoi ottenere l'URL dei post in due modi:

Copia l'URL del permalink dalla barra degli indirizzi del browser.
Clicca con il tasto destro del mouse sulla data di pubblicazione del post e copia l'indirizzo del link.

Entrambi i metodi sono evidenziati in rosso nello screenshot seguente.

Tramite l'API Graph

Se desideri integrare automaticamente i post incorporati nel tuo sito web, puoi usare l'API Graph per aggregare i post. Ad esempio, puoi usare l'endpoint API Page Feed e il parametro permalink_url di fields.

La risposta alla richiesta effettuata a /{page-id}/feed?fields=permalink_url avrà un aspetto simile al seguente:

{
  "data": [
    {
      "id": "1234567890_3456789012", 
      "permalink_url": "https://www.facebook.com/1234567890/posts/3456789012"
    }
  ]
}

Layout su computer

Puoi modificare la larghezza dei post incorporati su computer tramite l'attributo data-width nell'apposito tag, come mostrato nell'esempio seguente. Scegli un valore compreso tra 350 e 750 pixel.

Non usare i tag di stile CSS per modificare le dimensioni di un plug-in, poiché potrebbero verificarsi errori di visualizzazione.

<!-- 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 sul web mobile

Sul web mobile, i post incorporati si adattano automaticamente alla larghezza del contenitore.

WordPress

Se stai già utilizzando l'SDK di Facebook per JavaScript nel tuo sito WordPress, puoi utilizzare il plug-in per i post incorporati semplicemente aggiungendo il tag fb-post al tuo post WordPress:

<div class="fb-post" data-href="https://www.facebook.com/20531316728/posts/10154009990506729/" data-width="500"></div>

Se non stai utilizzando l'SDK di Facebook per JavaScript e incorpori un post copiando e incollando lo snippet, che puoi ottenere da ogni post di Facebook, molto probabilmente il plug-in per i post incorporati non verrà visualizzato poiché WordPress convertirà tutti i caratteri & in #038; corrompendo il plug-in.

In questo caso, usa il codice seguente per aggiungere il plug-in:

<script>
  window.fbAsyncInit = function() {
    FB.init({
      xfbml      : true,
      version    : 'v25.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>

Prossimamente verrà rilasciata un'integrazione con WordPress nuova e semplice da utilizzare.

FAQ

Come posso visualizzare i plug-in social in diverse lingue?

Se utilizzi le versioni HTML5 o XFBML, devi includere il codice della lingua quando istanzi la libreria.

Durante il caricamento dell'SDK, modifica il valore di js.src per usare la tua lingua. Sostituisci en_US con la lingua desiderata, ad es. fr_FR per il francese (Francia):

// 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";

Le lingue supportate sono indicate nel file XML Facebook Local.

In base alla lingua, potresti dover modificare la larghezza dei plug-in social. Per maggiori informazioni, puoi consultare la nostra pagina dedicata a localizzazione e traduzione.

Permalink

Cosa viene mostrato nei post incorporati?

I post incorporati presentano i contenuti multimediali allegati e il numero di "Mi piace", di condivisioni e di commenti. I post incorporati mostrano a chi visita il tuo sito Web le stesse informazioni dettagliate presenti su Facebook.com e consentono di seguire autori di contenuti o Pagine e mettere "Mi piace" direttamente dall'incorporamento.

Permalink

Cosa succede se un post viene eliminato o se viene modificato il relativo strumento di selezione del pubblico?

Il post incorporato viene sostituito dal messaggio seguente:

Permalink