Comment ajouter le Facebook Like Box / Fan Box dans WordPress

Facebook like box, également appelé fan box Facebook, est devenu un élément indispensable pour de nombreux sites Web. Il permet aux propriétaires de sites Web d'offrir à leurs utilisateurs un moyen simple de rejoindre leur communauté Facebook et d'obtenir des mises à jour directement dans leur fil d'actualités Facebook. Récemment, un de nos utilisateurs a attiré notre attention sur le fait que nous n’avons pas abordé le sujet de la façon d’ajouter le facebook à la boîte dans WordPress. Bien que nous ayons déjà expliqué comment ajouter le bouton "Facebook like", le bouton "Envoyer" et les commentaires de Facebook. Dans cet article, nous allons vous montrer comment ajouter le fan box facebook dans WordPress.

Ajouter Like Box en utilisant le plugin Facebook officiel pour WordPress

Le moyen le plus simple d’ajouter un facebook à votre site WordPress est d’utiliser le plugin Facebook officiel pour WordPress. La première chose à faire est d’installer et d’activer le plugin Facebook. Après avoir activé le plugin, allez à Apparence »Widgets. Faites simplement glisser le widget Facebook like box dans votre barre latérale. Vous devrez fournir l'URL de votre page de fans facebook dans les configurations de widgets..

Le widget a les mêmes options que les plugins sociaux Facebook pour les sites Web. Vous pouvez choisir d'afficher un flux, d'afficher des faces, de supprimer un en-tête, de modifier la couleur de la bordure. Il n'y a actuellement que deux thèmes disponibles clair et foncé.

Ajouter comme Box manuellement sans utiliser de plugin

Il est possible d'ajouter Facebook comme une boîte manuellement sans utiliser aucun plugin. Aller à la page Like Box de Facebook Social Plugin. Indiquez l'URL de votre page Facebook et configurez l'apparence de la boîte de dialogue.

appuyez sur la Obtenir le code bouton pour obtenir le code de boîte semblable.

Facebook vous offre plusieurs façons d'ajouter le code de boîte similaire sur votre site Web. Vous pouvez choisir parmi HTML5, XFBML et iframe. Nous allons vous montrer comment ajouter chacun d’eux, mais vous devez en choisir un. À notre avis, le format HTML5 est une option raisonnable pour la plupart des sites Web utilisant WordPress. XFBML est bon pour les personnes utilisant d'autres plugins Facebook utilisant XFBML pour afficher les boutons Facebook. Utilisez iframe si les deux premières options ne vous conviennent pas.

Ajout de HTML5 comme code de boîte Facebook dans WordPress

Cliquez sur l'onglet HTML5 dans la fenêtre de code et copiez la première partie du code. Ils vous recommandent de le coller juste après balise qui se trouve généralement dans votre fichier header.php. Cependant, cela fonctionnera n'importe où dans le corps. Pour vous simplifier la vie, vous pouvez simplement l'ajouter dans le pied de page en utilisant notre plugin Insérer des en-têtes et des pieds de page. La première partie du code ressemblerait à ceci:

  (fonction (d, s, id) var js, fjs = d.getElementsByTagName (s) [0]; if (d.getElementById (id)) return; js = d.createElement (s); js.id = id ; js.src = "//connect.facebook.net/en_US/all.js#xfbml=1&appId=403924843027405"; fjs.parentNode.insertBefore (js, fjs); (document, 'script', 'facebook-jssdk ')); 

Ce javascript connecte votre site web à la bibliothèque javascript de Facebook. Copiez maintenant la deuxième partie du code, qui ressemblerait à ceci:

Cette partie du code indique au javascript que vous avez chargé précédemment d'afficher la même boîte à cet emplacement et avec ces paramètres. Pour cet exemple, nous allons coller ce code dans les widgets de la barre latérale. Aller à Apparence »Widgets. Glissez et déposez un widget de texte dans votre barre latérale et collez le code à l'intérieur. Enregistrez votre widget et consultez votre site Web.

Cela fonctionnera également dans toute autre zone de votre site. Si vous connaissez le code, vous pouvez le coller dans votre pied de page, après le post, etc..

N'oubliez pas de changer l'URL de la page de fans facebook en votre propre URL de page.

Ajout de XFBML comme un code de boîte comme Facebook dans WordPress

Cliquez sur l'onglet XFBML pour obtenir le code pour XFBML comme la boîte de dialogue. Pour ajouter une XFBML Facebook Like Box, vous devez ajouter trois minuscules morceaux de code dans WordPress..

Copiez le premier morceau de code et collez-le dans le thème de votre header.php déposer juste après étiquette. Semblable au dernier, ce code fonctionnera n'importe où dans le corps. Pour vous simplifier la vie, vous pouvez simplement l'ajouter dans le pied de page en utilisant notre plugin Insérer des en-têtes et des pieds de page. Ce code aimerait quelque chose comme ça:

  (fonction (d, s, id) var js, fjs = d.getElementsByTagName (s) [0]; if (d.getElementById (id)) return; js = d.createElement (s); js.id = id ; js.src = "//connect.facebook.net/en_US/all.js#xfbml=1&appId=403924843027405"; fjs.parentNode.insertBefore (js, fjs); (document, 'script', 'facebook-jssdk ')); 

Cette petite fonction javascript connecte votre site web à la bibliothèque javascript de Facebook.

La deuxième ligne de code est une déclaration d’espace de nommage XML, et vous devez l’ajouter dans tag de votre site. Le plus simple serait d’ouvrir votre thème. functions.php fichier, collez le code suivant:

 // Ajout du graphique ouvert dans les attributs de langage, fonction add_opengraph_doctype ($ output) return $ output. 'xmlns: og = "http://ogp.me/ns#" xmlns: fb = "http://ogp.me/ns/fb#" ";  add_filter ('language_attributes', 'add_opengraph_doctype'); 

Enfin, copiez la troisième ligne de code qui ressemblerait à ceci:

Ce code indique au javascript que vous avez chargé dans la première étape d'afficher la même boîte à cet emplacement et avec ces paramètres. Aller à Apparence »Widgets. Faites glisser et déposez un widget de texte dans votre barre latérale et à l'intérieur de celui-ci, collez la troisième ligne de code. Enregistrez vos modifications et prévisualisez votre site Web.

Ajout de Facebook Likebox iframe dans WordPress

Cliquez sur l'onglet IFRAME pour copier le code iframe. Aller à Apparence »Widgets et faites glisser un widget de texte dans votre barre latérale. Collez le code iframe dans le widget de texte et enregistrez les modifications. Ouvrez votre site pour prévisualiser le fan box facebook.

Nous espérons que cet article vous a aidé à ajouter Facebook Like box / Fan box sur votre site WordPress. Pour des questions et des commentaires s'il vous plaît laissez un commentaire. Vous pouvez aussi nous suivre sur Facebook.