Insérer une vidéo avec une vignette dans un article de blog

Insertion d’une vidéo dans un article

L’insertion d’une vidéo se fait maintenant simplement par l’intermédiaire du bouton “Ajouter un média” de la barre d’outil lors de la création/édition d’un article.

De même, pour insérer une vidéo Youtube, il suffit de coller dans l’article à l’endroit souhaité le lien de la page comportant la vidéo. WordPress ajoute de façon automatique le lecteur intégré.

Insertion d’une vignette au lecteur vidéo

Pour éviter l’affichage d’un écran noir, il est parfois préférable d’ajouter une vignette au lecteur afin de donner un premier aperçu du contenu de la vidéo ou personnaliser l’écran d’accueil.

Depuis la dernière mise à jour des blogs pédagogiques cette fonctionnalité (valable uniquement pour les vidéos importées dans la bibliothèque de médias) est intégrée à WordPress.

Pour y parvenir, une fois cette vidéo importée dans la bibliothèque et insérée dans l’article, il suffit de :

  1. cliquer dans sur le lien de la vidéo à modifier ;
  2. cliquer sur le crayon apparu afin de modifier les propriétés de cet élément ;

  3. choisir dans la nouvelle page apparue l’option “Choisir une image de couverture” située dans la colonne de gauche ;
  4. importer ou choisir une image dans la bibliothèque de médias ;
  5. valider le choix en cliquant sur le bouton “Choisir une image de couverture” ;
  6. cliquer sur le bouton “Mettre à jour” pour valider la modification des propriétés de la vidéo ;
  7. cliquer sur le bouton “Mettre à jour” de l’article pour enregistrer les changements.

8 pensées sur “Insérer une vidéo avec une vignette dans un article de blog

  1. Frédéric R dit :

    D’ailleurs la taille de la photo de couverture doit-elle être adaptée à celle de la vidéo?

    1. Stéphane Penaud dit :

      Concernant la taille de l’image pour la couverture, WordPress la redimensionne pour l’adapter à la taille de ton lecteur.
      En revanche, il est préférable que cette image soit redimensionnée au préalable afin qu’elle ne soit pas dégradée au moment de son application sur ce lecteur.

  2. Frédéric R dit :

    Bonjour Stéphane

    Il y à pas très longtemps il fallait faire comme sa, mais le code à insérer à changé puisque la façon d’insérer une vidéo dans un article à changé récemment. Du coup comment gérer la taille de toutes les vidéos afin qu’elles soient de la même taille sur l’ensemble du blog? La façon de gérer les photo de couverture des vidéo à aussi changée, sa je gère je pense (du moins j’espère!). Merci de ton aide en tout cas.

    1. Stéphane Penaud dit :

      Bonjour Frédéric,

      Le code n’a pas vraiment changé pour l’insertion de vidéo (notamment) pour gérer leur taille. En revanche tu as raison, il existe un moyen plus simple d’ajouter une vignette sur une vidéo située dans la bibliothèque de médias : c’est pourquoi j’ai modifié le contenu de l’article.
      Pour modifier la taille d’une vidéo :
      – vidéo dans la bibliothèque de médias, tu devras saisir le code sous la forme (dans l’onglet Texte de ton éditeur) :
      [video width="320" height="240" flv="http://blogpeda.ac-poitiers.fr/test/files/2013/09/techno21.flv"][/video]

      – vidéo externe (Youtube, Dailymotion etc.), tu devras saisir le code sous la forme (dans l’onglet Texte de ton éditeur) :
      [embed width="320" height="240"]http://www.youtube.com/watch?v=JaNH56Vpg-A[/embed]

  3. Noyan dit :

    Bonjour!
    Déjà merci pour le conseil!
    Mais est-ce qu’il existe un moyen d’automatiser tout ça?

    1. Stéphane Penaud dit :

      Bonsoir,

      Il existe notamment un plugin capable d’effectuer cette opération :
      Video Embed & Thumbnail Generator

      Cordialement.

  4. Balois dit :

    Bonjour,

    j’ai beau insérer l’adresse et le nom de la vignette derrière la commande “poster=”, ça ne fonctionne pas!!
    Avez-vous une idée de la raison?
    Merci
    Bien à vous
    JMarc

    1. Stéphane Penaud dit :

      Bonjour,

      Tout dépend de la version de WordPress que vous utilisez. En effet, ce shortcode est valable depuis la version 3.6.
      Vous pouvez jeter un œil sur le codex de WordPress : Video Shortcode

      S’il s’agit d’une version antérieure, il faut que vous regardiez la documentation du plugin utilisé pour intégrer le lecteur vidéo dans l’article.

      Bien cordialement.

Les commentaires sont clos.