Partager du contenu vidéo en direct via votre site WordPress est un moyen puissant d’engager le dialogue avec votre public en temps réel.
L’intégration d’une diffusion en direct sur YouTube permet aux internautes de regarder des événements, des webinaires et des émissions spéciales directement sur votre site, ce qui améliore l’interaction avec les utilisateurs et élargit votre portée.
Chez WPBeginner, nous reconnaissons que YouTube est une plateforme puissante qui peut générer un trafic important. C’est pourquoi nous avons créé notre propre chaîne et publions régulièrement des vidéos pour attirer plus de visiteurs sur notre blog. Cette stratégie nous a permis d’élargir notre portée et d’entrer en contact avec un public plus large.
Dans cet article, nous allons vous afficher comment intégrer facilement une diffusion directe de YouTube en direct dans WordPress.

Pourquoi embarquer des diffusions directes de YouTube dans WordPress ?
La diffusion en direct vous permet de diffuser un contenu vidéo ou audio en direct sur l’internet, ce qui permet aux utilisateurs/utilisatrices de regarder la vidéo en temps réel.
Intégrer une diffusion en direct de YouTube sur votre site WordPress est un excellent moyen d’entrer en contact avec votre public et d’atteindre davantage d’utilisateurs.

Il peut également accroître l’engagement des utilisateurs/utilisatrices en vous permettant d’interagir avec les internautes.
Une diffusion en direct sur YouTube peut également aider à stimuler le référencement du site et à attirer davantage de trafic. Des recherches ont affiché que les publications de blog comportant au moins une vidéo obtiennent environ 83 % de visiteurs en plus que les contenus qui n’en comportent pas.
Ceci étant dit, voyons comment vous pouvez facilement intégrer une diffusion directe de YouTube en WordPress.
Comment embarquer une diffusion directe de YouTube en WordPress
Le moyen le plus simple d’intégrer une diffusion directe de YouTube est d’utiliser l’extension YouTube Feed Pro de Smash Balloon.
C’est le meilleur plugin WordPress YouTube du marché qui vous permet d’intégrer des vidéos YouTube et des flux en direct sur votre site web.
Tout d’abord, vous devez installer et activer l’extension YouTube Feed Pro. Pour plus d’instructions, veuillez consulter notre guide du débutant sur l’installation d’une extension WordPress.
Note: Feeds for YouTube dispose également d’une version gratuite. Cependant, elle ne supporte pas la fonctionnalité de diffusion en direct.
Une fois activé, visitez la page » Réglages » de YouTube Feed depuis la colonne latérale de l’administrateur WordPress. Ici, vous devez saisir la clé de licence et cliquer sur le bouton » Activer « .
Vous pouvez obtenir ces informations à partir de votre compte sur le site de Smash Balloon.

Ensuite, rendez-vous sur la page YouTube Feeds » All Feeds à partir du tableau de bord WordPress.
Cliquez ensuite sur le bouton « Ajouter une nouvelle » en haut de la page.

L’invite « Sélectionné le type de flux » s’affiche alors à l’écran.
Pour continuer, vous devez sélectionner l’option « Live Streams » et cliquer sur le bouton « Next ».

À l’étape suivante, vous devez connecter YouTube Feed Pro à votre compte YouTube. Il vous sera demandé de fournir votre clé API YouTube.
Si vous disposez déjà d’une clé API, il vous suffit de la copier et de la coller dans le champ « Saisir la clé API » et de cliquer sur le bouton « Ajouter ».

Créer une clé API YouTube
Si vous n’avez pas encore de clé API, rendez-vous dans la Google Cloud Console et connectez-vous à l’aide de votre compte Google.
Une fois connecté, cliquez sur le bouton « Sélectionné un projet » en haut de la page.

Une fenêtre surgissante s’ouvre et affiche tous les projets que vous avez créés.
Cliquez ensuite sur le bouton « Nouveau projet » dans le coin supérieur droit.

Vous accéderez à la page « Nouveau projet », où vous pourrez commencer par saisir un nom pour votre projet. Il peut s’agir de n’importe quel nom qui vous permettra de l’identifier facilement.
Ensuite, vous devez sélectionner une « Organisation » et son emplacement dans le menu déroulant. Vous pouvez choisir « Pas d’organisation » et cliquer sur le bouton « Créer » pour continuer.

Une fois le projet créé, vous accédez au Tableau de bord du projet.
À partir de là, cliquez sur le bouton » + Activer les API et les services » dans le menu supérieur.

Vous accéderez à la page Bibliothèque d’API. Elle affiche les différents services Google pour lesquels vous pouvez créer des API et les utiliser dans vos projets.
Recherchez ensuite « YouTube Data API v3 » dans le champ de recherche.

Une fois que le résultat « YouTube Data API v3 » s’affiche, cliquez dessus.
Vous serez maintenant dirigé vers un nouvel écran où vous devez cliquer sur le bouton » Activer » pour activer la clé API de YouTube.

Vous accéderez ainsi à la page « Détails de l’API/du service ».
Cliquez ensuite sur le bouton « Create Credentials » en haut de la page.

Ensuite, vous serez dirigé vers une nouvelle page, où vous devrez cocher la case à côté de l’option « Données publiques ».
Cliquez ensuite sur le bouton « Suivant » pour créer votre API.

Votre Clé de l’API sera maintenant créée et affichée sur la page.
Il suffit de copier cette clé et de cliquer sur le bouton « Terminé ».

Il est maintenant temps de retourner au Tableau de bord WordPress.
Collez la clé de l’API dans le champ Clé de l’API nécessaire. Cliquez ensuite sur le bouton « Ajouter » pour continuer.

Ajouter le flux en direct de YouTube à votre site Web WordPress
Une fois que vous avez ajouté votre clé API YouTube, vous êtes redirigé vers la page » Sélectionner le type de flux « .
Cliquez ensuite à nouveau sur l’option « Diffusion en direct », puis sur le bouton « Suivant ».
La page « Add Channel ID For Direct Stream » (Ajouter un ID de chaîne pour la diffusion en direct) s’ouvre.

Vous devez maintenant vous rendre sur la chaîne YouTube qui contient vos vidéos diffusées en direct.
Copiez le texte qui suit ‘/channel/’ ou ‘/user/’ dans l’URL en haut de la page.

Ensuite, retournez dans le Tableau de bord WordPress et collez le code dans la case » Add Channel ID for Livestream « .
Ensuite, cliquez sur le bouton « Connecter » pour connecter votre chaîne YouTube à WordPress.
Une fois le canal connecté, cliquez sur le bouton « Suivant » pour continuer.

Personnaliser votre flux YouTube
En direct, votre flux de diffusion en direct sur YouTube a été créé, vous pouvez maintenant le personnaliser. Smash Balloon’s YouTube Feed Pro offre de nombreuses options d’affichage différentes.
Tout d’abord, vous devez choisir un modèle sur la page « Commencer avec un modèle ». Vous avez le choix entre les modèles Default, Carousel, Cards, List, Gallery et Grid.
Une fois que vous avez fait votre choix, cliquez sur le bouton « Suivant ».

Une fois que vous avez fait cela, un écran de modification s’ouvre qui affiche une Prévisualisation de votre flux YouTube à droite et des Réglages de personnalisation dans la colonne de menu de gauche.
Vous pouvez commencer par déplier le panneau « Mise en page du flux ».

Dans cet écran, vous pouvez passer d’une mise en page à l’autre.
Vous pouvez également être en mesure de définir des réglages supplémentaires en fonction de la mise en page choisie.

Ensuite, vous devez cliquer sur le panneau « Jeu de couleurs ».
Par défaut, YouTube Feed Pro utilise le même jeu de couleurs que votre thème WordPress. Cependant, vous pouvez également utiliser un jeu de couleurs « clair » ou « foncé » pour le flux vidéo.
Vous pouvez également créer votre propre jeu de couleurs en cliquant sur l’option « Personnalisé », puis en utilisant les commandes pour modifier les couleurs de l’arrière-plan, du texte et des liens.

Pour ajouter un en-tête à votre flux YouTube, vous devez vous rendre dans le panneau « En-tête ». De là, permutez l’interrupteur « En-tête » pour activer l’en-tête.
Vous pouvez également utiliser les commandes pour passer d’un style d’en-tête standard à un style d’en-tête texte. Choisir l’option « Texte » vous permet de modifier la taille et la couleur du texte.

Vous pouvez également personnaliser l’apparence du lecteur vidéo en vous rendant dans le panneau « Vidéos ».
Consultez cette page pour obtenir une liste d’options.

Pour personnaliser la mise en page de la vidéo et ses propriétés individuelles, consultez le panneau de réglages « Style de vidéo ».
Vous pouvez y sélectionner la mise en page de la vidéo, la couleur d’arrière-plan et la bordure.

Ensuite, ouvrez le panneau « Modifier les modifications individuelles ». Cochez les cases situées à côté des éléments que vous souhaitez afficher avec les vidéos YouTube en direct.
Vous pouvez afficher ou masquer l’icône En direct, le titre de la vidéo, le compte à rebours de la diffusion en direct, les descriptions, etc.

Passez ensuite au réglage « État de survol ». Ici, vous pouvez choisir les éléments individuels qui s’afficheront lorsque le compte survolera la vidéo YouTube.
Vous pouvez choisir de nombreux éléments, notamment le titre de la vidéo, la description, la date, les vues, etc.

Ensuite, visitez le panneau « Video Player Experience ».
Vous pouvez désormais modifier la proportion de taille du lecteur vidéo. Vous pouvez également choisir de lancer la lecture de la vidéo automatiquement ou d’attendre que l’internaute clique sur le bouton de lecture.

Après avoir personnalisé les différents éléments de la vidéo, passez au panneau « Load More Button ».
Ici, sous le réglage du bouton « Charger plus », vous pouvez permuter sur « Activer ». Cela permettra d’afficher d’autres suggestions de vidéos après le livestream.
Vous pouvez également choisir la couleur d’arrière-plan, l’état de survol et le texte dans les Réglages du panneau de gauche.

Ensuite, passez au panneau » Bouton d’abonnement » et permutez le commutateur sur » Activer » si vous souhaitez activer le bouton d’abonnement à YouTube.
Vous pouvez également modifier la couleur, le texte et l’état de survol du bouton dans les Réglages.

Une fois que vous avez personnalisé le flux en direct de YouTube, vous pouvez en prévisualiser l’aspect sur les ordinateurs de bureau, les tablettes et les smartphones. Il suffit de cliquer sur les différents boutons dans le coin supérieur droit pour prévisualiser le flux sur différents appareils.
Enfin, n’oubliez pas de cliquer sur le bouton « Enregistrer » en haut de la page pour enregistrer vos modifications.

Intégrer le flux en direct de YouTube sur une page WordPress
L’étape suivante consiste à embarquer votre flux direct YouTube sur une page WordPress. Pour ce faire, vous devez d’abord cliquer sur le bouton » Contenu embarqué » situé en haut.
La fenêtre « Embed Feed » s’ouvre. Pour continuer, cliquez sur le bouton « Ajouter à une page ».

La fenêtre surgissante affiche alors une liste de toutes les pages WordPress de votre site.
Choisissez simplement la page où vous souhaitez intégrer la diffusion en direct de YouTube et cliquez sur le bouton « Ajouter ».

La page que vous avez sélectionnée s’ouvre alors dans l’éditeur/éditrices de blocs.
Cliquez ensuite sur le bouton « Ajouter un bloc » (+) dans le coin supérieur gauche et recherchez le bloc Feeds for YouTube.
Une fois que vous l’avez trouvé, vous pouvez ajouter le module à votre page en cliquant dessus.

N’oubliez pas de cliquer sur le bouton « Mettre à jour » ou « Publier » pour enregistrer vos modifications ou les rendre directes.
Voici à quoi ressemble le flux direct de YouTube sur notre site de démonstration.

Ajouter un flux YouTube en direct sous forme de widget
Vous pouvez également ajouter un flux direct de YouTube à la colonne latérale de WordPress sous la forme d’un widget.
Tout d’abord, rendez-vous sur la page Apparence » Widgets de la colonne latérale d’administration.
Cliquez sur le bouton « Ajouter un module » (+) dans le coin supérieur gauche de l’écran et trouvez le module Feeds for YouTube.
Ensuite, cliquez sur le module pour l’ajouter à la zone de widget.

N’oubliez pas de cliquer sur le bouton « Modifié » pour enregistrer vos modifications.
Voici à quoi ressemble le flux direct de YouTube dans la colonne latérale de notre site de démonstration.

Ajouter un flux YouTube en direct dans l’éditeur de site complet
Si vous utilisez un thème basé sur des blocs, cette méthode est faite pour vous.
Tout d’abord, rendez-vous sur la page Apparence » Éditeurs/éditrices dans la colonne latérale de l’admin pour lancer l’éditeur de site.
Cliquez ensuite sur le bouton « Ajouter un module (+) » en haut de la page et recherchez le bloc Feeds for YouTube.
Ensuite, vous pouvez faire glisser et déposer le bloc à l’endroit où vous souhaitez afficher le flux YouTube sur votre page.

Une fois que vous avez terminé, n’oubliez pas de cliquer sur le bouton « Enregistrer » pour appliquer les modifications.
Voici une Prévisualisation des diffusions directes sur notre site de démonstration.

Bonus : Intégrer une liste de lecture YouTube dans WordPress
Outre les flux en direct, vous pouvez également intégrer des listes de lecture YouTube sur votre site WordPress grâce au plugin Smash Balloon YouTube Feed.
Vous pouvez utiliser cette liste de lecture pour attirer l’attention des utilisateurs, stimuler l’engagement et réduire les taux de rebond.
Pour ajouter une liste de lecture YouTube, rendez-vous sur la page YouTube Feeds » All Feeds et cliquez sur le bouton « Add New ». Vous accédez alors à un nouvel écran dans lequel vous devez sélectionner l’option « Liste de lecture » comme type de flux.

Ensuite, vous devrez connecter votre compte YouTube à Smash Balloon en fournissant sa clé API à partir de la Google Console.
Ensuite, vous devez ouvrir la liste de lecture YouTube que vous souhaitez ajouter et copier son ID à partir de l’URL ci-dessus. Cet identifiant sera une chaîne de lettres et de chiffres après le symbole « = » dans l’URL.

Vous pouvez maintenant vous rendre dans votre tableau de bord WordPress pour ajouter l’ID de la liste de lecture dans le champ « Add Source » et cliquer sur le bouton « Next ».
Une fois cela fait, l’éditeur de flux de Smash Balloon s’ouvrira à l’écran, où vous pourrez personnaliser l’apparence des listes de lecture à votre guise.

Vous avez maintenant ajouté avec succès votre liste de lecture YouTube. Pour plus de détails, vous pouvez consulter notre tutoriel sur l ‘intégration d’une liste de lecture YouTube dans WordPress.
Nous espérons que cet article vous a aidé à apprendre comment intégrer des diffusions directes de YouTube dans WordPress. Vous pouvez également consulter notre tutoriel sur l ‘intégration de SoundCloud dans les publications WordPress avec oEmbed et notre guide sur l ‘intégration d’un widget discord dans WordPress.
Si vous avez aimé cet article, veuillez alors vous abonner à notre chaîne YouTube pour obtenir des tutoriels vidéo sur WordPress. Vous pouvez également nous trouver sur Twitter et Facebook.
Have a question or suggestion? Please leave a comment to start the discussion.