amp-instagram component to embed instagram videos and photos into your AMP HTML files.
Import the amp-instagram component in the header
<script async custom-element="amp-instagram" src="https://cdn.ampproject.org/v0/amp-instagram-0.1.js"></script>
Instagram photos are embedded via the instagram data-shortcode, which is found in every instagram photo URL. Many instagrams are square. When you set
layout="responsive" any value where
height are the same will work.
<amp-instagram data-shortcode="1totVhIFXl" width="1" height="1" layout="responsive"> </amp-instagram>
If the image is not square,
height should be the actual width and height of the instagram image.
<amp-instagram data-shortcode="_hIitKIFcg" width="600" height="450" layout="responsive"> </amp-instagram>
You can include captions with the
<amp-instagram data-shortcode="BMQ8i4lBTlb" data-captioned width="1" height="1" layout="responsive"> </amp-instagram>
If the explanations on this page don't cover all of your questions feel free to reach out to other AMP users to discuss your exact use case.Go to Stack Overflow An unexplained feature?
The AMP project strongly encourages your participation and contributions! We hope you'll become an ongoing participant in our open source community but we also welcome one-off contributions for the issues you're particularly passionate about.Edit sample on GitHub
Written by @sebastianbenz