Intégration timeline Facebook

Voici les étapes pour intégrer « simplement » votre timeline Facebook dans votre site web WordPress. Dans mon cas, j’intègre la timeline mais vous pouvez créer votre propre configuration selon ce que propose Facebook. Pour avoir la liste de ce qu’il est possible de faire, rendez-vous sur la page de documentation/rubrique ‘Social Plugins. Vous pouvez par exemple choisir d’intégrer uniquement les mentions LIKE .

Il vous faut d’abord créer un compte sur DEV_Facebook. C’est gratuit. Vous devrez renseigner quelques informations et créer votre première app_; . Il est possible de créer plusieurs app_ selon que vous ayez plusieurs pages Facebook à gérer.

Pour la suite, la marche à suivre et assez simple (plus que pour intégrer Instagram en tout cas).
Choisissez les options qui vous conviennent, toujours dans la page de doc. Vous serez alors capable de générer un code en 2 parties:
1 • une partie script à intégrer dans votre bas de page html.
2 •
et une partie html a intégrer là où vous voulez que la timeline apparaisse.

Pour appeler un script dans WordPress,  utilisez le fichier function.php.
Créez une function – dans mon exemple Timeline_Facebook_init() – pour initialiser le script, puis avec add_action intégrer là dans le bas de page wp_footer  :

add_action('wp_footer', 'Timeline_Facebook_init');
function Timeline_Facebook_init() { ?>
<div id="fb-root"></div>
<script async defer crossorigin="anonymous" src="https://connect.facebook.net/fr_FR/sdk.js#xfbml=1&version=v3.3&appId=xxxxxxxxxxxxxxxxxx">
</script>
<?php }

Pour la partie html j’aurais pu copier/coller le code directement dans l’article. Ça marche. Sauf que vous n’êtes pas à l’abri de mauvaises manip’, notamment si plusieurs personnes ont accès au site et de surcroit si elles ne maitrisent pas le code. Le plus sûr est donc d’intégrer directement le code html fourni par Facebook dans votre le fichier qui gère les articles : content.php puis de faire une condition dans php pour éviter que votre timeline Facebook ne s’affiche sur tous les articles. Voici le code que j’ai utilisé :

<?php if ( is_single('974') ) : ?>
<div id="facebook_embed">
<div class="fb-page" data-href="https://www.facebook.com/bdpnl/" data-tabs="timeline" data-width="500" data-height="900" data-small-header="false" data-adapt-container-width="true" data-hide-cover="false" data-show-facepile="true">
<blockquote cite="https://www.facebook.com/bdpnl/" class="fb-xfbml-parse-ignore">
<a href="https://www.facebook.com/bdpnl/">Bdpnl</a>
</blockquote>
</div>
</div>
<?php endif; ?>
Partage :