Documentation SeedProd

Documentation, matériel de référence et tutoriels pour SeedProd

Bloc vidéo

Le bloc Vidéo vous permet d'intégrer du contenu vidéo directement sur n'importe quelle page SeedProd. Vous pouvez intégrer une vidéo YouTube à l'aide de son URL ou coller un code d'intégration personnalisé provenant de n'importe quelle plateforme, y compris Vimeo, Wistia et autres, ce qui vous offre la flexibilité d'utiliser n'importe quel hébergeur vidéo sur lequel se trouve votre contenu.

La vidéo est l'un des outils les plus efficaces pour augmenter l'engagement et les conversions sur les pages d'accueil. Utilisez ce bloc pour présenter des démonstrations de produits, des témoignages, des vidéos explicatives ou tout autre contenu multimédia qui aide à raconter votre histoire et à retenir les visiteurs plus longtemps sur votre page.

Exigences :le bloc Vidéo est disponible dans toutes nosformules d'abonnement.


Ajouter le bloc vidéo à vos pages

Suivez ces étapes pour ajouter un bloc Vidéo à votre page SeedProd :

Étape 1 : Ajouter le bloc

Sous Design > Blocs, glissez-déposez le bloc Vidéo dans la section souhaitée de votre page.

Faire glisser le bloc Vidéo sur une page SeedProd

Étape 2 : Configurer les paramètres de contenu

Une fois ajouté, cliquez sur le bloc Vidéo pour ouvrir ses paramètres. Dans l'onglet Contenu, vous trouverez les options suivantes dans la section Vidéo:

  • Type : choisissez entre YouTube pour intégrer une vidéo par URL, ou Personnalisé pour coller un code d'intégration provenant de n'importe quelle plateforme vidéo telle que Vimeo, Wistia ou autres.
  • URL YouTube (Type YouTube uniquement) : entrez l'URL complète de la vidéo YouTube que vous souhaitez intégrer (par exemple, https://www.youtube.com/watch?v=MUXoqm3VpRo).
  • Code vidéo personnalisé (type personnalisé uniquement) : collez le code d'intégration iframe complet fourni par votre plateforme d'hébergement vidéo.
  • Largeur : définissez la largeur du lecteur vidéo en pourcentage de son conteneur à l'aide d'un curseur (valeur par défaut : 100 %).
  • Alignement : définissez l'alignement horizontal du lecteur vidéo (à gauche, au centre ou à droite) à l'aide des commandes spécifiques à chaque appareil pour les ordinateurs de bureau, les tablettes et les appareils mobiles.
Onglet Contenu du bloc vidéo affichant le type YouTube avec les paramètres URL, largeur et alignement.
Onglet Contenu du bloc vidéo affichant le type Personnalisé avec le champ Code d'intégration

Étape 3 : Personnalisez le design

Dans l'onglet Avancé, vous pouvez personnaliser l'apparence visuelle de votre bloc Vidéo.

Styles :

  • Ombre : appliquez une ombre portée au lecteur vidéo à l'aide des tailles prédéfinies : Aucune, Fine, Petite, Moyenne, Grande, Très grande ou 2 fois plus grande.

Espacement :

  • Marge : définissez l'espacement extérieur autour du bloc sur les quatre côtés, avec des commandes indépendantes pour les ordinateurs de bureau, les tablettes et les appareils mobiles.
  • Remplissage : définissez l'espacement intérieur à l'intérieur du bloc wrapper sur les quatre côtés, avec des commandes par appareil.

Attributs :

  • Classe personnalisée : ajoutez une ou plusieurs classes CSS personnalisées à l'enveloppe du bloc pour un style ciblé.
  • Identifiant CSS : SeedProd génère automatiquement un identifiant CSS unique pour ce bloc. Vous pouvez l'utiliser pour référencer le bloc dans un CSS ou un JavaScript personnalisé.
  • Attributs personnalisés : ajoutez des attributs HTML personnalisés à l'élément conteneur du bloc. Entrez chaque attribut sur une nouvelle ligne en utilisant le format clé|valeur.

Visibilité des appareils :

  • Masquer sur le bureau : activez cette option pour masquer le bloc lorsqu'il est affiché sur un écran d'ordinateur.
  • Masquer sur tablette : activez cette option pour masquer le bloc lorsqu'il est affiché sur un écran de tablette.
  • Masquer sur mobile : activez cette option pour masquer le bloc lorsqu'il est affiché sur un écran mobile.

Effets d'animation :

  • Effet de défilement : appliquez une animation déclenchée par le défilement au bloc, y compris les options de défilement vertical et horizontal avec des commandes de direction, de vitesse et de décalage de la fenêtre d'affichage.
  • Effet souris : appliquez un effet de parallaxe basé sur les mouvements de la souris au bloc.
Onglet Avancé du bloc Vidéo affichant les styles, l'espacement, les attributs, la visibilité des périphériques et les effets d'animation

Étape 4 : Enregistrez vos modifications

Une fois que vous avez terminé de configurer le bloc Vidéo et de personnaliser son apparence, veillez à enregistrer votre travail.


Vous avez ajouté avec succès un bloc Vidéo à votre page ! Que vous intégriez une vidéo YouTube ou un lecteur personnalisé provenant d'une autre plateforme, le contenu vidéo est un moyen puissant de communiquer votre message et d'augmenter le temps passé sur la page. Utilisez les paramètres de largeur, d'alignement et d'ombre pour intégrer de manière transparente votre vidéo dans n'importe quelle mise en page.

Articles connexes