Come integrare i pulsanti Facebook Mi piace e Condividi

Il pulsante Facebook Mi piace non è più presente solo sui social network. Infatti il famoso pulsante ab­bel­li­sce anche diversi siti, blog e web app, di modo che i vi­si­ta­to­ri possano segnalare, ad esempio, il loro ap­prez­za­men­to nei confronti di un’azienda, una per­so­na­li­tà o un preciso contenuto. Grazie al pulsante Condividi di Facebook, gli utenti con­di­vi­do­no i contenuti ritenuti in­te­res­san­ti o di­ver­ten­ti con la propria cerchia di amici, e in questo modo dif­fon­do­no ve­lo­ce­men­te in rete messaggi, post e brand.

Ma che cosa si nasconde in realtà dietro all’in­se­ri­men­to dei pulsanti dei social media sul proprio sito, diventati ormai quasi ob­bli­ga­to­ri? Nella nostra guida ana­liz­zia­mo la funzione di questi pulsanti Facebook e vi in­di­chia­mo come crearne di vostri. Inoltre vi spie­ghia­mo perché, a volte, im­ple­men­tan­do­li possano sorgere dei problemi legali e a quali al­ter­na­ti­ve potete ricorrere.

I pulsanti Mi piace e Condividi rientrano tra gli elementi prin­ci­pa­li di Facebook. I pulsanti, che hanno subito nel corso degli anni diverse modifiche a livello estetico, sono la forza motrice dell’in­ter­con­nes­sio­ne tra gli utenti e la dif­fu­sio­ne dei contenuti. I social network più recenti hanno fatto ricorso a questo sistema e hanno integrato dei pulsanti simili.

A partire dal 2010 è possibile inserire entrambi i pulsanti anche al di fuori di Facebook e quindi sui siti. Per questo motivo l’azienda mette a di­spo­si­zio­ne i propri plug-in social, facili da im­ple­men­ta­re: grazie a un proprio con­fi­gu­ra­to­re, questi pulsanti riescono ad adattarsi bene al vostro progetto web e sono di­spo­ni­bi­li sia come iFrame che come ap­pli­ca­zio­ne Ja­va­Script. Per molti CMS, come ad esempio per WordPress, esistono perciò delle esten­sio­ni ap­pro­pria­te che vi aiutano nella loro in­te­gra­zio­ne.

I social network sono i canali perfetti per dif­fon­de­re i propri contenuti e gestire così nel migliore dei modi il contatto diretto con clienti, lettori o fan. Facebook offre perciò la base perfetta con le già citate funzioni di like e di con­di­vi­sio­ne, oltre che con la pos­si­bi­li­tà di com­men­ta­re i contenuti. Queste reazioni degli utenti, che vengono indicate anche come segnali sociali (social signals in inglese), per diversi motivi giocano un ruolo im­por­tan­te per il successo del web moderno:

• Più reazioni generano i vostri post, maggiore sarà la chance che altri autori, blogger o semplici utenti prestino at­ten­zio­ne al contenuto e rimandino con un link al vostro progetto web. Così ricevete dei backlink preziosi e attinenti te­ma­ti­ca­men­te che in­fluen­za­no po­si­ti­va­men­te il vostro ranking sui motori di ricerca.

• I backlink, le menzioni e i Mi piace aumentano il vostro raggio d’azione e la vostra autorità per quanto riguarda le keyword rilevanti. Ciò è van­tag­gio­so da una parte per l’ac­qui­si­zio­ne di nuovi clienti, lettori o fan, mentre dall’altra risulta anche pro­ba­bil­men­te positivo in generale per il raf­for­za­men­to della vostra presenza sul web.

• Nel lungo periodo i segnali sociali positivi si con­ver­to­no anche in un aumento del traffico sul vostro sito, un altro punto che vi aiuta a ottenere un ranking migliore tra i risultati di ricerca.

Anche se i segnali utente non rientrano tra i fattori diretti su Google e gli altri, tramite questi è possibile in­fluen­za­re po­si­ti­va­men­te il po­si­zio­na­men­to sui motori di ricerca. La premessa è quella di produrre contenuti di qualità e in­for­ma­ti­vi, che spingano a con­di­vi­de­re, a com­men­ta­re e a mettere Mi piace: infatti i pulsanti Facebook Mi piace e Condividi integrati al di fuori dei social network aiutano a dif­fon­de­re questi contenuti.

Infine create il codice del pulsante cor­ri­spon­den­te, cliccando su “Ottieni codice”. Scegliete il vostro app ID di Facebook e nella finestra pop-up che si apre apparirà il codice da inserire tramite SDK Ja­va­Script (Software De­ve­lo­p­ment Kit), che dovete integrare sia sul vostro sito nel primo passaggio (meglio se dopo il tag di apertura <body>) che nel codice del plug-in vero e proprio. Ora inserite questo codice del plug-in nel documento HTML nel punto in cui dovrà apparire il pulsante.

Non dovete per forza creare il pulsante Condividi nello stesso pacchetto del pulsante Mi piace: scegliete sem­pli­ce­men­te nella voce del menu il pulsante Condividi e generate il pulsante social nella stessa maniera di quello Mi piace grazie al con­fi­gu­ra­to­re messo a di­spo­si­zio­ne.

Fa dif­fe­ren­za se i pulsanti Facebook vengono integrati nel vostro sito sotto forma di un iFrame o ap­pli­ca­zio­ne Ja­va­Script, anche quando entrambe le versioni si as­so­mi­glia­no molto nella loro funzione basilare: visto che entrambi i plug-in social vengono gestiti da Facebook, il social network riconosce au­to­ma­ti­ca­men­te se un utente è loggato e mostra, quando opportuno, una forma per­so­na­liz­za­ta del pulsante. Nel caso di iFrame si tratta di una lista di tutti gli amici dei vi­si­ta­to­ri (com­pren­si­va di immagini del profilo) a cui è piaciuto il sito o il post. Se non è loggato o non ha un account, compare au­to­ma­ti­ca­men­te una richiesta, ovvero un invito, a loggarsi o a re­gi­strar­si. Il plug-in di Ja­va­Script ga­ran­ti­sce così all’utente la pos­si­bi­li­tà di ag­giun­ge­re un commento quando si clicca sul pulsante Mi piace. Al contrario dell’iFrame, che è un semplice elemento HTML, la variante Ja­va­Script prevede in aggiunta alla riga di codice del pulsante anche l’in­te­gra­zio­ne del codice SDK Facebook. Anche in questo caso integrate la richiesta di re­gi­strar­si sul social network grazie all’ef­fi­cien­te kit per svi­lup­pa­to­ri. Affinché Facebook possa ri­pro­dur­re i pulsanti per­so­na­liz­za­ti, il browser dell’utente contatta au­to­ma­ti­ca­men­te il server dell’azienda. Se si è re­gi­stra­ti sul social network, o lo si era, e si apre una pagina con un plug-in social integrato, il browser può persino venire iden­ti­fi­ca­to uni­vo­ca­men­te. Ma ciò significa anche che Facebook ottiene diverse in­for­ma­zio­ni sull’utente, come ad esempio l’orario di accesso, l’ID utente o i dati relativi al browser uti­liz­za­to e persino l’indirizzo IP. L’azienda americana si riserva il diritto di salvare e uti­liz­za­re questi dati raccolti per il mi­glio­ra­men­to dei propri prodotti e servizi, oltre che per l’ot­ti­miz­za­zio­ne degli annunci pub­bli­ci­ta­ri attivati. Anche in Italia, stando alla nuova normativa sui cookie, tale si­tua­zio­ne andrebbe quan­to­me­no segnalata dal gestore del sito.

Tutti i pulsanti social, come quelli Facebook, possono sollevare qualche dubbio in materia di privacy. Infatti, al momento della con­di­vi­sio­ne di contenuti o quando si mette un Mi piace, Facebook ri­le­ve­reb­be alcune in­for­ma­zio­ni sull’utente at­tra­ver­so i cookie. Quindi inserendo un pulsante social sul proprio sito, saranno presenti dei cookie di terze parti da segnalare nell’in­for­ma­ti­va sulla privacy e sui cookie per rimanere conformi alla legge. In al­ter­na­ti­va si consiglia di collegare al pulsante solo un link al sito e quindi di evitare i plug-in, ma optare piuttosto per l’in­se­ri­men­to di una stringa nel codice.

Un approccio moderno per i pulsanti social: semplici link HTML for­mat­ta­ti in CSS

Una soluzione per evitare che i pulsanti dei social network generino cookie di terze parti sul vostro sito è fornita da Shariff, che permette agli utenti di con­di­vi­de­re i contenuti dei social media in tutta tran­quil­li­tà. Il progetto open source viene svi­lup­pa­to sulla piat­ta­for­ma pubblica GitHub, dove potete anche scaricare il codice sorgente. Un pulsante Shariff per la con­di­vi­sio­ne non è nient’altro che un semplice link statico che è stato strut­tu­ra­to in modo per­so­na­liz­za­to grazie al lin­guag­gio dei fogli di stile CSS (file shariff.min.css) per poter sembrare come i tipici pulsanti di con­di­vi­sio­ne dei famosi social media, quali Facebook, Google+ e Twitter. Per questo il team di svi­lup­pa­to­ri di Heise ha fatto ricorso a icone vet­to­ria­li fles­si­bi­li invece che alle solite grafiche, perché rimangono nitide anche sui display ad alta ri­so­lu­zio­ne e rimangono me­mo­riz­za­te sul proprio server o si possono integrare tramite una Content Delivery Network MaxCDN. Per evitare di dover inserire ma­nual­men­te ogni volta l’URL del link statico, Shariff lo compila au­to­ma­ti­ca­men­te tramite Ja­va­Script (file shariff.min.js) nel codice sorgente. L’im­ple­men­ta­zio­ne del pulsante avviene grazie a un elemento con­te­ni­to­re <div> e alla classe shariff, che po­si­zio­na­te fa­cil­men­te nel punto de­si­de­ra­to della sezione <body> del vostro sito web. Nella sua forma più facile, il codice sorgente di una pagina appare quindi così:

Con un com­po­nen­te server opzionale è persino possibile in­di­vi­dua­re e mostrare il numero di tutti gli utenti che hanno uti­liz­za­to il pulsante di con­di­vi­sio­ne. Perciò Heise ha svi­lup­pa­to a questo scopo tre back end e moduli specifici per Facebook, Google+ e Twitter, ovvero una versione PHP, Perl e una Node.js. Così il back end invia tramite un’API apposita una richiesta al server delle reti, ricevendo in risposta una serie di metadati e ri­ca­van­do­ne anche l’in­for­ma­zio­ne circa la frequenza di con­di­vi­sio­ne dell’URL coinvolto.

Se si collega il proprio sito ai social network tramite pulsante, è possibile al­leg­ge­ri­re no­te­vol­men­te la dif­fu­sio­ne dei propri contenuti. Il discorso non vale solo per Facebook, ma anche per tutte le altre piat­ta­for­me sulle quali siete attivi. Se vi de­streg­gia­te nel dialogo tra gli utenti e pub­bli­ca­te re­go­lar­men­te contenuti di alta qualità, avete delle buone chance di tra­sfor­ma­re nel lungo periodo i segnali sociali in traffico per il vostro sito. Con i plug-in social offerti da Facebook ma anche da altri social media, come Google+ o Twitter, riuscite a collegare le vostre pagine tramite dei pulsanti. Tuttavia an­dreb­be­ro usati con par­si­mo­nia perché, infatti, possono sollevare qualche dubbio in materia di privacy.

Soluzioni al­ter­na­ti­ve con link statici, come il progetto Shariff, evitano di inviare i dati ai server dei social network e fanno in modo che il vi­si­ta­to­re riesca a gestire i dati forniti. Uti­liz­zan­do questi link sotto forma di pulsanti, siete più che sicuri dal punto di vista legale.