Comment intégrer une vidéo Facebook dans WordPress
Publié: 2023-02-03Voulez-vous intégrer une vidéo Facebook dans WordPress ?
Les vidéos que vous publiez sur Facebook constituent également un excellent contenu pour votre site Web. En intégrant un flux vidéo Facebook, vous pouvez garder votre site frais et intéressant tout en développant votre suivi sur Facebook.
Dans cet article, nous allons vous montrer un moyen simple d'intégrer des vidéos Facebook dans WordPress.

Pourquoi ajouter des vidéos Facebook dans WordPress ?
Les vidéos sont un excellent moyen de se connecter avec votre public et de le maintenir engagé. Cela est vrai, que vous utilisiez un blog personnel ou un site Web d'entreprise.
Cependant, les vidéos sont particulièrement puissantes si vous voulez gagner de l'argent en bloguant en ligne avec WordPress. En fait, 88% des personnes ont acheté un produit ou un service après avoir regardé une vidéo selon les dernières statistiques de blogs.
Créer des vidéos attrayantes et divertissantes prend du temps et des efforts, donc si vous publiez des vidéos sur Facebook, il est logique de les réutiliser sur votre site Web WordPress.
En liant votre site Web à votre compte Facebook, toutes les nouvelles vidéos que vous publiez sur Facebook apparaîtront automatiquement sur votre site Web. De cette façon, vous pouvez garder votre site Web frais avec très peu d'efforts quotidiens.
Les vidéos intégrées peuvent même aider à développer votre page Facebook. Si les visiteurs du site Web voient de nombreuses vidéos et listes de lecture intéressantes, ils voudront vous suivre sur Facebook. Cela peut vous procurer des abonnés supplémentaires et plus d'engagement.
Cela étant dit, voyons comment vous pouvez facilement intégrer une vidéo Facebook dans WordPress.
Installer un plugin vidéo Facebook dans WordPress
Le moyen le plus simple d'intégrer une vidéo Facebook dans WordPress consiste à utiliser le plugin Custom Facebook Feed Pro.
C'est le meilleur plugin de flux de médias sociaux et vous permet d'intégrer facilement des albums Facebook, des commentaires, des critiques, des publications communautaires, des vidéos et bien plus encore sur votre site Web WordPress.

Dans ce guide, nous utiliserons la version pro de Smash Balloon car elle vous permet d'intégrer des vidéos dans WordPress, y compris des vidéos HD, 360 o et Facebook Live.
Smash Balloon Pro vous permet également d'afficher des photos dans un flux Facebook personnalisé et d'afficher le nombre total de likes, de partages, de commentaires et de réactions sous chaque publication. Cependant, si vous débutez et que vous avez un budget limité, il existe également une version gratuite que vous pouvez utiliser.
Tout d'abord, installez et activez le plugin Custom Facebook Feed Pro. Pour plus de détails, consultez notre guide étape par étape sur la façon d'installer un plugin WordPress.
Lors de l'activation, rendez-vous sur Flux Facebook » Paramètres et entrez votre clé de licence dans le champ « Clé de licence ».

Vous trouverez ces informations sous votre compte sur le site Web de Smash Balloon.
Après avoir entré la clé, cliquez sur le bouton 'Activer'.
Connectez votre page ou groupe Facebook à WordPress
Le flux Facebook personnalisé de Smash Balloon vous permet d'intégrer des vidéos à partir de pages et de groupes Facebook. Vous pouvez même afficher les vidéos dans une fenêtre contextuelle lightbox afin que les gens puissent regarder la vidéo complète directement sur votre site Web WordPress.
La première étape consiste à connecter votre page ou groupe Facebook à WordPress, alors allez sur Flux Facebook » Tous les flux , puis cliquez sur « Ajouter nouveau ».

Smash Balloon vous permet d'afficher des publications de votre chronologie Facebook, des albums photo, des statuts Facebook, des événements, etc.
Puisque nous voulons intégrer des vidéos Facebook dans WordPress, vous devrez sélectionner « Vidéos », puis cliquer sur « Suivant ».

Maintenant, vous devez sélectionner la page ou le groupe Facebook d'où vous obtiendrez les vidéos.
Pour ce faire, cliquez sur "Ajouter un nouveau".

Ensuite, choisissez si vous souhaitez afficher les vidéos d'une page ou d'un groupe Facebook.
Une fois que vous avez fait cela, cliquez sur "Se connecter à Facebook".

Cela ouvre une fenêtre contextuelle dans laquelle vous pouvez vous connecter à votre compte Facebook et choisir les pages ou les groupes que vous souhaitez utiliser avec Smash Balloon.
Après cela, cliquez sur "Suivant".

Désormais, Facebook affichera toutes les informations auxquelles Smash Balloon aura accès et les actions qu'il peut effectuer.
Pour restreindre l'accès de Smash Balloon à votre compte Facebook, cliquez simplement sur pour désactiver l'un des commutateurs.
Sachez simplement que cela peut affecter les vidéos que vous pouvez intégrer sur votre blog ou site Web WordPress, nous vous recommandons donc de laisser tous les commutateurs activés.

Lorsque vous êtes satisfait de la configuration des autorisations, cliquez sur "Terminé".
Après quelques instants, vous devriez voir un message confirmant que vous avez connecté votre site WordPress à Facebook.
Cela fait, vous êtes prêt à cliquer sur "OK".

Smash Balloon vous renverra automatiquement au tableau de bord WordPress.
Comment intégrer des vidéos Facebook dans WordPress
À ce stade, vous verrez une fenêtre contextuelle avec le groupe ou la page Facebook que vous venez de lier à votre site Web. Sélectionnez simplement le bouton radio à côté de la page ou du groupe que vous souhaitez utiliser, puis cliquez sur le bouton "Ajouter".

Si vous avez accidentellement fermé la fenêtre contextuelle, ne vous inquiétez pas. Vous pouvez simplement actualiser la page pour rouvrir la fenêtre contextuelle.
Une fois que vous avez fait cela, WordPress vous ramènera automatiquement à la page Flux Facebook »Tous les flux . Comme avant, cliquez sur "Ajouter un nouveau", sélectionnez "Vidéos", puis cliquez sur le bouton "Suivant".
Maintenant, sélectionnez votre page ou groupe Facebook et cliquez sur "Suivant".

Sur cet écran, vous pouvez choisir le modèle que vous souhaitez utiliser pour le flux vidéo.
Tous ces modèles sont entièrement personnalisables afin que vous puissiez affiner la conception en fonction de la manière dont vous souhaitez afficher les vidéos Facebook sur votre site Web.
Nous utilisons le modèle "Par défaut", mais vous pouvez choisir le modèle de votre choix. Après avoir fait votre sélection, cliquez sur "Suivant".

Après cela, vous pouvez choisir d'afficher toutes les vidéos de votre page ou groupe Facebook ou uniquement les vidéos d'une liste de lecture spécifique.
Si vous choisissez "Afficher à partir d'une liste de lecture spécifique", vous devrez saisir l'URL de cette liste de lecture.

Une fois que vous avez pris une décision, allez-y et cliquez sur le bouton "Suivant".
Smash Balloon va maintenant créer un flux basé sur votre source et le modèle que vous avez choisi. C'est un bon début, mais vous voudrez peut-être affiner la façon dont les vidéos apparaissent sur votre site.
Comment personnaliser vos vidéos Facebook intégrées
Le plugin Smash Balloon Custom Facebook Feed vous offre de nombreuses façons de personnaliser la façon dont les vidéos apparaissent sur votre site Web. Cela étant dit, cela vaut la peine de jeter un œil à ces paramètres.
Dans le tableau de bord WordPress, accédez à Flux Facebook » Tous les flux . Ici, trouvez le flux vidéo que vous venez de créer et cliquez sur le bouton "Modifier" à côté de celui-ci, qui ressemble à un petit crayon.

Cela ouvre l'éditeur de flux Smash Balloon, qui affiche un aperçu de votre flux vidéo Facebook à droite.
Sur le côté gauche, vous verrez tous les différents paramètres que vous pouvez utiliser pour personnaliser la façon dont ces vidéos apparaissent sur votre site Web WordPress. La plupart de ces paramètres sont explicites, mais nous couvrirons rapidement les principaux domaines.

Si vous souhaitez modifier le modèle, cliquez sur "Modèle".
Ensuite, sélectionnez le bouton "Modifier".

Cela ouvre une fenêtre contextuelle montrant tous les différents modèles que vous pouvez utiliser pour votre flux vidéo.
Sélectionnez simplement le design que vous souhaitez utiliser à la place, puis cliquez sur "Mettre à jour".

Le paramètre suivant est "Type de flux", qui vous permet d'afficher différents contenus dans votre flux. Par exemple, vous pouvez décider d'afficher des photos, des albums ou des événements au lieu de vidéos.
Puisque nous voulons intégrer des vidéos Facebook, vous voudrez généralement ignorer cette zone.
Ensuite, cliquez sur "Mise en page du flux".

Ici, vous pouvez choisir entre différentes dispositions, telles que la maçonnerie et la grille, et modifier la hauteur d'alimentation.
Au fur et à mesure que vous apportez des modifications, l'aperçu se met à jour automatiquement afin que vous puissiez essayer différents paramètres pour voir ce qui semble le mieux.

Par défaut, Smash Balloon affichera le même nombre de vidéos sur les ordinateurs de bureau et les appareils mobiles tels que les smartphones.
Vous pouvez prévisualiser l'apparence de vos vidéos sur les ordinateurs de bureau, les tablettes et les smartphones à l'aide de la rangée de boutons dans le coin supérieur droit.

Les appareils mobiles ont généralement des écrans plus petits et peuvent avoir du mal à traiter de nombreuses vidéos volumineuses et haute résolution. Les visiteurs peuvent également utiliser leurs données mobiles plutôt que le Wi-Fi gratuit.
Cela étant dit, vous souhaiterez peut-être afficher moins de vidéos sur les smartphones et les tablettes. Pour ce faire, saisissez simplement un numéro différent dans le champ "Mobile" sous "Nombre de publications".

Par défaut, le flux Facebook affiche moins de colonnes sur les smartphones et les tablettes que sur les ordinateurs de bureau. Cela permet à toutes vos vidéos de s'adapter confortablement sur des écrans plus petits.
Cependant, après avoir testé la version mobile de votre site WordPress, vous n'êtes peut-être pas satisfait de l'apparence des colonnes sur les tablettes et les smartphones.
Vous pouvez modifier le nombre de colonnes utilisées par Smash Balloon sur les tablettes, les mobiles et les ordinateurs de bureau à l'aide des paramètres "Colonnes".

La page de paramètres suivante est "Schéma de couleurs".
Smash Balloon utilise par défaut les couleurs héritées de votre thème WordPress, mais sur cet écran, vous pouvez à la place passer à un jeu de couleurs « clair » ou « foncé ».

Une autre option consiste à créer votre propre jeu de couleurs en sélectionnant "Personnalisé", puis en utilisant les commandes pour modifier la couleur d'arrière-plan, modifier la couleur du texte dans WordPress, etc.

Smash Balloon peut ajouter un en-tête à votre flux, qui est votre photo de profil Facebook et le nom de la page ou du groupe. Cela permet aux visiteurs de savoir d'où proviennent les vidéos intégrées et où ils peuvent trouver ce contenu sur Facebook.
Pour ajouter cette section, cliquez sur 'En-tête' dans le menu de gauche.

Vous pouvez ensuite cliquer sur le bouton "Activer".
Après avoir ajouté un en-tête, vous pouvez modifier l'apparence de cette zone, y compris masquer ou ajouter votre photo de profil Facebook, modifier la taille du texte bio, et plus encore.

Si vous souhaitez supprimer complètement l'en-tête, cliquez sur pour désactiver la bascule "Activer".
Par défaut, Smash Balloon affiche le titre de chaque vidéo. Si vous souhaitez masquer le titre, sélectionnez "Messages" dans le menu principal de l'éditeur Smash Balloon.
Ensuite, allez-y et cliquez sur "Style de publication".

Sur cet écran, vous pouvez masquer les titres des vidéos en cliquant sur le curseur "Afficher le titre de la vidéo".
Cela peut être utile si vous n'avez pas ajouté de titres à toutes vos vidéos ou si vos titres n'ont pas de sens en dehors de Facebook.

Sur cet écran, vous pouvez également masquer ou afficher les descriptions vidéo. Par exemple, vous pouvez utiliser ces descriptions pour fournir des informations supplémentaires sur la vidéo.
Pour ajouter la description, cliquez simplement pour activer le commutateur "Afficher la description de la vidéo".
Par défaut, Smash Balloon n'ajoute pas le bouton "J'aime" de Facebook à votre flux vidéo. Si les visiteurs aiment vos vidéos intégrées, ils voudront peut-être vous suivre sur Facebook.
Cela étant dit, vous pouvez ajouter un bouton "J'aime" au flux en sélectionnant "J'aime la boîte" dans le menu de gauche de l'éditeur.
Après cela, cliquez simplement sur le bouton "Activer" pour qu'il devienne bleu.

Smash Balloon ajoute ce bouton sous votre flux vidéo, mais vous pouvez modifier cela en ouvrant le menu déroulant "Position" et en choisissant "Haut".
Sur cet écran, vous pouvez également modifier l'apparence de la section "J'aime", notamment en modifiant sa largeur, en indiquant combien de personnes vous suivent sur Facebook, en ajoutant un appel à l'action personnalisé, etc.

Lorsque vous êtes satisfait de l'apparence du bouton, vous pouvez passer à la page de paramètres suivante en sélectionnant "Charger plus de bouton".
Le bouton Charger plus encourage les visiteurs à faire défiler une plus grande partie de votre flux vidéo, donc Smash Balloon l'ajoute par défaut à votre flux Facebook intégré.

Puisqu'il s'agit d'un bouton si important, vous pouvez personnaliser ce bouton en modifiant sa couleur d'arrière-plan, son état de survol, son étiquette, etc.
Une autre option consiste à supprimer complètement le bouton en cliquant sur le bouton "Activer". Par exemple, vous pouvez supprimer ce bouton, puis encourager les visiteurs à consulter votre page Facebook afin de voir plus de vos vidéos.

Par défaut, Smash Balloon permet aux visiteurs de regarder vos vidéos Facebook sans quitter votre site WordPress.
Ils peuvent simplement cliquer sur n'importe quelle vignette vidéo pour l'ouvrir dans une lightbox, comme vous pouvez le voir dans l'image suivante

Les visiteurs peuvent faire défiler les vidéos de votre flux à l'aide des flèches.
S'ils veulent aimer une photo, laisser un commentaire ou partager la vidéo sur leur page, ils peuvent cliquer sur le lien "Voir sur Facebook".

Il existe plusieurs façons de personnaliser la lightbox par défaut de Smash Balloon.
Pour voir vos options, cliquez sur "Lightbox" dans le menu de gauche.

Ici, vous pouvez modifier la couleur du texte, des liens et des couleurs d'arrière-plan de la lightbox.
La fonction lightbox permet aux visiteurs de regarder vos vidéos dans une fenêtre contextuelle. Si vous préférez, vous pouvez désactiver la visionneuse afin que toutes vos vidéos soient lues sous forme de petites vignettes, intégrées dans le contenu de la page.
De cette façon, vous pouvez encourager les gens à visiter votre page Facebook, pour voir la vidéo en taille réelle. Pour désactiver la lightbox, cliquez simplement sur la bascule "Activer" pour la faire passer du bleu au gris.

Lorsque vous êtes satisfait de l'apparence du flux vidéo, n'oubliez pas de cliquer sur "Enregistrer".
Vous êtes maintenant prêt à intégrer le flux Smash Balloon dans votre site Web.
Comment ajouter des vidéos Facebook à WordPress
Avec Smash Balloon, vous pouvez ajouter le flux vidéo à votre site Web WordPress à l'aide d'un bloc, d'un widget ou d'un shortcode.
Si vous avez créé plusieurs flux à l'aide de Smash Balloon, vous devez connaître le code du flux si vous souhaitez utiliser un widget ou un bloc.
Pour obtenir ce code, accédez à Flux Facebook » Tous les flux , puis regardez la partie feed=""
du shortcode. Vous devrez ajouter ce code au bloc ou au widget, alors notez-le.
Dans l'image suivante, nous devrons utiliser feed="6"

Si vous souhaitez intégrer votre flux Facebook dans une page ou une publication, nous vous recommandons d'utiliser le bloc Flux Facebook personnalisé.
Ouvrez simplement la page ou publiez où vous souhaitez intégrer vos vidéos Facebook. Ensuite, cliquez sur l'icône "+" pour ajouter un nouveau bloc et commencez à taper "Flux Facebook personnalisé".
Lorsque le bon bloc apparaît, cliquez pour l'ajouter à la page ou à la publication.

Le bloc affichera l'un de vos flux Smash Balloon par défaut. Si vous souhaitez utiliser un flux vidéo différent à la place, recherchez "Paramètres de code court" dans le menu de droite.
Ici, ajoutez simplement le code feed=""
, puis cliquez sur "Appliquer les modifications".

Le bloc affichera maintenant les vidéos de votre page ou groupe Facebook. Il vous suffit de publier ou de mettre à jour la page pour diffuser le flux vidéo en direct sur votre site Web.
Une autre option consiste à ajouter le flux à n'importe quelle zone prête pour les widgets, telle que la barre latérale ou une section similaire. Cela permet aux visiteurs de regarder vos vidéos Facebook depuis n'importe quelle page de votre site.
Allez simplement dans Apparence » Widgets puis cliquez sur le bouton bleu '+'.

Après cela, recherchez le widget "Flux Facebook personnalisé".
Ensuite, faites-le simplement glisser sur la zone où vous souhaitez afficher le flux vidéo.

Le widget affichera automatiquement l'un de vos flux Smash Balloon.
Pour afficher un flux différent à la place, saisissez ou collez le code du flux dans la zone "Paramètres du code court", puis cliquez sur "Appliquer les modifications".

Vous pouvez maintenant faire vivre le widget en cliquant sur le bouton 'Mettre à jour'. Pour plus d'informations, veuillez consulter notre guide étape par étape sur la façon d'ajouter et d'utiliser des widgets dans WordPress.
Enfin, vous pouvez intégrer des vidéos sur n'importe quelle page, publication ou zone prête pour les widgets à l'aide d'un code court.
Allez simplement sur Facebook Feed » All Feeds et copiez le code dans la colonne « Shortcode ». Vous pouvez maintenant ajouter ce code à n'importe quel bloc Shortcode.
Pour obtenir de l'aide pour placer le shortcode, veuillez consulter notre guide sur la façon d'ajouter un shortcode.
Ajouter une vidéo Facebook spécifique dans WordPress
Parfois, vous souhaiterez peut-être intégrer une vidéo Facebook spécifique dans une page ou une publication. Par exemple, vous pourriez avoir une vidéo Facebook qui parle des mêmes sujets que votre dernier blog, ou une vidéo promotionnelle montrant le produit que vous venez de lancer sur votre boutique en ligne.
Pour intégrer une vidéo spécifique, vous devrez acheter et installer l'extension Featured Posts car elle vous permet d'afficher une publication ou un événement particulier à l'aide de son ID.
Pour commencer, rendez-vous sur Flux Facebook » Extensions .
Ici, trouvez l'extension "Articles en vedette" et cliquez sur son bouton "Ajouter".

Cela ouvrira le site Web Smash Balloon dans un nouvel onglet, avec des instructions sur la façon d'acheter l'extension.
Une fois que vous avez l'extension, vous pouvez l'installer exactement de la même manière que vous installez un plugin. Si vous avez besoin d'aide, veuillez consulter notre guide sur la façon d'installer un plugin WordPress.
Après avoir activé le plug-in, accédez à Flux Facebook » Tous les flux et cliquez sur « Ajouter un nouveau ».
Sous "Types de flux avancés", sélectionnez "Message en vedette unique", puis cliquez sur "Suivant".

Vous pouvez maintenant choisir la page ou le groupe que vous souhaitez utiliser comme source en suivant le même processus décrit ci-dessus.
Sur la page suivante, vous devrez entrer l'ID de la vidéo que vous souhaitez intégrer.

Pour obtenir cet identifiant, visitez Facebook dans un nouvel onglet, puis ouvrez la vidéo que vous souhaitez intégrer.
Vous pouvez maintenant continuer et copier l'URL.

Après cela, publiez simplement l'URL dans votre tableau de bord WordPress et cliquez sur "Suivant".
Une fois que vous avez fait cela, vous pouvez styliser la vidéo, puis l'ajouter à votre site en suivant le même processus décrit ci-dessus.
Nous espérons que cet article vous a montré comment intégrer une vidéo Facebook dans WordPress. Vous voudrez peut-être consulter notre guide sur la création d'une newsletter par e-mail et notre sélection d'experts des meilleurs plugins de galerie vidéo YouTube.
Si vous avez aimé cet article, veuillez vous abonner à notre chaîne YouTube pour les didacticiels vidéo WordPress. Vous pouvez également nous retrouver sur Twitter et Facebook.