Pulsante "Mi piace" per il web

Modifiche ai plug-in social nella regione europea

Potresti iniziare a riscontrare qualche effetto sui Plug-in social a causa dell'aggiornamento di una richiesta per il consenso all'uso dei cookie che verrà mostrata alle persone che utilizzano i prodotti Facebook nella regione europea. Non supporteremo più i Plug-in social "Mi piace" e "Commenta" per gli utenti nella regione europea, a meno che non soddisfino entrambe queste condizioni: 1) hanno effettuato l'accesso al proprio account Facebook e 2) hanno fornito il consenso al controllo "Cookie dell'app e del sito web". Se entrambi questi requisiti sono soddisfatti, l'utente sarà in grado di vedere e interagire con plug-in come il pulsante "Mi piace" o "Commenta". Se uno dei requisiti di cui sopra non viene soddisfatto, l'utente non sarà in grado di vedere i plug-in.

La regione europea è una lista specifica di Paesi che include:

  • Unione europea (UE): Austria, Belgio, Bulgaria, Croazia, Repubblica di Cipro, Repubblica Ceca, Danimarca, Estonia, Finlandia, Francia, Germania, Grecia, Ungheria, Irlanda, Italia, Lettonia, Lituania, Lussemburgo, Malta, Paesi Bassi, Polonia, Portogallo, Romania, Slovacchia, Slovenia, Spagna, Svezia.

  • Membri non appartenenti all'Unione europea, ma solo a SEE/EFTA o unione doganale: [Solo SEE/EFTA] Islanda, Liechtenstein e Norvegia; Svizzera: [Unione doganale dell'UE] tutte le Isole del Canale, Isola di Man, Monaco; Zone britanniche di sovranità a Cipro; [Unione doganale europea] Andorra, San Marino, Città del Vaticano.

  • Membri non appartenenti all'Unione europea, ma parte delle regioni ultraperiferiche (OMR): Martinica, Mayotte, Guadalupa, Guyana francese, Riunione, Saint-Martin, Madeira, Azzorre, Isole Canarie.
  • Regno Unito (tutte le isole britanniche)

Ottieni un pulsante "Mi piace" personalizzato

Usa il Configuratore del pulsante "Mi piace" per ottenere il codice per il pulsante "Mi piace" da inserire nella tua pagina web.

  1. Imposta l'URL della tua pagina web nel punto in cui collochi il pulsante "Mi piace".
  2. Personalizza il tuo pulsante "Mi piace".
  3. Visualizza un'anteprima del pulsante.
  4. Clicca su Ottieni codice e copia e incolla il codice nella tua pagina web.

Configuratore del pulsante "Mi piace"

URL per mettere "Mi piace"
Width
Layout
Tipo di azione
Dimensioni pulsante

Usa i metatag di Open Graph per modificare l'anteprima dei link. Il tag og:url e l'attributo data-ref devono essere lo stesso URL.

Esempio di codice completo

Formattato per una maggiore leggibilità.

<html>
<head>
  <title>Your Website Title</title>
    <!-- You can use open graph tags to customize link previews.
    Learn more: https://developers.facebook.com/docs/sharing/webmasters -->
  <meta property="og:url"           content="https://www.your-domain.com/your-page.html" />
  <meta property="og:type"          content="website" />
  <meta property="og:title"         content="Your Website Title" />
  <meta property="og:description"   content="Your description" />
  <meta property="og:image"         content="https://www.your-domain.com/path/image.jpg" />
</head>
<body>

  <!-- Load Facebook SDK for JavaScript -->
  <div id="fb-root"></div>
  <script async defer crossorigin="anonymous" 
        src="https://connect.facebook.net/en_US/sdk.js#xfbml=1
             &version={graph-api-version}
             &appId={your-facebook-app-id}" 
        nonce="FOKrbAYI">
  </script>

  <!-- Your like button code -->
  <div class="fb-like" 
       data-href="https://www.your-domain.com/your-page.html" 
       data-width=""
       data-layout="standard" 
       data-action="like" 
       data-size="small"  
       data-share="true">
  </div>

</body>
</html>

Attributi HTML5 per il pulsante "Mi piace"

Attributo HTML5 Descrizione

data-action

Il verbo da mostrare sul pulsante: può essere like (impostazione predefinita) o recommend.

data-colorscheme

La combinazione di colori usata dal plug-in per il testo al di fuori del pulsante: può essere light (impostazione predefinita) o dark.

data-href

L'URL della pagina web a cui verrà messo "Mi piace".

data-kid-directed-site

Se il tuo sito web o servizio online è rivolto anche solo in parte a bambini di età inferiore a 13 anni, devi impostare questo valore su true. L'impostazione predefinita è false.

data-layout

Consente di selezionare uno dei vari layout disponibili per il plug-in: può essere standard (impostazione predefinita), button_count, button o box_count. Consulta le FAQ per maggiori dettagli.

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

data-ref

Un'etichetta per il monitoraggio dei reindirizzamenti non deve superare 50 caratteri e può contenere caratteri alfanumerici e alcuni caratteri di punteggiatura (al momento +/=-.:_). Consulta le FAQ per maggiori dettagli.

data-share

Specifica se includere un pulsante Condividi accanto al pulsante "Mi piace", true o false (impostazione predefinita). Funziona solo con la versione XFBML.

data-size

Il pulsante è disponibile in 2 dimensioni, large e small (impostazione predefinita).

data-width

La larghezza del plug-in (solo per layout standard), soggetta a quella minima e a quella predefinita. Consulta la tabella Impostazioni di layout per maggiori dettagli.

Impostazioni di layout

Le Impostazioni di layout sono facoltative.

Layout Dimensioni predefinite

standard

Larghezza minima: 225 pixel.
Larghezza predefinita: 450 pixel.
Altezza: 35 pixel (senza foto) o 80 pixel (con foto).

box_count

Larghezza minima: 55 pixel.
Larghezza predefinita: 55 pixel.
Altezza: 65 pixel.

button_count

Larghezza minima: 90 pixel.
Larghezza predefinita: 90 pixel.
Altezza: 20 pixel.

button

Larghezza minima: 47 pixel.
Larghezza predefinita: 47 pixel.
Altezza: 20 pixel.

Modifica della lingua

Puoi modificare la lingua del pulsante "Mi piace" caricando una versione localizzata dell'SDK JavaScript di Facebook. Sostituisci en_US con la lingua desiderata, ad esempio fr_FR per il francese (Francia).

js.src = "https://connect.facebook.net/fr_FR/sdk.js#xfbml=1&version={graph-api-version} />"; 

In base alla lingua, potresti dover modificare la larghezza dei plug-in social.