Vous voulez ajouter des vidéos de YouTube, Vimeo, Reuters et Ted dans votre site WordPress? C’est facile. Dans cet article, je partage ma méthode préférée pour ajouter des vidéos dans un article ou une page d’un site WordPress. Je vous demande aussi de partager votre méthode pour ajouter une vidéo dans WordPress puisqu’il y en a d’autres, mais je suis attachée à celle décrite dans cet article.
Article publié le 29 avril 2010
Mis à jour le 6 février 2014
Ajouter une vidéo en copiant le lien de la vidéo
WordPress par défaut vous permet de simplement copier le lien de la vidéo – de la coller dans votre article ou votre page – et voilà – c’est fait. Par exemple pour ajouter cette vidéo:
… j’ai simplement été sur le site de YouTube et copié http:// www.youtube.com/watch?v=w0YaEsTwpWE et l’ai collé dans le Visuel de mon article. Et la vidéo est là! Formidable.
Ce service d’insertion de vidéos à partir du URL est disponible pour les services énumérés ici sur le site de WordPress (blip.tv… wordpress.tv)
La règle d’or – le code EMBED ou INTÉGRER
Si vous voyez une vidéo sur le Web et que vous désirez la partager sur votre site WordPress, vous pouvez également l’intégrer à partir du code Intégrer du vidéo. Si la vidéo n’a pas de code Intégrer ou Partager ou Embed, je ne la partage pas puisque je présume que l’auteur n’a pas donné le permission de la partager. Dans YouTube, par exemple, l’usager peut permettre ou interdire le partage de ses vidéos en choisissant une des options EMBED suivantes:
Si la vidéo a un code EMBED – INTÉGRER – allez-y! Copiez le code INTÉGRER et collez-le dans votre site WordPress.
Ajoutez une Vidéo de YouTube
Le code Intégrer n’apparaît pas par lui-même sur YouTube. Il faut maintenant cliquer sur Partager et ensuite sur Intégrer et copiez le code Intégrer:
Dans la nouvelle fenêtre, copiez le code iframe comme dans l’image qui suit:
POUR COPIER
Dans votre PC: Ctrl + C ou le côté droit de votre souris
Dans votre Mac : cmd + C ou le côté droit de votre souris
Retournez à votre article ou page WordPress et collez le code Intégrer dans le HTML (Texte) de votre article ou page WordPress. Voir HTML (Texte) sur cette image:
Le vidéo n’apparaîtra pas dans votre Tableau de bord WordPress – vous verrez au lieu une boîte jaune (ou blanche) avec l’icône Flash dans le milieu. Si vous ne voyez pas cette boîte, recommencez!
Comment redimensionner les vidéos
Le code Intégrer de chaque vidéo contient ces données height= »434″ width= »578″. Cela veut dire que la vidéo a une hauteur de 434 pixels et une largeur de 578 pixels. Pour redimensionner votre vidéo, il faut réajuster – de façon proportionnelle – ces données. Pour trouver les bonnes dimensions, j’utilise Photoshop.
Personnellement j’utilise le plugin Viper’s Video Quicktags (http://wordpress.org/extend/plugins/vipers-video-quicktags) sur certains blogs. L’insertion de vidéos est très simple et leur aspect personnalisable.
Sinon, la méthode du embed code me convient aussi très bien et pour ajuster la taille, j’utilise une calculette… (la plupart de mes vidéos sont au format 4/3 donc c’est assez simple).
Joakim
Bonjour Joakim, Je viens de tester l’extension Viper’s Video Quicktags et c’est excellent! Je pense que ça pourrait servir à des clients WordPress débutants ou intermédiaires. C’est plus simple que le code EMBED et ça permet de redimensionner la vidéo sans trop d’effort. Merci infiniment. Diane
Bonjour Diane et Joackim,
Merci pour vos solutions en ce qui concerne l’introduction d’une vidéo dans un post wordpress, j’en profite de l’occasion pour vous félicité pour votre blog que je trouve très professionnelle .
Colin
je veux que que d’autre youtube apparaissent sur mon lecteur apres la fin de la lecture du youtube
que j’ai insere
C’est très simple. Dans YouTube, quand vous cliquez sur « Intégrer » (Embed) sous un vidéo YouTube, assurez-vous de cliquer sur « Inclure les vidéos similaires » dans les options avancées en dessous du code « Intégrer ». Vous ne pourrez pas sélectionner les vidéos à ajouter et le visiteur pourra cliquer sur un petit icone en bas du vidéo pour afficher les vidéos similaires. À la fin du vidéo, d’autres vidéos apparaitront sur le vidéo. Bonne chance.
Merci pour ce billet 🙂 je cherchais une réponse claire et simple pour intégrer des vidéos!!
Superbe billet … j’ai réussi à intégrer ma 1ere video.
Par contre redimentionner la video pose toujours problème …
merci beaucoup pour ce tuto, pour une fois qu’on trouve une solution simple à un problème dans wordpress ça fait plaisir de voir des gens qui ont à coeur d’aider leurs prochains avec des solution clairement expliquée !!!
Bonjour,
Est-ce que le EMBED code existe encore sur You tube aujourd’hui (octobre 2011)? car je ne retrouve ce code/boutton embed nulle part. Plusieurs training indiquent cette façon de faire mais je me demande si You tube a fait des modifications a son site et a enlevé ces codes. Si pour votre part, vous les voyez toujours, pouvez-vous m’indiquer comment afficher ce boutton « embed » pour que je puisse cliquer dessus et suivre le reste de vos étapes pour insérer une vidéo You tube sur WordPress.
Je vous remercie a l’avance pour votre aide. Je n’ai trouvé cette information nulle part sur le Web jusqu’a présent. Je vous en serais donc très reconnaissante.
Merci
Lucianne, j’ai mis à jour mon article. Oui, le code EMBED a été changé chez YouTube à INTÉGRER. J’explique le tout dans la mise à jour. Merci pour votre commentaire – ça m’a forcée un peu à mettre cet article à jour. Ça fait quand-même plusieurs mois que YouTube a changé ça… Diane
Bonjour,
Je souhaite mettre une vidéo sur mon blog WordPress. Lorsque j’édite mon article, j’arrive à faire tout ce qui faut mais lorsque je fais « mettre à jour » mon code html s’enlève !!! De ce fait je n’arrive pas à poster de vidéos. Pouvez-vous s’il vous plait, m’aider à résoudre ce problème ?
Merci par avance.
Est-ce que votre blogue est hébergé par vous-même ou chez wordpress.com?
Avez-vous cliquer sur « Utiliser l’ancien code d’intégration » comme dans l’image dans mon article?
Ça devrait marcher!
Attention aussi à coller le code dans l’onglet « html » et pas dans « Visuel ».
Bonsoir (ou bonjour…) et merci pour ce post ^^ Je viens de débarquer sur WordPress, et en général en bidouillant je m’en sors, mais je bute sur quelque chose dès mon second article. Et ô miracle, le premier lien explicatif sur lequel je tombe est le bon. C’est rare !
Je garde votre blog au chaud au cas où, c’est clair et bien expliqué, j’aime 🙂
~aelita
Merci Aelita – contente que cet article t’a aidée! Diane
Bonjour,
Savez-vous s’il est possible de publier une vidéo directement sur la page d’accueil de mon site wordpress (Parmis les widgets à droites) ?
Si oui, comment ?
Merci d’avance et belle journée à vous !
Oui, il y a deux façons.
1. Simplement ajouter le code de YouTube dans un Widget Texte. Cliquez sur Apparence | Widgets | Texte et collez le code dans le Widget Texte.
2. Avec l’extension Video widget de nikohk qui permet de simplement ajouter le URL du vidéo dans un Widget. Je l’utilise régulièrement pour mes clients qui veulent facilement ajouter des vidéos dans leur barre latérale (sidebar).
Bonne chance!
Bonjour, j’ai essaye d’ajouter les videos youtube sur un site a votre maniere mais rien y fait tous les carres coches, un par un, chaque format de video , impossible a chaque fois que je publie la video le site m’enleve directement le carre transparent donc je renonce . Mais si vous voulez me repondre en mp pas de pobleme de plus je vous donnerai l’adresse du site si vous repondez merci
Super , c’est exactement ce que je cherchais!!! J’avais réussi toute seule en fait 🙂 : je voyais la boite jaune avec l’icône flash mais ne savais pas si au moment de publier on verrait bien la vidéo! j’ai ma réponse. Merci pour ce post très clair et simple.
salut!! l’intégration par youtube et dailymotion pas de problème, mis à part lorsque l’on utilise de la musique connu pendant quelques secondes vu que j’ai perdu le son de ma vidéo de présentation. J’avais intégré du bonobo dedans!!
j’ai un blog que je transforme en site pour parler et présenter de la politique e l’économie des sciences des animations et courts métrage. de l’audio des témoignages, mais mon souci c’est que je n’arrive pas à faire apparaître même en mettant le code en html, ma vidéo dans un article ou en dehors, un indice? je viens juste de m’offrir un paquet pro wordpress à 99$ j’ai eu raison? je télécharge un module pour du Ecommerce et pour que l’on s’inscrive sur mon site pour lire et regarder les contenu en entier !!!
Merci pour toutes ces informations très utiles !
J’ai une question concernant les vidéos ou formats similaires en flash, prenons par exemple les présentations Vuvox ou Madmagz.
Elles ne sont pas intégrables dans WordPress simple(version online gratuite). Je souhaiterais savoir si cela marcherait avec un pack pro à 99$ par an. En tant qu’utilisateur gratuit, je ne peux pas leur poser directement la question et je n’arrive à trouver la réponse nulle part, peut-être une question de formulation (en anglais, en français, en tapant wordpress pro, embed, etc…).
Mais en faisant la recherche, je suis tombée sur votre site, j’en suis ravie.
Merci de m’éclairer si vous le pouvez.
Mina.
Bonjour tlm et merci à Diane pour ses nombreux articles.
Pour ma part, sur la vidéo choisie sur le web, je fais un clic droit , sur l’encart apparent cliquer sur « copier code d’intégration » puis sur la page ou article WP,en cours de rédaction, cliquer sur « TEXTE » ou HTML suivant modèle de WP, sur la page HTML allez à l’endroit où vous désirez faire apparaitre la vidéo et faire un « coller » la balise <iframe avec toutes les coordonnées de la vidéo, dont l'embed,seront adjointes au code , revenir en "VISUEL", cliquer sur mettre à jour, constater que le cadre de la vidéo est en place, "afficher l'article" : normalement la vidéo n'attend que votre bon vouloir :-).Bonne année à tous.
Bonjour à tous,
J’arrive à intégrer des vidéos dans mes articles sans trop de problème mais cela apparait comme un lien et donc le média ou la vidéo n’est pas directement accessible en play/stop sur mon blog (je ne sais pas si je suis claire). Je voudrais que la vidéo apparaisse réellement dans mon article, pas avec un lien. Quelqu’un peut-il m’aider ?
Merci beaucoup 🙂 Grace à vous j’ai pu mettre mon travail (video) sur mon site.
Slt! je voudrais inserer un fichier PDF dans une page mais a chaque fois on me dit que ma taille st dépassé. Est ce que vous pouriez m’aider? Merci
Bonjour, merci pour vos bons conseils. J’ai pu insérer une vidéo et changer ses dimensions. Maintenant je souhaiterais en désactiver le son. Est ce possible ? Merci d’avance,
Bonjour
Comment faire pour insérer une vidéo de Youtube mais que le lecteur n’apparaisse pas, ni les bandeaux du haut et du bas ?
En cherchant j’ai trouvé une solution :
XXXXXXpour le chemin de la vidéo
Le problème c’est qu’apparait alors sur la vidéo un logo ItunesHD en bas à droite et je n’arrive pas à le faire disparaître.
Est-ce que vous avez la solution ?
Merci
Bien cordialement
Philippe
Merci pour ce tuto super bien expliqué. Je voudrais savoir quand on partage une vidéo vimeo sur WordPress si il est possible de l’avoir en HD. Je n’y arrive pas.
Je pense qu’il faut un compte Plus ou Pro pour afficher les vidéo en HD par défaut avec Vimeo. https://vimeo.com/help/faq/sharing-videos/embedding-videos#can-i-make-my-embedded-videos-default-to-hd Moi, j’ai le compte Pro et toutes mes vidéos sont en HD. Bonne chance avec Vimeo (que j’aime beaucoup)!
http://i.imgur.com/n7iRxY5.jpg
Merci pour ce post qui, complété par les questions-réponses, m’a permis de redimensionner les fenêtres vidéo qui apparaissent sur les pages de mon blog WordPress quand je colle des liens YouTube. Je trouvais le format des vidéos franchement trop grand. Pour résumer la manip, cliquer sur Partager ; puis sur Intégrer ; copier le « <iframe width &c" (qui comporte les dimensions de la fenêtre vidéo, largeur et hauteur) puis le coller dans votre page WordPress (non en Visuel mais en Texte) et redéfinir les dimensions, par exemple, au lieu de 560*315, 360*200 ou tout autre format qui convient le mieux à votre page.
Bonjour,
L’intégration de videos marche super bien, mais je souhaiterais choisir l’image qui s’affiche lorsque la video n’est pas chargée. Est-ce possible?
Marci