Instagram recently launched Instagram Videos and now you can share your videos and also embed on your personal blog. However, Instagram never made it easy to embed its content for blog owners. The Instagram supports Oembed protocols, which means you need a modern browser that is capable of running HTML5 videos.
If you just want to share the video page of an instagram video simply put “embed” at the end of the URL. For example: http://instagram.com/p/ayxFjtOiCT becomes http://instagram.com/p/ayxFjtOiCT/embed.
Here’s a complete step by step guide on how you can embed Instagram videos on your site in a few easy steps. Please keep in mind to update your browser to the latest one.
1. First thing you need to do is to visit the URL of the video you want to embed.
2. In your browser right click on the video and select Inspect Elements. Search through the code in the Inspector for a text string that says div class-“Video”. That class will contain a link to the MP4 video that begins with http://distilleryvesper. This is the URL for your video clip. Copying that URL and pasting it into its own webpage should give you a link.
3.Now, look for the URL of the “poster” image. This is the Cover Photo you chose for your Instagram video. It is an Amazon AWS link the URL should start with “distilleryimage. Copy this URL and open it in a new tab or window.
4.Now we need to generate our HTML5 video code. The easiest way to do that is to use theVideo for Everybody generator. Fill out the generator, putting the video file in the MP4 video field, the Cover Photo URL in the poster image field and adding in a title for your embed.
5.Copy the string of code at the bottom of the generator. If you want, you can omit the “download this video” section. Now put the code on your personal website or Tumblr. If you want, you can download the MP4 file and upload it directly to Tumblr.
And that’s it, We hope this tutorials helps you a lot. For any question leave a comment in the comment section.