Ajouter une vidéo.

Apprendre DXPR BuilderCréer des pagesAjouter du contenuTexte et médias

Vous obtenez une vidéo YouTube ou Vimeo qui s’ajuste à votre colonne, avec une image de couverture et un bouton de lecture facultatifs. Utilisez-la pour des démos produit, des cours, des tutoriels ou des clips promotionnels.

Vidéo avec une photo de couverture montrant des portables sur un bureau et un bouton de lecture aux couleurs du thème

Ajouter une vidéo

Ouvrez votre page une fois la session ouverte : les commandes du constructeur apparaissent au survol de la zone de contenu. Votre première page présente les bases.

  1. Survolez la colonne et cliquez sur + dans sa barre de contrôle, ou cliquez sur Ajouter des éléments sur une page vide. Ouvrez l’onglet Contenu et cliquez sur Vidéo. L’élément apparaît en haut de la colonne et sa boîte de dialogue de paramètres s’ouvre.
  2. Collez ou saisissez une URL YouTube ou Vimeo dans Video link.
  3. Sous Image, cliquez sur Select Image pour ouvrir le Media browser. Pour trouver une photo, saisissez une partie de son nom et cliquez sur Apply filters. Cochez la photo et cliquez sur Insert selected. Elle devient l’image de couverture.
  4. Choisissez d’afficher ou non le Themed play button sur l’image de couverture. Il est désactivé par défaut. Ici, il est activé.
  5. Cliquez sur Enregistrer dans la boîte de dialogue, puis sur Enregistrer dans la barre d’outils en haut de la zone de contenu pour stocker la page.

Ce que vous voyez

Votre vidéo apparaît dans un cadre 16:9 sur toute la colonne. Dans la vidéo, la photo de couverture remplit le cadre et le bouton de lecture aux couleurs du thème se trouve par-dessus. Le lecteur YouTube ne se charge que quand quelqu’un clique sur la photo ou le bouton. Les visiteurs la voient une fois la page enregistrée et publiée.

Configurer votre vidéo

Survolez l’élément et ouvrez Plus > Paramètres dans sa barre de contrôle. Options :

  • Video link : l’URL YouTube ou Vimeo. Les liens standard, courts et intégrés fonctionnent tous.
  • Video width : une largeur CSS comme 100% ou 800px. La valeur par défaut est 100%.
  • Image : une image de couverture affichée avant la lecture. Avec une image définie, le lecteur YouTube ou Vimeo ne se charge qu’au clic du visiteur, la page se charge donc plus vite.
  • Themed play button : un bouton de lecture aux couleurs principales de votre thème, affiché sur la vidéo ou l’image. Il est désactivé par défaut. Un clic dessus, ou sur l’image, démarre la vidéo sans le son.

Si rien ne s’affiche

  • La vidéo ne figure pas dans l’onglet Contenu. Votre profil d’utilisateur la masque. Demandez à un administrateur de l’activer dans Profils d’utilisateurs.
  • Elle a disparu après rechargement. La page n’a pas été enregistrée. Ajoutez-la de nouveau et cliquez sur Enregistrer dans la barre d’outils en haut de la zone de contenu.
  • Un espace vide apparaît à la place du lecteur. Le champ Video link est vide ou contient une URL qui ne vient ni de YouTube ni de Vimeo. Survolez l’élément et ouvrez Plus > Paramètres, puis collez une URL YouTube ou Vimeo valide.
  • Le lecteur affiche une erreur au lieu de la vidéo. La vidéo est privée, ou son propriétaire n’autorise pas l’intégration. Rendez-la publique ou non répertoriée et autorisez l’intégration sur YouTube ou Vimeo, ou liez une autre vidéo.
  • La vidéo est trop large ou trop étroite pour la colonne. Video width contient une taille fixe, comme 800px. Réglez-la sur 100% pour remplir la colonne.

Et ensuite ?

Onglet Style pour modifier l’espacement et l’arrière-plan de votre vidéo.