Intégrer des vidéos hébergées par HubSpot sur votre site externe ou dans vos e-mails

Intégrez des vidéos hébergées par HubSpot à partir de l’outil Vidéo sur votre site web hébergé en externe, comme WordPress, ou sur des e-mails hébergés en externe, comme Gmail. Suivez ensuite les vues, les lectures et les événements liés à l’engagement sur toutes les plateformes, directement dans HubSpot.

Comprendre les limites et les exigences

• Pour intégrer une vidéo hébergée par HubSpot à une page ou à un e-mail externe, les fonctionnalités avancées doivent être activées pour cette vidéo. Cela sera pris en compte dans la limite de vidéos pour les fonctionnalités avancées. 

• Lors de l’intégration de vidéos sur des pages hébergées en externe :

  • Pour suivre vos données vidéo, vous devez installer le code de suivi HubSpot sur votre site web hébergé en externe.

• • Quand Pour l’intégration de votre vidéo, par défaut, le script d’intégration vidéo inclura l’injection JSON-LD pour des avantages SEO, à l’aide d’une <script> balise.

Copiez et utilisez votre code intégré sur des sites externes

1. Dans votre compte HubSpot, accédez à Contenu >Vidéo.​
2. Recherchez et sélectionnez le nom du fichier vidéo. Vous serez dirigé vers la page de détails de la vidéo.
3. Dans l’angle supérieur droit, cliquez sur le bouton Intégrer. Si le paramètre des fonctionnalités avancées n’a pas été activé pour la vidéo, il ne s’affichera pas . 

4. Dans la boîte de dialogue, définissez votre format de partage : 
   • Taille : indiquez si la vidéo intégrée doit être adaptative ou avoir une taille de vidéo fixe. Par défaut, l’option sera définie sur Responsive, ce qui ajustera automatiquement la taille de la vidéo en fonction de la largeur de la page.
   • Boucle : redémarrez automatiquement la vidéo et lisez-la en continu en boucle.
   • Couper le son par défaut : coupez le son de la vidéo par défaut. Les visiteurs devront cliquer pour activer le son.
   • Lecture automatique : lisez automatiquement la vidéo lorsque la page se charge.
   • Contrôles visibles : affichez une barre de contrôle au visiteur. Cette option est activée par défaut. 
   • Couleur du bouton de lecture : utilisez le sélecteur de couleurs pour définir une couleur pour le bouton de lecture de la vidéo. 
   • Inclure les métadonnées SEO : utilisezcette option pour inclure des métadonnées vidéo sur la page afin que les moteurs de recherche puissent indexer la vidéo. Cette option est activée par défaut.
5. Après avoir configuré les paramètres de la vidéo, dans l’angle inférieur gauche, cliquez sur Copier le code d’intégration. Le code d’intégration vidéo sera automatiquement copié dans le presse-papiers de votre appareil. 

6. Accédez au système de gestion de contenu (CMS) de votre site web externe.
7. Collez le code d’intégration de la vidéo dans le HTML de votre page externe à HubSpot, à l’endroit où vous souhaitez que la vidéo apparaisse. Des recommandations supplémentaires sont disponibles pour les éléments suivants :
   • WordPress : il est recommandé d’utiliser un bloc HTML personnalisé pour ajouter votre code d’intégration vidéo HubSpot aux pages et articles de blog WordPress. Découvrez-en davantage sur l’ajout d’intégrations au contenu WordPress.
   • Shopify : ilest recommandé d’insérer le code d’intégration de votre vidéo soit en sélectionnant l’option Ajouter du texte enrichi vidéo, soit en modifiant le code HTML de la page directement via l’éditeur de code en ligne. Si vous avez besoin d’un cas d’utilisation plus complexe, vous pouvez ajouter votre HTML intégré à un modèle Liquid personnalisé dans le cadre de votre thème Shopify. Découvrez-en davantage sur l’utilisation des modèles dans Shopify.

6. Prévisualisez votre vidéo sur la page web pour vérifier à quoi elle ressemble lorsqu’elle est en direct. La vidéo doit s’afficher avec une mise en page adaptative qui s’ajuste automatiquement à la largeur de la page. Si la vidéo ne s’affiche pas correctement, vérifiez que votre CMS externe n’a pas modifié le code que vous avez copié.
7. Lorsque vous avez terminé, publiez votre page.

Copiez et utilisez votre code d’intégration sur des e-mails hébergés en externe.

1. Dans votre compte HubSpot, accédez à Contenu >Vidéo.​
2. Recherchez et sélectionnez le nom du fichier vidéo. Vous serez dirigé vers la page de détails de la vidéo.
3. Dans l’angle supérieur droit, cliquez sur l’icône de partage. Si le paramètre des fonctionnalités avancées n’a pas été activé pour la vidéo, il ne s’affichera pas .
   
   

4. Dans la boîte de dialogue, cliquez sur l’onglet E-mail .
5. Configurez vos paramètres vidéo : 
   • Taille : saisissez une taille pour l’image d’aperçu de votre vidéo. 
   • Domaine : sélectionnez un domaine pour l’URL de votre vidéo liée. Découvrez-en davantage sur la connexion de domaines à votre compte HubSpot.
6. Après avoir configuré les paramètres de la vidéo, dans l’angle inférieur gauche, cliquez sur Copier le code d’intégration. Le code d’intégration vidéo sera automatiquement copié dans le presse-papiers de votre appareil.
   

7. Accédez à votre hôte de messagerie externe.
8. Collez le code d’intégration de la vidéo dans le code HTML de votre e-mail, à l’endroit où vous souhaitez que la vidéo apparaisse. Cela peut varier en fonction de votre fournisseur de messagerie.