Insérer une vidéo dans WordPress : mode d’emploi

La procédure pour intégrer des vidéos dans WordPress dépend de la solution que vous préférez parmi les trois susmentionnées. Il va de soi que la méthode consistant à utiliser un plug-in diffère de celle se basant sur la bibliothèque de médias intégrée ou sur le code d’intégration. Nous avons résumé pour vous les différentes étapes de ces trois solutions dans les paragraphes qui suivent.

Si vous êtes l’auteur ou le propriétaire d’une vidéo, vous pouvez à tout moment la charger dans la bibliothèque de médias de votre projet WordPress.

Étape 1 : Pour commencer, rendez-vous dans la rubrique Médias de l’interface d’administration en cliquant sur le bouton « Médias » dans le menu à gauche :

Étape 2 : Cliquez ensuite tour à tour sur « Ajouter » et « Choisir des fichiers ». Vous pouvez maintenant indiquer et confirmer l’emplacement de stockage du fichier vidéo souhaité pour lancer le chargement dans la bibliothèque de médias. Vous pouvez aussi glisser et déposer le clip dans le cadre prévu à cet effet (délimité par des lignes pointillées) :

Étape 3 : Ouvrez maintenant la page WordPress à laquelle vous voulez ajouter la vidéo et cliquez sur le symbole Plus pour ajouter un nouveau bloc :

Étape 4 : Faites défiler jusqu’à la rubrique « Médias » et sélectionnez l’entrée « Vidéo » pour ajouter un bloc de contenu vidéo à la page. Dans ce bloc, cliquez maintenant sur « Bibliothèque de médias ». WordPress ouvre l’aperçu des vidéos disponibles, où vous pouvez facilement sélectionner celle que vous voulez par un clic gauche. Si vous le désirez, vous pouvez inclure des métadonnées telles qu’un titre, une légende et une description. Enfin, pour intégrer la vidéo à votre projet WordPress, cliquez sur le bouton « Sélectionner ».

La vidéo est maintenant intégrée à votre page WordPress. Au besoin, vous pouvez comme avec n’importe quel autre bloc de contenu la déplacer ailleurs ou l’échanger avec d’autres éléments.

Pour éviter d’avoir à charger des vidéos dans votre espace Web et ainsi économiser beaucoup d’espace de stockage et de puissance de calcul, vous pouvez également recourir à une plateforme vidéo telle que YouTube ou Vimeo. Vous aurez la possibilité d’y obtenir un code d’intégration (« embed code » en anglais) à l’aide duquel vous pourrez intégrer la vidéo dans votre projet WordPress. Selon la teneur de votre site Web, vous pourrez aussi insérer des vidéos d’autres utilisateurs (à condition que ces derniers détiennent les droits relatifs au contenu et n’aient pas rendu les vidéos privées).

Pour ajouter une vidéo YouTube (la procédure diffère légèrement pour les autres plateformes) par un code d’intégration, suivez les étapes suivantes :

Étape 1 : Accédez à la vidéo YouTube voulue et cliquez sur le bouton « Partager » situé juste au-dessous du clip.

Étape 2 : Choisissez l’option « Intégrer » pour accéder aux options d’intégration. Là, vous pouvez soit conserver les paramètres par défaut, soit modifier légèrement le code d’intégration. D’une part, vous avez la possibilité de caler la vidéo au moment précis auquel elle devra démarrer automatiquement (« Démarrer à »). D’autre part, vous pouvez activer le mode de confidentialité avancé en cochant la case correspondante afin de protéger la vie privée de vos visiteurs. Pour finir, cliquez sur « Copier » afin d’enregistrer le code dans le presse-papier en vue de l’importer dans WordPress.

Étape 3 : Dans l’interface d’administration de WordPress, allez à la page dans laquelle vous voulez insérer la vidéo. Collez le lien du clip directement à l’endroit souhaité en créant un bloc HTML et en utilisant le raccourci clavier [Ctrl]+[v] ou en cliquant avec le bouton droit de la souris et en choisissant l’option « Coller ».

Étape 4 : WordPress insère automatiquement la vidéo au format habituel. En cliquant sur « Aperçu », vous pouvez prévisualiser le résultat.

Que vous chargiez des vidéos dans votre espace interne ou sur une plateforme externe, l’utilisation de plug-ins vidéo WordPress comporte l’avantage de pouvoir intégrer des images animées de la manière la plus simple qui soit tout en profitant de fonctionnalités supplémentaires pratiques. Pour ce faire, il suffit d’installer le plug-in souhaité. WordPress sera enrichi de menus faciles à utiliser dans son interface d’administration ou de boutons dans son éditeur pour manipuler l’extension concernée.

La façon la plus simple d’obtenir une vue d’ensemble des plug-ins vidéo WordPress disponibles est de consulter la section Plug-ins de l’interface d’administration. Vous pouvez également y installer, configurer et activer les extensions souhaitées (et si nécessaire les désactiver et les supprimer). La marche à suivre est la suivante :

Étape 1 : Dans le menu latéral gauche de l’interface d’administration de WordPress, allez à la section « Extensions » et cliquez sur l’option « Ajouter ».

Étape 2 : Vous pouvez maintenant taper un mot-clé dans la barre de recherche (en haut à droite) pour rechercher le plug-in vidéo WordPress de votre choix. Pour vous faire une idée générale, tapez par exemple « vidéo » :

Étape 3 : Après avoir choisi une extension, cliquez sur le bouton « Installer ». Après l’installation, vous pourrez activer le plug-in directement en cliquant sur le bouton « Activer l’extension » :

Étape 4 : Vous pouvez maintenant choisir d’accéder à l’extension via le sous-menu « Extensions installées » ou via un nouveau bouton personnalisé dans le menu latéral de l’interface d’administration, comme dans le cas du plug-in « Video Gallery » d’OriginCode illustré ici :

Quand il est question d’intégrer du contenu YouTube, il est difficile d’ignorer Embed Plus for YouTube. Le plug-in, qui compte plus de 200 000 installations actives et est compatible avec l’éditeur WordPress Gutenberg, permet d’incorporer des clips YouTube, mais aussi des playlists etchaînescomplètes ainsi que des livestreams. Le « YouTube Wizard » est un gestionnaire de configuration convivial disponible directement dans l’éditeur. En passant à la version Pro payante, des fonctionnalités supplémentaires, telles que le balisage automatique des vidéos pour le référencement ou une fonction de mise en cache, peuvent être débloquées.

Toute personne qui gère un blog connaît l’importance de proposer une performance fluide sur tous les terminaux. Le temps de chargement, en particulier, joue ici un rôle crucial. En conséquence, si les vidéos YouTube occupent une place importante dans votre blog WordPress, l’utilisation de WP YouTube Lyte est vivement conseillée.

Ce plug-in permet d’appliquer le lazy loading à toutes les vidéos WordPress intégrées. Très rapides à charger, les « Lite YouTube Embeds » ressemblent à des clips YouTube intégrés normaux, mais ne sont activées que lorsque le visiteur clique sur le lecteur (gourmand en mémoire). Autre fonctionnalité de l’extension : les vidéos YouTube peuvent être mises en cache localement, de sorte qu’il n’y a plus besoin de réaccéder aux serveurs de la plateforme vidéo ultérieurement.

Parmi les outils de conception pour les projets Web modernes, le défilement parallaxe est en train de devenir incontournable. Le plug-in gratuit Advanced WordPress Backgrounds (AWB) vous aide à mettre en œuvre cet effet dans votre projet WordPress. L’extension permet de créer des arrière-plans parallaxes personnalisés pour certaines pages à partir d’images ou de vidéos (auto-hébergées, YouTube ou Vimeo). La base technique est le puissant plug-in JavaScript Jarallax.

Une façon très appréciée de présenter plusieurs vidéos à la fois sur le Web est de créer des galeries, et le plug-in Video Gallery de Total Soft est une excellente solution pour mettre en œuvre cette fonction dans votre projet Web. Avec la version de base gratuite, vous pouvez composer et publier des galeries vidéo avec un nombre illimité de clips provenant de YouTube, Vimeo et Wistia ou de votre propre source.

Toutes les galeries sont réactives et peuvent être triées par glisser-déposer. Pour une conception personnalisée des galeries, nous vous conseillons de passer à l’une des versions payantes (à partir de 12,79 €). Vous aurez ainsi accès à des thèmes de galerie, polices de caractères et effets de survol supplémentaires, ainsi qu’à diverses autres options de style.