Avec Genially, vous pouvez insérer des vidéos que vous avez sur Google Drive dans vos créations, afin que votre public puisse les regarder sans avoir à ouvrir un nouvel onglet de navigateur.


Dans ce tutoriel, nous expliquons comment intégrer une vidéo stockée dans Google Drive sur votre Genially. Nous verrons deux façons de montrer votre vidéo :

  • Insérer une vidéo sur la zone d’édition pour l'afficher sur une page de votre genially.
    • Depuis votre compte Google Drive
    • En utilisation un code d'intégration
  • Insérer une vidéo à afficher dans une fenêtre interactive.

Insérer une vidéo dans la zone d’édition pour la faire apparaître sur une page de votre genially


Depuis votre compte de Google Drive

Il s’agit là de l’option la plus simple. Votre vidéo sera insérée en quelques clics seulement :


1. Ouvrez la section ‘Insérer’ située dans la barre latérale gauche de l'éditeur de Genially.


2. Cliquez sur l'onglet ‘Vidéo’.


3. Cliquez maintenant sur l'icône Google Drive et une fenêtre émergente s'ouvrira pour vous permettre de vous connecter au compte Google où votre vidéo est hébergée.


4. L'étape suivante consiste à accorder à Genially l'accès à votre compte Google Drive afin d'afficher le contenu de votre Drive sur Genially. Cliquez sur 'Accepter'.

5. Une fenêtre émergente apparaîtra dans votre éditeur où vous verrez toutes les vidéos que vous avez hébergées dans votre compte Google Drive. Choisissez la vidéo que vous voulez afficher et cliquez sur ‘Ajouter’.

6. C'est prêt ! Votre vidéo apparaît maintenant sur la zone d’édition. Vous pouvez le placer dans la partie de la page que vous préférez, et modifier sa taille à votre guise en cliquant sur ses sommets et en faisant glisser la souris dans la direction souhaitée.


En utilisant le code d’intégration

Pour utiliser ce système, la première chose à faire est de modifier la confidentialité de votre vidéo, afin qu'elle soit visible par toute personne possédant le lien. Ensuite, vous devez obtenir et copier le code d'intégration et enfin coller ce code dans votre genially. Passons en revue ce processus étape par étape :

1. Connectez-vous à votre compte Google Drive. 


2. Localisez votre vidéo et faites un clic droit dessus. Choisissez l'option ‘Partager’.


3. Dans la fenêtre qui apparaît, cliquez sur ‘Modifier’ situé en bas.


4. Cliquez sur la petite flèche à gauche pour afficher les options de confidentialité et sélectionnez ‘Tous les utilisateurs disposant du lien’.

5. Cliquez sur ‘Terminé’ pour enregistrer vos modifications.



7. Maintenant, nous allons récupérer le code d'intégration de la vidéo. Cliquez à nouveau avec le bouton droit de la souris sur la vidéo et sélectionnez cette fois l'option ‘Aperçu’.

8. Dans l'aperçu, déroulez le menu à trois points dans le coin supérieur droit et sélectionnez l'option ‘Ouvrir dans une nouvelle fenêtre’.

9. Dans le nouvel onglet qui s'ouvre, déroulez à nouveau le menu dans le coin supérieur droit.

10. Cliquez sur ‘Intégrer un élément…’.

11. Sélectionnez et copiez le code généré.



Ça y est ! Vous avez votre code. Maintenant, nous allons l’insérer dans votre genially.

12.  Allez dans la section ‘Insérer’ de la barre latérale gauche de l’Éditeur de Genially.

13. Cliquez sur l'onglet "Autres" et collez le code d'intégration dans le champ prévu à cet effet. Validez en cliquant sur le bouton ‘Insérer’.

14. Une fois que la vidéo apparaît sur la zone d’édition, vous pouvez la placer dans la partie de la page que vous préférez, ou modifier sa taille à votre guise en cliquant sur ses sommets et en faisant glisser la souris dans la direction souhaitée ou en modifiant les dimensions à partir du ‘mode designer’.



Insérer une vidéo à afficher dans une fenêtre interactive.

Vous pouvez également montrer votre vidéo dans la fenêtre qui s'ouvre lorsque votre public clique sur un élément interactif. Pour cela :


1. Sélectionnez l'élément que vous voulez rendre interactif et cliquez sur l'icône d'interactivité au-dessus de lui.


2. Choisissez l'option ‘Fenêtre’.


3. Cliquez sur le bouton ‘Mode HTML’ dans la barre supérieure droite. Il est représenté par le symbole </>.


4. Collez le code d'intégration de la vidéo que vous avez obtenu en suivant les étapes de la section précédente.


5. Cliquez à nouveau sur le bouton ‘Mode HTML’ et enregistrez vos modifications. Terminé !



TIP : Vous pouvez changer les dimensions de la vidéo à partir de la "Vue du code" en modifiant les attributs "width" (largeur) et "height" (hauteur).