Intégrer_vidéo_instagram_0

Depuis quelques jours il est possible de partager des vidéos à travers l’application mobile Instagram.

Si vous êtes un adepte de ce réseau social et que vous possédez un site internet, peut-être souhaiteriez-vous partager certaines vidéos de votre compte avec vos lecteurs.

Malheureusement le site d’Instagram ne permet pas d’obtenir le code d’intégration de vos vidéos facilement comme c’est le cas sur Youtube, Vimeo, etc..

Il est toutefois assez simple de contourner cette restriction. Nous allons voir à travers ce tutoriel comment intégrer une vidéo Instagram dans votre site Web.

Préambule :

Tutoriel réalisé depuis Chrome.

Niveau : Débutant – Intermédiaire – Expert

Procédure :

  • Connectez-vous à votre compte Instagram depuis votre ordinateur.
  • Ouvrez la vidéo que vous souhaitez publier.
  • Faite un clic droit sur l’image et dans la fenêtre des options cliquez sur Inspecter l’élément.

Intégrer_vidéo_instagram_1

  • Une fenêtre s’ouvrira en bas de votre navigateur avec les informations relatives à votre page Web. Deux éléments vont nous intéresser. L’adresse URL de la vidéo ainsi que l’adresse URL de l’image associée à cette vidéo.

Intégrer_vidéo_instagram_2

  • Maintenant il va falloir intégrer le code html sur notre site. Pour cela nous allons utiliser un site qui générera tout le code à notre place. Allez sur ce lien : Générateur de code d’intégration.
  • Dans la cellule MP4 vidéo coller l’adresse URL de votre vidéo.
  • Dans la cellule Poster Image coller l’adresse URL de la photo associé à votre vidéo.
  • Pour le format il faut simplement savoir qu’Instagram réalise des vidéos carré ( aussi large que haute ). Pour la valeur c’est selon la mise en plage de votre site.
  • Choisissez enfin le type de code que vous souhaitez obtenir. HTML5 par exemple.

Intégrer_vidéo_instagram_3

  • Enfin il suffit de récupérer le code généré en bas de page et de le coller dans votre éditeur de site.

Résultat :


Pas de réponse à“Intégrer une vidéo Instagram dans votre blog”

Trackbacks/Pingbacks

  1. Intégrer une vidéo Instagram dans votre blog | Formation 2.0 - [...] See on www.mistipi.com [...]

Laisser un commentaire