Nel precedente articolo abbiamo visto come inserire il pulsante “mi piace” in un sito sfruttando i nuovi social plugin di facebook. Ora vediamo come aggiungere il box dei commenti, in modo che i nostri utenti possono interagire col sito e nello stesso tempo, aumentare il nostro traffico grazie alla propagazione sulla bacheca facebook dei messaggi inseriti.
Facebook ha facilitato di molto le cose, con la nuova versione dei commenti. Per poter inserirli nel nostro sito basta copiare (e personalizzare) queste righe:
1 |
<div id="fb-root" class=" fb_reset"><div style="position: absolute; top: -10000px; height: 0px; width: 0px;"><div></div></div></div><p><br><fb:comments href="<Indirizzo della tua pagina>" num_posts="2" width="500"></fb:comments></p> |
Ora cerchiamo di capire meglio in modo da poter personalizzare con facilità :
La prima riga inserisce un contenitore dove il codice di facebook inserirà i commenti
La seconda carica la libreria javascript (in italiano) che gestisce l’intero processo.
La terza ci permette di personalizzare l’aspetto e le funzionalità del box dei commenti.
Vediamo quindi i parametri (tag) che possaimo utilizzare:
href: l’indirizzo della nostra pagina, dove è presente il box dei commenti.
width: la dimenesione del box
num_post : il numero dei commenti da visualizzare (default è 10)
colorscheme: il colore di base del box. Può essere light (default) o dark
Moderazione Commenti
E’ possibile moderare i commenti. Per farlo dobbiamo identificarci come amministratori.
Quindi bisogna aggiungere nel tag Head della pagina html :
1 |
<meta content="{ID FACEBOOK}"> |
dove è importante inserire il corretto id facebook in modo che il box ci riconosca come amministratori e ci permette di moderare i commenti
UPDATE:
Per inserire il box dei commenti ora è necessario avere un’applicazione Facebook associata.
Una volta creata l’applicazione (se non esiste già) basta andare al link https://developers.facebook.com/docs/plugins/comments/
e selezionare come includere il box dei commenti (Html5 o XFBML) e successivamente copiare ed incollare il codice generato.
ho problemi con la multipla in una stessa pagina… ho più preview articoli di cui non voglio visualizzare i commenti ma solo il numero… idee?
Ragazzi nn riesco a capire come fareeee sono uno principiante e nn so kome si fa mi potete dare direttamente il codice fatto per voglio ke io sono quello ke se ce un mesaggio ke nn mi va di cancellarlo ce ke kontrollo io la situazione dei mesaggi e tutto … Aiutatemiii Grazie in anticipo!!!
ho letto dopo il fatto del Postable. Guarda direttamente dalla sorgente per favore: http://musicplace.altervista.org/xd_receiver.htm (è giusto qualche riga)
Ciao!
Complimenti per gli articoli davvero utili!
Avrei bisogno di aiuto in quanto sto creando un sito e, seguendo al tua guida, sto cercando di mettere i commenti tramite facebook…ho seguito le tue istruzioni ma mi compare un box bianco con il logo di facebook con accanto un load infinito, cioè carica all’infinito…quello che penso di avere sbagliato è nell’ xd_receiver.htm…ecco quello che ho scritto in questo file:
E’ giusto?
E in ogni caso, come risolvere questo problema?
Spero di essermi spiegato!
Grazie,
Andrea
non è l’xd_receiver.htm. Controlla il punto 4 ed assicurati che non ci sia altro codice javascript ritondante(esempio like FB)
Ciao Gennaro,
ho bisogno del tuo aiuto.
Ho appena installato la finestra dei commenti di facebook nel mio sitoweb.
Funziona, ma è allineata a sinistra, e io di css non ci capisco nulla)))
che codice dovrei integrare e dove per avere la comments box allineata al centro della mia pagina html?
Grazie anticipatamente)))
il box commenti sborda di molto al di fuori del div e sballa la pagina html al di sotto…come si fa ad impostare un parametro altezza o a contenere il box in altezza con un parametro a piacimento o in altro modo con codice html magari?
Grazie
non puoi impostare un parametro per l’altezza. Usa il css per adattarlo alle tue esigenze
Ho un problema con la moderazione. Ho inserito gli appositi meta tag ma non riesco a moderare. Mi sai dare una mano per favore?
sei sicuro di aver messo bene il valore in < meta property="fb:admins" content="IL TUO ID DI FACEBOOK" /> ?
Ti posto il codice dell’intera pagina (che si apre all’interno di un IFRAME della pagina principale.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xmlns:fb="http://www.facebook.com/2008/fbml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta property="fb:app_id" content="222878994391519"/>
<title>Documento senza titolo</title>
<style type="text/css">
<!–
body {
background-image: url(img/center.jpg);
background-repeat: no-repeat;
background-color: #212121;
margin-top: 5px;
}
body,td,th {
color: #FFF;
font-family: Tahoma, Geneva, sans-serif;
font-size: small;
}
.divScroll-1 {
height:300px;
width:815px;
overflow:scroll;
color: #FFF;
font-family: Tahoma, Geneva, sans-serif;
font-size: small;
text-align: justify;
}
a:link {
color: #F00;
}
a:visited {
color: #F00;
}
a:hover {
color: #F00;
}
a:active {
color: #F00;
}
–>
</style></head>
<body>
<table width="822" border="0" cellspacing="0" cellpadding="5">
<tr>
<td height="330" valign="top"><p align="center"><a href="comunica.php" target="_self"><strong>AGGIORNA PAGINA</strong></a></p><div class="divScroll-1"><div id="fb-root"></div><script src="http://connect.facebook.net/en_US/all.js#xfbml=1"></script><fb:comments href="http://www.eventotv.it" num_posts="2" width="790" colorscheme="dark"></fb:comments></div></td>
</tr>
</table>
</body>
</html>
Li ho provato pure creando un’app… ho provato anche con il mio id di facebook… ma non è cambiato nulla. Se riesci ad aiutarmi ti faccio una statua d’oro! :-)
devi inserire < meta property="fb:admins" content="IL TUO ID DI FACEBOOK" / >
leggi l’articolo OG tag per like e comment
Ciao! Nel mio blog wordpress vedo il modulo dei commenti facebook solo se sono loggato sul mio sito (nel mio caso come admin). Se faccio il logout, ma sono comunque connesso a facebook, quando visualizzo l’articolo non vedo il modulo dei commenti fb. Da cosa può dipendere?
dipende dove ha inserito il codice. Forse in un blocco visibile solo agli admin.
Non male!
Grazie!
ha che dificile, questo nemmeno ci provo! hahaha
azz se sei bravo!
ciao, grazie dell’articolo, ma pur avendo seguito alla lettera i tuoi passaggi non riesco ancora a visualizzare il box dei commenti; puoi tu stesso sbirciare l’HTML della pagina
http://www.spaziosociale.it/articolo.asp?id_art=630
spero tu possa aiutarmi! grazie davvero!
sostituisci xid con href in fb:comments
ciao
Ho eseguito tutto alla perfezione ma il box non appare…
ciao,
innanzitutto grazie per il tutorial…
ho seguito le istruzioni, tutto sembra funzionare tranne il fatto che non visualizzo il comment box sul mio sito..
quando lo lancio vedo per un attimo la classica icona di caricamento di facebook (tre barre blu) ma poi non accade niente.
ho controllato la formattazione ed è corretta…cosa potrebbe essere?
grazie
l’email non si riesce a ricavare dall’account facebook, giusto?
Con un’apps ed i corretti permessi, si.
Ciao…..ho risolto tutto….alla fine era una cosa semplice, (si trattava di spuntare l’opzione consenti commenti anonimi,l’unico neo è appunto che nn viene visualizzato nessun nome x i nick)…..
Grazie alle spiegazioni del tuo articolo ho inserito l’ opzione per i commenti in tutti i miei diversi articoli…(ogni articolo ha i suoi commenti)…grazie ancora…ciao
figurati. Mi fa piacere.
Scusa, sn ancora Riccardo, (questo è un commento senza fare il login da FB,)…..Ritornando al punto:
non uso nessuna piattaforma ho realizzato un CMS da 0, (x la mia squadra di calcio, gestisco classifiche, articoli e le statistiche), i commenti sn per una pagina BACHECA, dove ognuno può scrivere quello che vuole, nella mia prima versione del sito li gestivo attraverso il mio database, con un semplice form creato da me, x la seconda versione ho preferito inserirli con FB (così magari veniva usata un po di+), però cosi escludo fuori chi nn ha un account FB.
Domani mi metto al lavoro di nuovo, alla ricerca di qualche altra informazione, se poi riesco a realizzare quello che ho in mente, magari te lo faccio sapere…Grazie ancora ciao
Ciao, sn Riccardo, quello di prima…grazie per la risposta cosi veloce, non mi ero accorto che anche da te c era la possibilità di fare l accesso da facebook x inserire i commenti (non avevo proprio visto il tasto ACCEDI, e poi tu li visualizzi con un altro stile/grafica, diverso dalla grafica dei commenti di facebook)….
La soluzione che avevo in mente era un po diversa……
Ciao, grazie al tuo articolo ho modificato il mio codice x inserire i commenti di FB sul mio sito, ed in questo modo non ho più problemi con Internet Explorer (prima infatti con I.E non visualizzava niente, mentre con gli altri browser si).
Ora provo a spiegarti cosa vorrei fare….in altri diversi siti ho visto che cè la possibilità di inserire i commenti anche se non si ha un account facebook….in poche parole il form ti offre una doppia possibilità: puoi eseguire il login con FB oppure inserire una semplice user e la mail, e puoi scrivere i commenti come utente anonimo…..
Sai per caso come si fa???? devo modificare qualche opzione dell’applicazione ???
In altri diversi siti? Perchè qui no? Mi avvalgo della facoltà di non risponderti ora! ;)
Scherzo, dipende dal tipo di sito e da come vengono gestiti i commenti.
Se hai una piattaforma wordpress/drupal , trovi sicuramente qualche plugin o guida altrimenti devi fare da solo, via codice.
salve, ho un problema ho inserito il codice.. ma i commenti in tutti i post, sono gli stessi
ho visto che un utente in precedenza ha chiesto la stessa cosa, ma non ho capito come ha risolto.. non sono un molto esperto di html
mi puoi dire come si fa?
grazie
Quando scrivi il tag fb:comments inserisci un valore per xid.
Questo valore deve essere diverso per ogni pagina.
Immagina come se fosse un contenitore per i tuoi commenti, diversi valori, diversi contenitori.
Se inserisci il nome del tuo sito come xid, avri un’unico contenitore. Quindi devi inserire il nome della tua pagina, non quello del tuo sito.
Grazie delle informazioni!
Ciao. L’ho installato e sembra funzionare fatta eccezione per una cosa: anche se sono registrata come sviluppatore ed ho spuntato la casella ‘aggiungimi alla lista’ x ricevere le notifiche (da ‘Amministra post’), non mi arrivano mai le notifiche se qualcuno commenta i miei post.
Dove ho sbagliato? Senza che io sappia che qualcuno commenta è un po’ inutile, no?
HELP!
Le notifiche non arrivano. Dal mese di marzo scorso Facebook le ha eliminate.
Complimenti ottima spiegazione su un argomento interessante.
Molto utile come sempre.
Salve.. ho inserito il pulsante “mi piace” di in un blog di google.. per renderlo più visibile ho scelto l’opzione più grande.. ma non riesco a vedere i contatti (anche se avevo inserito visualizza avatar nei dati della pagina di fb per creare il codice HTML del plug).. adesso si è bloccato 1000 e non va oltre (1 mila).. come posso sbloccare questa situazione..? grazie
non penso si sia bloccato, solo che mostrerà di mille in mille.
Anche io – come Matteo Ferigo – ho il problema che il Comments Box si ripete uguale in tutte le pagine, portandosi dietro gli stessi commenti.
Come si fa a fare in modo che riconosca ogni pagina come diversa?
PS: l’ho inserito in un blog WordPress
CIAO!
ho visto che ti sei già risposto da solo qualche commento più sotto ;)
Allora mi fermo al secondo passo. Vado alla paghina http://www.somethingtoputhere.com/xd_receiver.htm e non scarica nulla.
Mi spieghi meglio? Grazie
Beh se continui a leggere, vedrai che il secondo punto è facoltativo.
E’ comunque la pagina vuota è quella da salvare (al suo interno c’è lo stesso codice che vedi dopo nel secondo punto, basta digitare ctrl-U per vedere il sorgente della pagina)
Come non detto, trovato: basta cambiare il parametro xid…
Come sarebbe “basta cambiare il parametro xid”?
ok, ho capito: bisogna rendere xid univoco per ogni pagina, usando qualche sistema
in Textpattern CMS: <txp:article_id />
in Tumblr blog: {PostID}
in Blogger blog: data:post.id
in WordPress blog: <?php the_ID(); ?>
esatto.
Ciao. Ottimo articolo.
L’ho installato sul mio sito nella pagina di dettaglio dei vari post, il problema è che i commenti sono uguali (perché attingono dalla stessa tabella). Com’è possibile creare spazi distinti fra le diverse pagine di un sito?
Grazie.
Ciao , sono in difficoltà ci ho provato per ore ma non riesco proprio a visualizzare il box premetto che non sono espertissimo , ma ho provato in tutti i modi …
assicurati che la pagina non abbia errori e che sia formata bene, con i tag html e body inclusi. Inoltre nell’applicazione Developer inserisci il tuo sito in WebSite.
Mi trovo in difficoltà con la gestione dei commenti, non posso ricontrollare tutte le pagine di un portale, per poter moderare i commenti.
Che voi sappiate c’è una soluzione a ciò?
Grazie
non ho capito bene. Se sei Admin dell’apps collegata al codice dei commenti, puoi gestirli una volta che sei autenticato.