Sabato
19
Marzo 2022
Post Facebook su sito web con chiavi API e Php
Come inserire post Facebook su sito web tramite chiavi API? È molto semplice, basta seguire 3 semplici passaggi e incollare il codice Php :
Le chiavi API di Facebook sono perfette per inserire post nel tuo sito web con un layout grafico personalizzato. Puoi infatti estrarre il testo dei post, commenti, immagini e molto altro per poi mostrarli ai tuoi utenti in modo accattivante.
Come fare? Intanto installiamo correttamente l’SDK sul nostro sito.
Tempo richiesto: 1 ora
chiavi API Facebook su sito web
- Installare l’SDK JavaScript di Facebook
- Creare account Facebook for Developer
- Integrare le librerie php-graph-sdk di Facebook
- La variabile $fb
- Il Facebook Login Button
- Passare il token utente da Js a Php
1) Installare l’SDK JavaScript di Facebook
Basta richiamare una libreria esterna di facebook: sdk.js subito dopo il tag <body> del tuo sito web.
Usi WordPress? Allora ti basterà aprire il file header.php del tuo tema Child ed incollare lì il tuo codice (così non perderai le modifiche con gli aggiornamenti del tema padre).
<body>
<script>
logInWithFacebook = function() {
FB.login(function(response) {
}, {scope: 'public_profile,email'});
return false;
};
window.fbAsyncInit = function() {
FB.init({
appId : 'XXXXXXXXXXX',
xfbml : true,
cookie : true,
version : 'v2.10'
});
};
</script>
<script async defer src="https://connect.facebook.net/it_IT/all.js"></script>
<!-- resto del codice -->
</body>
2) Creare account Facebook for Developer
Ora dovrai creare un account su Facebook for Developer, verificare la tua azienda e ottenere le chiavi “app ID” e “app secret”.
È molto semplice: clicca su “crea un account” in alto a destra, segui la procedura fino alla fine e sarai pronto per inserire i post di Facebook sul tuo sito web.
3) Integrare le librerie php-graph-sdk di Facebook
Completata la procedura dovrai integrare le librerie php-graph-sdk di Facebook contenenti tutte le funzioni necessarie e scaricabili gratuitamente da GitHub
la cartella che ti serve è src/Facebook con tutti i file che contiene. In particolare dovrai includere solo il file autoload.php nel tuo sito prima delle funzioni generate dal Graph API.
Per non sbagliare ho incluso il file autoload.php nell’header del mio sito, subito dopo lo script SDK
<?php
include ABSPATH . 'wp-content/mio-percorso/autoload.php';
?>
La costante ABSPATH serve ad individuare il percorso del tuo sito WordPress compreso lo “/” finale es: “https://www.il-mio-sito.it/”
4) La variabile $fb
A questo punto dobbiamo creare la variabile $fb contenente i dati di accesso alla pagina Facebook con questo codice:
$fb = new \Facebook\Facebook([
'app_id' => ‘XXXXXXXX’,
'app_secret' => ‘XXXXXXXXXXXXXXX’,
'default_graph_version' => 'v2.10',
]);
Sostituisci i valori di app_id e app_secret con le chiavi che troverai nel tuo account Facebook for Developer.
5) Il Facebook Login Button
Prima di generare il codice tramite il Graph API dovrai creare un pulsante di Login con Facebook per i tuoi utenti perché, se non effettuano l’accesso, non potranno vedere i tuoi contenuti.
Tutti i codici del Graph API infatti necessitano di un token utente, cioè un codice univoco che lo identifica e ne permette il tracciamento o l’interazione (mi piace e commenti).
A questo link trovi il configuratore del Facebook login button, ti basterà cliccare sul pulsante “Ottieni il codice”. Fai attenzione a non includere due volte lo scrpt “sdk.js”, lo hai già inserito nei passaggi precedenti.
Il codice HTML sarà simile a questo:
<div id="fb-root"></div>
<div class="fb-login-button"
data-size="large"
data-button-type="continue_with"
data-layout="rounded"
data-auto-logout-link="true"
data-use-continue-as="true"
data-width=""
data-onlogin="window.location.reload();">
</div>
6) Passare il token utente da Js a Php
Ora non ci resta che estrarre il token utente dalla funzione JavaScript inserita in precedenza e passarlo in PHP.
$helper = $fb->getJavaScriptHelper();
try {
$accessToken = $helper->getAccessToken();
} catch(Facebook\Exception\ResponseException $e) {
// When Graph returns an error
echo 'Graph returned an error: ' . $e->getMessage();
exit;
} catch(Facebook\Exception\SDKException $e) {
// When validation fails or other local issues
echo 'Facebook SDK returned an error: ' . $e->getMessage();
exit;
}
if (isset($accessToken)) {
$my_access_token = $accessToken->getValue();
}Ora impariamo ad utilizzare l’API Graph Tool messo a disposizione da Facebook, così facendo potrai generare con facilità il codice da inserire nel tuo sito.
Per farlo ti servirà la documentazione ufficiale di Facebook, il Graph Api Reference dove troverai tutte le chiamate Api messe a disposizione.
Se vuoi ad esempio mostrare sul tuo sito web i post pubblicati dalla pagina con titolo, foto e descrizione eccoti un esempio di codice PHP:
try {
// Returns a `FacebookFacebookResponse` object
$response = $fb->get(
'/id-della-tua-pagina/posts?fields=story,id,call_to_action,full_picture',
$my_access_token
);
} catch(FacebookExceptionsFacebookResponseException $e) {
echo 'Graph returned an error: ' . $e->getMessage();
exit;
} catch(FacebookExceptionsFacebookSDKException $e) {
echo 'Facebook SDK returned an error: ' . $e->getMessage();
exit;
}
$graphNode = $response->getGraphEdge()->asArray();
Sostituisci nell metodo get() l’id della tua pagina Facebook, lo troverai sotto la schermata impostazioni. Puoi inoltre aggiungere tutti i parametri che vuoi mostrare semplicemente elencandoli nella richiesta get: in questo caso richiedo il nome del post, l’id, il pulsante di call to action e l’immagine pubblicata.
La risposta che si ottiene non è sempre un array oppure potrebbe contenere degli oggetti. Scopri anche come convertire oggetti in array php
Scrivi un commento