Sélectionner une page


Divi: le thème WordPress le plus simple à utiliser

Divi: le meilleur thème WordPress de tous les temps!

Avec plus de 901000 téléchargements, Divi est le thème WordPress le plus populaire au monde. Il est complet, facile à utiliser et est livré avec plus de 62 modèles gratuits. [Recommended]

Ajouter des vidéos à votre page dans Divi est facile lorsque vous utilisez le module vidéo. Ce module vous permet d’intégrer des vidéos à partir de n’importe quelle source, mais également de personnaliser la vignette et le bouton de lecture.

Comment ajouter un module vidéo à votre page

Avant de pouvoir ajouter un module vidéo à votre page, vous devez d’abord sauter dans Divi Builder. Une fois le thème Divi installé sur votre site Web, vous remarquerez un bouton Utilisez Divi Builder au-dessus de l’éditeur de publication lors de la création d’une nouvelle page. Cliquez sur ce bouton pour activer Divi Builder et accéder à tous les modules de Divi Builder. Cliquez ensuite sur le bouton Utiliser le constructeur visuel pour démarrer le générateur en mode visuel. Vous pouvez également cliquer sur le bouton Utiliser le constructeur visuel Lorsque vous naviguez sur votre site Web au premier plan lorsque vous êtes connecté à votre tableau de bord WordPress.

Générateur de Divi

Après avoir accédé à Visual Builder, vous pouvez cliquer sur le bouton gris plus pour ajouter un nouveau module à votre page. Les nouveaux modules ne peuvent être ajoutés que dans les lignes. Lorsque vous démarrez une nouvelle page, n’oubliez pas d’ajouter d’abord une ligne à votre page.

Module vidéo divi.png

Trouvez le mod vidéo dans la liste des mods et cliquez dessus pour l’ajouter à votre page. La liste des mods est consultable, ce qui signifie que vous pouvez également taper le mot «vidéo», puis appuyer sur Entrée pour trouver et ajouter le mod vidéo automatiquement! Une fois le module ajouté, vous serez accueilli par la liste des options du module. Ces options sont divisées en trois groupes principaux: contenu , conception et Avancée .

Exemple de cas d’utilisation: ajouter une vidéo à votre page de destination

L’ajout d’une vidéo à votre page de destination est un excellent moyen de promouvoir vos produits et d’augmenter les conversions. Dans cet exemple, je vais vous montrer comment utiliser le mod Vidéo pour ajouter des vidéos à votre page de destination. J’ai mis un cercle rouge à l’endroit où la vidéo doit aller.

Créer une vidéo sur divi exemple.jpg

À l’aide de Visual Builder, j’ajoute une nouvelle section avec une ligne pleine largeur (1 colonne). Dans les paramètres de ligne, sous l’onglet Conception, je choisis l’option « Utiliser la largeur personnalisée ». Pour l’option Largeur personnalisée qui apparaît, je vais entrer une largeur personnalisée de 767 px. Cela garantira que le module vidéo que je vais ajouter sur cette ligne ne dépassera pas cette largeur et deviendra trop grand pour des écrans plus grands.

Créez facilement votre site Web avec Elementor

Elementor facilite la création de toute conception de site Web avec une apparence et une sensation professionnelles. Arrêtez de payer cher ce que vous pouvez faire vous-même. [Free]

Utilisez un divi.png de largeur personnalisé

Ensuite, j’ajoute le module vidéo à la ligne. Dans l’onglet Contenu du paramètre Module vidéo, j’entre l’URL de la vidéo que je souhaite intégrer à ma page de destination. J’utilise l’URL d’une vidéo YouTube pour cet exemple.

ajouter une vidéo sur divi.png

Ensuite, j’ajoute une URL de superposition d’image pour ma vidéo en cliquant sur le bouton générer une vidéo. Cela tirera automatiquement une image de la vidéo pour servir de superposition avec une nouvelle icône vidéo personnalisée.

ajouter une superposition divi video.jpg

Dans l’onglet Conception, je changerai la couleur de l’icône de lecture pour qu’elle corresponde à ma page de destination.

Ne perdez pas de temps et d’argent!

En quelques clics, découvrez le meilleur outil pour créer votre blog, blog de boutique en ligne ou tout autre site web!

Modifier l'icône du lecteur divi video.jpg

Maintenant, j’ai une vidéo pour ma page de destination qui a l’air soignée et correspond à mon design.

conception finale avec le contenu video.jpg

Après avoir vu le Video Mod en action, plongez dans tous les paramètres des sections ci-dessous. Nous avons fourni un aperçu détaillé des différents onglets pour les paramètres du module ainsi qu’une explication des fonctions respectives.

Options de contenu

Module de paramètres divi.png

URL de la vidéo

Le module Divi Video vous permet d’ajouter des vidéos en utilisant deux méthodes différentes. Vous pouvez télécharger votre propre fichier vidéo à partir de votre ordinateur en cliquant sur le bouton Télécharger la vidéo et en sélectionnant le fichier souhaité, ou vous pouvez entrer n’importe quelle URL vidéo à partir d’une source vidéo tierce telle que Youtube ou Vimeo. Copiez simplement l’URL de votre navigateur et collez-la dans le champ URL de la vidéo. Divi s’occupe du reste!

URL de superposition d’image

Si vous souhaitez définir une vignette vidéo personnalisée qui sera placée sur la surface vidéo standard avec un bouton de lecture personnalisé pour un aspect plus net et plus stylisé, vous pouvez la sélectionner dans la zone Superposition d’image. Avec ce contrôle, vous pouvez soit télécharger votre propre image personnalisée, soit demander à Divi d’en générer une automatiquement à partir de l’url de votre vidéo. La plupart des fournisseurs de vidéos comme Youtube et Vimeo prennent en charge cette option. Cliquez simplement sur le bouton Générer la vidéo et laissez Divi faire le reste!

Étiquette d’administrateur

Par défaut, votre module vidéo est affiché dans le générateur avec la désignation « Vidéo ». Avec la balise admin, vous pouvez modifier cette balise pour une identification facile.

Options de conception

Changer la couleur du symbole

conception de section design divi.png

Si vous définissez une superposition d’image pour votre module Vidéo, la vidéo affichée aura une icône de lecture dans la vidéo. Vous pouvez définir la couleur de cette icône ici pour qu’elle corresponde aux couleurs de votre page.

Options étendues

Module vidéo Advanced Section.png

ID CSS et classes

Cela peut être utilisé pour ajouter un ID CSS ou une classe à votre module. Ceux-ci peuvent ensuite être utilisés dans votre feuille de style ou dans le champ CSS personnalisé pour les options de thème pour appliquer un style personnalisé au module. Les identifiants CSS peuvent également être fournis avec des liens d’ancrage pour créer des liens vers des zones spécifiques de votre page.

CSS personnalisé

Ici, vous pouvez ajouter du CSS personnalisé à votre module vidéo.

Visibilité

Si vous souhaitez masquer votre module vidéo sur certains appareils, vous pouvez sélectionner les appareils sur lesquels vous souhaitez désactiver le module vidéo.

Autres tutoriels Divi



Source link

Recent Posts