L’élément vidéo polyvalent vous permet d’intégrer des vidéos de manière fluide dans votre tunnel ou votre site web à partir de diverses sources, telles que YouTube, Vimeo, Wistia, et plus encore ! En incorporant un contenu visuel attrayant, vous pouvez améliorer l’expérience utilisateur, rendant votre site plus captivant et informatif pour vos visiteurs.
Paramètres généraux
Lors de la modification de l’élément vidéo sur votre page de tunnel, la plupart des ajustements peuvent être effectués dans la section Paramètres généraux située à gauche.

Nom/Titre de l’Élément
En haut de cette section, vous verrez le nom/titre de l’élément, qui est le nom/titre par défaut de l’option de modification sur laquelle vous travaillez. Vous pouvez choisir de le laisser tel quel ou de le renommer pour faciliter son identification ultérieure lors de la création de votre page de tunnel.

Options d’Espacement :
Différentes options d’espacement sont disponibles pour ajuster le contenu vidéo.

Padding Gauche, Droite, Haut et Bas
Ces quatre barres de réglage permettent de déplacer le contenu vers la gauche, la droite, le haut ou le bas en fonction de la barre que vous cliquez.
Marge Supérieure et Inférieure
Vous pouvez ajuster la marge supérieure ou inférieure de votre contenu en ajustant les barres correspondantes.
Couleur de Fond
Pour changer la couleur de fond de votre élément vidéo, cliquez simplement sur la zone de contenu que vous souhaitez ajuster et sélectionnez une couleur parmi les options fournies ou ajoutez un code couleur personnalisé pour correspondre à votre branding.

Ombre de Boîte
Ici, vous pouvez ajouter une ombre intérieure ou une ombre portée à votre boîte pour rendre la bordure plus visible.

Type de Vidéo
Dans le menu déroulant Type de Vidéo, vous pouvez sélectionner le type de vidéo que vous souhaitez utiliser sur votre page de tunnel. Les options disponibles sont : YouTube, Vimeo, Wistia, Intégration personnalisée ou HTML 5.

URL de la Vidéo
Selon l’option que vous sélectionnez, vous devrez entrer soit une URL de vidéo, soit un code d’intégration.

Lecture Automatique
Vous pouvez choisir de faire démarrer la vidéo automatiquement lorsque la page du tunnel est ouverte ou activer/désactiver les contrôles pour permettre aux clients de mettre en pause ou de lire la vidéo sur votre page.

Contrôles
Pour activer les contrôles parentaux sur la vidéo, il vous suffit de les activer.

Largeur
Vous pouvez également sélectionner une largeur pour votre élément vidéo en choisissant parmi les options suivantes : pleine largeur, 3/4 de largeur ou moitié largeur.

Paramètres Avancés
Sous l’onglet Paramètres Avancés, vous disposez d’options de personnalisation supplémentaires telles que l’ajout de bordures, l’ajustement de la visibilité, l’ajout d’une classe personnalisée et la copie du code CSS pour une utilisation ultérieure.
Option de Bordure :
Bordure Le menu déroulant Bordure vous permet d’ajouter une bordure à votre boîte d’élément vidéo. Une fois que vous avez choisi un style de bordure, des options de personnalisation supplémentaires apparaîtront ci-dessous.

**Style :** Vous pouvez choisir parmi les styles de bordure solide, pointillée ou en tirets pour la bordure autour de votre élément vidéo.

**Largeur :** Cliquez ici pour sélectionner l’épaisseur souhaitée pour la bordure.

**Couleur :** Choisissez une couleur pour votre bordure. Sélectionnez l’une des options de couleur proposées ou saisissez un code couleur personnalisé dans le champ prévu à cet effet.

Rayon : Si vous ne souhaitez pas que votre bordure ait des coins aigus, vous pouvez décider du degré de courbure des coins en sélectionnant parmi les options de rayon.

Rayon des Coins Vous pouvez choisir quel côté de la bordure vous souhaitez ajuster : Tous les coins, Seulement le haut ou Seulement le bas.

Visibilité
La section Visibilité vous permet de rendre votre élément vidéo visible uniquement sur desktop ou mobile, en fonction de vos besoins. Vous pouvez prévisualiser vos modifications en utilisant les options desktop et mobile en haut à gauche du constructeur de tunnels pour voir à quoi cela ressemble.

Classe Personnalisée
Entrez votre classe personnalisée ici.

Sélecteur CSS
Si vous avez besoin de copier le CSS personnalisé, cliquez simplement sur l’icône “Copier” à droite du code de référence.
