Abbiamo già visto molti dei pregi del nuovo Like Button, ma forse non sai che è possibile farne un uso molto più avanzato.
Immagina, ad esempio, di avere un elenco di prodotti con associato ad ognuno un Pulsante Mi piace. Come potresti creare una classifica, ordinata in base al numero di apprezzamenti?
O magari vorresti far comparire un contenuto riservato non appena l’utente clicca il Like Button. Oppure ancora vorresti tracciare con Google Analytics ogni Like del tuo sito.
Tutto ciò è possibile, vediamo come.
Facebook nella pagina del Like riporta tra le FAQ:
How do I know when a user clicks a Like button?
If you are using the XFBML version of the button, you can subscribe to the ‘edge.create’ event through FB.Event.subscribe.
Ebbene sì: non bisogna usare alcun hack o chissà quale strano script! Facebook stesso mette a disposizione un metodo per intercettare l’evento di click sul pulsante.
Alcune premesse:
- Il seguente script funziona solo se hai implementato la Javascript SDK sulla pagina in questione.
- E’ possibile intercettare solo click sul pulsante in versione XFBML e non IFRAME.
- Funziona sia su siti esterni che su Applicazioni Facebook IFRAME.
Detto ciò, ecco il codice da inserire:
FB.Event.subscribe('edge.create', function(href, widget) {
alert('Ti piace ' + href);
});
</script>
In questo modo verranno intercettati i click su tutti i Like Button presenti sulla pagina.
Gli usi possono essere molteplici:
1. Ordinare degli oggetti per numero di Like
E’ molto semplice: fai una chiamata AJAX che, ad ogni click degli utenti, aggiorna il database con il conteggio degli apprezzamenti. Avendo il numero di like per ogni URL, sarà così possibile ordinarli in classifica.
Usando jQuery, il codice sarà simile a questo:
<script>
FB.Event.subscribe('edge.create', function(href, widget) {
$.ajax({
type: "POST",
url: "ajax.php",
data: {'url' : href},
});
});
</script>
Nel file ajax.php andrai a fare un UPDATE al database che incrementa di 1 il numero dei Like.
2. Mostrare un contenuto riservato
Il contenuto riservato viene mostrato solo quando l’utente clicca sul pulsante:
<div id="riservato" style="display:none">CONTENUTO RISERVATO</div>
<script>
FB.Event.subscribe('edge.create', function(href, widget) {
document.getElementById('riservato').style.display = 'block';
});
</script>
3. Tracciare i Like con Google Analytics
Non sarebbe grandioso sapere esattamente quando e come vengono cliccati i Like Button? Con questo codice è possibile tracciarli:
FB.Event.subscribe('edge.create', function(href, widget) {
pageTracker._trackEvent('facebook','like', href);
});
</script>
Da inserire dopo il codice standard di Analytics. Per un approfondimento vedi How do I track that little Facebook “Like” button in Google Analytics?
Hai altre idee e suggerimenti di come si può usare questo script? Condividili nei commenti!
Facendo finta di riuscire ad ottenere lo user_id, è possibile mandarlo al file ajax.php in maniera tale che venga salvato nel database?
Non mi è chiaro come faccio a far si che il file ajax.php aggiorni il database, nel senso, come fa ad accorgersi che gli arriva un dato dal pulsante like?
Grazie Daniele
Ciao, volevo segnalare che hanno aggiunto i dislike:
edge.remove – fired when the user unlikes something (fb:like)
http://developers.facebook.com/docs/reference/javascript/FB.Event.subscribe/
Ciao,
stavo provando anch’io ad implementare questa funzione su un mio sito ma niente da fare, non traccia. Sembra perdersi un bel pò click.
Secondo voi quali potrebbero essere gli errori più comuni?
Thx
Ciao,
Il codice funziona ancora? Perchè ho effettuato diversi test, ma niente da fare, il click non viene intercettato
Grande articolo,
ho approfondito la cosa sulla documentazione di FB e mi chiedo:
Com’è possibile che non c’è l’evento inverso? Ovvero il NON mi piace più. l’evento sembra non essere monitorabile…
Mi scuso per il post veloce ma dopo una breve indagine ho scoperto che FB ha sopperito al bug:
Il nuovo evento si chiama edge.remove e permette di intercettare l’UNLIKE
Si usa allo tesso modo di “edge.create”
Buon lavoro a tutti!
Ciao Vincenzo, ne sei sicuro? Io l’avevo cercato ovunque, ma non l’ho trovato e qui non se ne parla.
Mi daresti un riferimento?
Alla pagina http://bugs.developers.facebook.net/show_bug.cgi?id=10796
si parla del bug.
Ma ho letto io male il commento di uno sviluppatore
Votando il bug si farà in modo da metterlo in evidenza nella sua risoluzione…
Ciao è possibile invece intercettare nome e cognome da inserire nel database a fini statistici?
Solo se l’utente è loggato con Facebook Connect al tuo sito.
quindi se clicco sul like button ma non sono loggato al sito tramite il login button non posso prelevare i dati delle persone. giusto?
Esattamente.
Ciao, devo riuscire a loggare l’userid o altro in modo da identificare l’untente che ha cliccato “mi piace” cosi da visualizzare un div di ringraziamento, è possibile in qualche modo anche se l’user non si è loggato attraverso il login button???
Sono interessato al 1* passaggio, quello per ordinare i click sul mi piace. Prima di tutto volevo chiedere lo script va inserito nel file single.php del tema di wordpress dove ho incollato il codice per il “mi piace”?? E poi non so come creare il file ajax.php per fare un UPDATE al database che incrementa di 1 il numero dei Like. Chiedo scusa ma sono un novellino ;P
grazie, ottimi esempi. Ma senza la possibilità di intercettare il dislike non avremo mai la possibilita’ di aggiornare il nostro database, perchè avremo sempre dati falsati rispetto a quelli di facebook. Se qualcuno ha una soluzione sarebbe grande!
Per una mia prossima applicazione userò il Like Button per far votare le foto più belle.
Penso che risolverò non permettendo l’Unlike: quando l’utente clicca su “Mi piace”, salvo il click nel database e nascondo il pulsante, mostrando solo il numero di voti.
Se anche ricaricherà la pagina, non vedrà più i Like Button in corrispondenza delle foto che ha già votato.
Credo sia la soluzine migliore: niente pusalnte, niente Unlike
hahaah no comment
Mi associo al commento di Fabio.
Sto studiando come intercettare il “Non mi piace”
E’ possibile intercettare lo “share”?
Piacerebbe anche a me, ma per ora l’unico evento che si può monitorare è l’”edge.create”, che corrisponde al click sul Like.
Magari in futuro ne aggiungeranno altri, in modo da tracciare tutte le azioni.
ottimo articolo.
Si può intercettare il “non mi piace”? (dovrei decrementare un contatore…)
oppure: esiste un modo per ottenere la lista dei mi piace per un certo url? ho provato con fql ma non ci sono riuscito.
Consigli? grazie!
Funziona anche per il pulsante “Mi Piace” relativo alla Fan Page?
Purtroppo no, funziona solo per i Like Button.
L’ho dovuto usare giusto un paio di giorni fa per un cliente,
Segnalo solo un piccolo difetto, se all’interno della applicazione devi monitorare più eventi come per esempio il click sul bottone o oltre a quello sul per creare una pagina step-by-step questa soluzione non funziona.
Consiglio quindi di tracciare con l’evento subscribe il primo step e dopo usare, se usi per esempio l’sdk javascript, fb.ui in stream.share e verificare il response e procedere con gli step successivi.
Spero di essere stato d’aiuto,
Ciao a tutti.
Daniele.
Ciao, grazie per la precisazione
Io credo sia possibile intercettare più eventi.
Nel codice
window.fbAsyncInit = function() {
FB.init({appId: ‘YOURAPPID’, status: true, cookie: true,
xfbml: true});
FB.Event.subscribe(‘edge.create’, function(href, widget) { mia operazione });
FB…. altri eventi
};
Ed il gioco è fatto.
Geniale! Ho provato ad implementare il codice per le Analytics, ma non ci sono ancora riuscito in realtà. Qualcosa mi sfugge. Ci lavorerò su.
Grazie per la dritta, comunque!