Intégrer ou embarquer une vidéo ou Google Maps dans WordPress

Intégrer ou embarquer une vidéo ou Google Maps dans WordPress
10 mn de lecture

Vous souhaitez intégrer ou embarquer un contenu externe tel qu'une vidéo YouTube, un podcast, une carte Google Maps ou encore une publication Facebook dans WordPress et vous ne savez pas comment procéder ?

Alors, sachez qu'il existe plusieurs solutions pour y parvenir sans installer un énième plugin.

Dans cet article, vous allez voir comment :

  • Insérer une vidéo ou autres contenus externes dans WordPress par un simple copier-coller de son URL
  • Embarquer des contenus externes avec les blocs de contenus embarqués de Gutenberg
  • Intégrer une vidéo YouTube ou une carte Google Maps avec un iframe dans l’éditeur de blocs WordPress, Elementor ou Divi

Embarquer un contenu externe dans WordPress via oEmbed

Pour le côté technique, oEmbed est un protocole qui permet à un site A (comme votre site WordPress) de demander à un site B (comme YouTube) le code nécessaire pour intégrer son contenu.

En bref, grâce à oEmbed, WordPress permet à votre site Web d'afficher du contenu intégré comme des vidéos ou autres sans installer d'extension supplémentaire. Il suffit juste que vous insériez le lien vers cette ressource.

Par contre, vous devez savoir que, pour des raisons de sécurité, WordPress ne prend en charge que certains fournisseurs oEmbed.

Les fournisseurs oEmbed autorisés par WordPress au 4 juillet 2025 sont :

  • Vidéos : YouTube, WordPress.tv, Vimeo, VideoPress, TikTok, TED, Screencast, Flickr, DailyMotion, Animoto, Amazon, Cloudup
  • Images : Flickr, Pinterest, Imgur, Cloudup
  • Musique : Spotify, SoundCloud, ReverbNation, Mixcloud, Anghami
  • Podcasts : Spotify, Pocket Casts
  • Présentations, diaporamas : Speaker Deck
  • Documents : Scribd, Issuu
  • Projets : Kickstarter
  • Sondages et enquêtes : Crowdsignal
  • Articles et commentaires : Reddit
  • Divers : WolframCloud, Tumblr, SmugMug, Twitter, Bluesky, Canva, Someecards

Vous pouvez par ailleurs consulter la liste mise à jour sur WordPress.org.

💡 Il est à noter que depuis octobre 2020, il n'est plus possible d'embarquer du contenu émanant de Facebook ou Instagram via oEmbed dans WordPress sans API d’authentification. Il vous faudra donc utiliser une extension dédiée (par exemple Smash Balloon Social Post Feed, Smash Balloon Social Photo Feed) ou bien les intégrer via iFrame.

Voyons à présent comment utiliser oEmbed pour intégrer un contenu multimédia dans WordPress.

Insérer une vidéo, un podcast, un tweet dans WordPress en copiant-collant son URL dans un paragraphe

Il s'agit de la méthode la plus rapide.

Pour intégrer un contenu externe dans une publication ou une page WordPress, copiez son URL. Puis, dans l'éditeur de WordPress, insérez un bloc "Paragraphe". Enfin, collez l'URL de la vidéo, du podcast, du tweet ou autre contenu supporté par WordPress oEmbed. Immédiatement. WordPress affiche le contenu.

Insérer un contenu d'un site tiers en utilisant les blocs contenus embarqués de WordPress

La deuxième méthode consiste à utiliser des blocs spécifiques pour embarquer des contenus externes. Vous les trouverez sous la catégorie "Contenus embarqués".

Ajouter un bloc contenu embarqué pour intégrer une vidéo ou autre dans WordPress

Là encore, copiez l'URL du contenu que vous souhaitez intégrer dans votre page ou article.

Puis, dans l'éditeur de WordPress, ajoutez le bloc de contenu embarqué correspondant au fournisseur oEmbed. Si aucun ne correspond, alors, choisissez "Contenu embarqué".

Enfin, collez l'URL dans le bloc et cliquez sur "embarquer".

Utiliser un bloc contenu embarqué pour intégrer une vidéo YouTube

WordPress convertit alors automatiquement l'URL en une intégration responsive pour peu que vous ne décochiez pas "Redimensionner pour les petits appareils". Vous pouvez si besoin ajouter des marges externes au contenu embarqué en les indiquant dans le panneau style du bloc et aussi modifier son alignement.

vidéo embarquée YouTube responsive, alignement et marges externes

💡 Parfois WordPress affiche "désolé ce contenu ne peut être embarqué". Cela survient lorsque le contenu contient une protection pour les oEmbed ou encore que la plateforme n'est pas compatible avec oEmbed. En ce cas, privilégiez la méthode d'intégration par iframe décrite ci-dessous.

Intégrer une vidéo, Google Maps sans API ou autre contenu externe dans WordPress avec un iframe (code embed)

Comme vous avez pu le constater, WordPress ne propose l'intégration de contenus externes via oEmbed que pour certaines plateformes.

Mais, rassurez-vous, il existe un autre moyen d'insérer des contenus externes sans installer de plugin : l'intégration d'un contenu d'un site tiers par le biais d'un iframe.

Pour ce faire, il suffit juste de copier-coller le code d'intégration HTML fourni par la plateforme externe dans votre site WordPress.

Ainsi, vous pouvez importer non seulement une carte Google Maps sans avoir besoin d'API, mais également des :

  • publications de réseaux sociaux (LinkedIn, Instagram, Twitter, Facebook...)
  • podcasts (Spotify, Ausha...)
  • vidéos (YouTube, Vimeo...)
  • ...

Par exemple, pour intégrer une vidéo de YouTube, allez sur la vidéo que vous souhaitez intégrer. Cliquez alors sur le bouton "Partager" qui se situe sous la vidéo. Puis, dans la fenêtre qui surgit, cliquez sur "Intégrer".

Ici, vous pouvez indiquer le moment où démarre la vidéo, choisir d'afficher les commandes du lecteur ou pas et aussi activer le mode de confidentialité avancé.

⚠️ Le mode de confidentialité avancé permet de charger la vidéo à partir du domaine youtube-nocookie.com au lieu de youtube.com. Mais, attention, le "nocookie" présent dans l'URL est trompeur. En effet, les cookies sont juste différés jusqu'à ce que l'utilisateur clique sur le bouton de lecture. Alors, tenez-en compte pour la conformité RGPD de votre site.

Enfin, copiez le code HTML qui s'affiche.

copier le code d'intégration YouTube pour embarquer le contenu dans un iframe

Pour insérer une carte Google Maps dans votre site sans avoir besoin d'API, c'est un peu pareil. Cliquez sur "Partager". Puis, dans la fenêtre qui s'affiche, cliquez sur "Intégrer une carte". Enfin, copiez le contenu HTML après avoir, si besoin, choisi la taille de la carte.

code d'intégration de Google Maps pour embarquer une maps via un iframe dans WordPress

Vous pouvez également intégrer une publication Facebook. Pour ce faire, cliquez sur les trois points, puis sur "</> Intégrer à un site". Et, dans la fenêtre suivante, après avoir choisi d'inclure toute la publication ou pas, copiez le code d'intégration.

💡 Pour Instagram, il ne s'agit pas d'un iframe, mais d'un blockquote. Mais l'intégration se fait de la même façon. Ainsi, sans avoir besoin de jeton pour l'appel à l'API Instagram, vous pouvez intégrer une publication Instagram. Il suffit de cliquer sur les trois points, puis sur "Intégrer" et enfin de "Copier le code intégré " en incluant la légende ou pas.

intégrer publications Instagram et Facebook

Une fois le code copié, retournez dans votre site WordPress et collez le code d'intégration fourni par la plateforme externe dans :

  • un bloc HTML pour Gutenberg
intégrer un contenu externe via un iframe avec Gutenberg
  • un widget HTML ou un widget Éditeur de texte (onglet Code) si vous utilisez Elementor
intégrer un contenu externe via un iframe avec Elementor
  • un module Code ou un module Texte (onglet Texte) pour Divi
intégrer un contenu externe via un iframe avec Divi

Enregistrez votre page et voilà, la carte Google Maps, la publication Facebook ou Instagram ou encore la vidéo YouTube s'affiche.

💡 Si le contenu que vous souhaitez intégrer ne s'affiche pas, c'est que le site a défini l'entête de sécurité X-Frame-Options sur DENY afin de protéger son contenu. Dans ce cas, vous ne pourrez pas intégrer son contenu.

Comme vous avez pu le constater, intégrer un contenu d'un site tiers avec un iframe est très simple à faire. Après, le désavantage de l'iframe est qu'il n'est pas franchement responsive. Alors, pour que votre site fasse plus pro, découvrez comment faire en sorte que l'iframe s'adapte à tous les écrans tout en conservant son ratio. Et puis, pour ne pas avoir d'erreur d'accessibilité, pensez, selon le cas, à ajouter un titre à l'iframe ou à modifier son titre s'il est générique.

Contenus externes embarqués ou intégrés dans WordPress inconvénients

Intégrer une vidéo, un podcast ou encore des publications des réseaux sociaux dans votre site WordPress peut permettre d'attirer l'attention des visiteurs.

Néanmoins, gardez à l'esprit que ce sont des ressources externes. Et qui dit requêtes externes, dit problème de performances en vue.

En effet, pour s'afficher, un contenu embarqué ou intégré fait appel aux ressources du site d'origine (polices, script pour afficher le lecteur...). Et tout cela augmente inévitablement le temps de chargement de votre page.

Alors, après avoir ajouté un contenu externe, testez les performances de votre page Web. Et si la vitesse de chargement n'est pas au rendez-vous, posez-vous la question de savoir si ce contenu est vraiment indispensable ou pas. 😉

Ah et puis, un dernier petit conseil : n'intégrez que des contenus tiers provenant de sources fiables. On ne sait jamais ce qu'il peut arriver...

Soumettre un commentaire 💬

guest
0 Commentaires
Commentaires en ligne
Afficher tous les commentaires