--- title: "Comment intégrer des YouTube Shorts" slug: "embed-youtube-shorts" description: "Using the quick workaround using the iframe (Inline frame) HTML tag, you can embed any YouTube Shorts in your page or article." tags: ["Customization", "Embedding", "Videos"] updated: 2026-06-22T08:30:09Z published: 2026-06-22T08:30:09Z canonical: "docs.document360.com/embed-youtube-shorts" --- > ## Documentation Index > Fetch the complete documentation index at: https://docs.document360.com/llms.txt > Use this file to discover all available pages before exploring further. # Comment intégrer des YouTube Shorts YouTube Shorts peut être intégré dans vos articles à l’aide d’un iframe HTML. Bien que YouTube ne propose actuellement pas d’option d’intégration directe pour les Shorts, vous pouvez les afficher en modifiant l’URL de la vidéo, en la remplaçant `/shorts/` par `/embed/`, puis en l’insérant dans un iframe. Cela vous donne un contrôle total sur les dimensions, la bordure et le style de la vidéo intégrée. --- ## Quand utiliser cette technique - **Intégrer du contenu vidéo court** : affichez directement dans vos articles des guides de produits, des conseils rapides ou des annonces créés sous forme de YouTube Shorts. - **Compléter les étapes écrites par une vidéo** : intégrez une vidéo Shorts à côté d’une procédure permettant aux lecteurs de faire un aperçu sans quitter la page. NOTE YouTube ne propose actuellement pas d’option native d’intégration pour les Shorts. Cette solution fonctionne en remplaçant `shorts` par `embed` dans l’URL de la vidéo. Si YouTube ajoute à l’avenir l’intégration officielle des Shorts, cette méthode devrait être utilisée à la place. --- ## Comment intégrer un court métrage YouTube 1. Allez [sur YouTube](https://www.youtube.com/) et ouvrez la vidéo Shorts que vous souhaitez intégrer. 2. Copiez l’URL de la vidéo en utilisant l’une des méthodes suivantes : - Copiez l’URL depuis la barre d’adresses de votre navigateur. - Cliquez **sur Partager** > **copier**. 3. Collez l’URL copiée dans le `src` champ du code iframe ci-dessus. 4. Dans l’URL, remplacez `/shorts/` par `/embed/`. Par exemple : ``` Before: https://www.youtube.com/shorts/pVRefGmQDJM After:  https://www.youtube.com/embed/pVRefGmQDJM ``` ![Screen recording showing a YouTube Shorts URL being modified by replacing the word shorts with embed before pasting into an iframe.](https://cdn.document360.io/860f9f88-412e-4570-8222-d5bf2f4b7dd1/Images/Documentation/Embed%20youtube%20shorts.gif) 1. Collez le code iframe complété dans votre article en utilisant la vue de code ou le bloc HTML. --- ## Petite référence Remplacez-le `<Shorts_video_code>` par l’ID de votre vidéo (le code alphanumérique à la fin de l’URL Shorts). ``` ``` | Terrain | Par défaut | Notes | | --- | --- | --- | | `width` | `315` | Ajustez au besoin, maintenez le format d’image | | `height` | `560` | Hauteur optimale pour le format portrait de Shorts | | `src` | Votre URL de la vidéo | Remplacez `/shorts/` par `/embed/` dans l’URL | | `frameborder` | `0` | En fixant en pixels, `0` ça supprime la bordure | --- ## Exemple **Code :** ``` ``` **Sortie :** [YouTube video player](https://www.youtube.com/embed/pVRefGmQDJM) --- ## Portée et couverture | Objet | Détails | | --- | --- | | Taille recommandée | 315px × 560px (portrait, correspond au format Shorts 9:16) | | Tailles personnalisées | Supporté, ajustez la largeur et la hauteur, mais maintenez le ratio 9:16 | | Support des éditeurs | Tout éditeur qui prend en charge les balises iframe HTML | | Option d’intégration native | Non disponible actuellement pour YouTube Shorts | --- ## Meilleures pratiques - **Maintenez toujours le format 9:16** : les courts-métrages sont tournés en format portrait. Si vous redimensionnez l’image, gardez le rapport largeur/hauteur à 9:16 (par exemple, 270×480 ou 360×640) pour éviter que la vidéo ne paraisse étirée ou recadrée. - **Utilisez `frameborder="0"`**: régler la bordure à zéro donne un rendu plus net. Si vous voulez une bordure visible, utilisez CSS sur un wrapper `<div>` plutôt que sur l’attribut `frameborder` , qui est déprécié dans HTML5. - **Définissez `allowfullscreen`**: cet attribut permet aux lecteurs d’étendre la vidéo en plein écran, ce qui améliore l’expérience de visionnement pour un contenu avec un texte ou un détail à l’écran réduit. - **Testez l’intégration avant de publier** : après avoir inséré l’iframe, prévisualisez l’article pour confirmer que la vidéo se charge correctement. Si la vidéo montre une erreur, vérifiez qu’elle `/shorts/` a été entièrement remplacée dans `/embed/` l’URL. - **Gardez les titres des vidéos descriptifs** : l’attribut `title` sur l’iframe est lu par les lecteurs d’écran. Remplacez-le `"YouTube video player"` par un titre descriptif par `"Product setup walkthrough"` exemple pour améliorer l’accessibilité.