How to embed instagram in AMP HTML

BLOG MOBILE.



    Salam menyambungkan lagi ketutorial tenang INSTRAGRAM, setelah kemarin saya sudah membuat toturial menggukan fitue terbaru instragram carousel.  Kali saya mau melanjutkan cara embed instragram di AMP HTML.

Untuk membuat embed instragram kita cukup ambil  data-shortcode nya saja.

Example:

<amp-instagram
      data-shortcode="BGgvHp2N8U"
      width="381"
      height="381"
      layout="responsive">
  </amp-instagram>

Untuk embed instragram di AMP HTML syarat umatamanya simpan AMP js di bawah ini di tag HEAD 

<script async custom-element="amp-instagram" src="https://cdn.ampproject.org/v0/amp-instagram-0.1.js"></script>

Berikut ini contoh embed instragram di AMP HTML :
<amp-instagram
      data-shortcode="BGgvHp2N8U"
      width="381"
      height="381"
      layout="responsive">
  </amp-instagram>

Instagram


Instagram with Frame

  <amp-instagram
      data-shortcode="BUO16FVDjtv"
      data-default-framing
      width="500"
      height="500"
      layout="responsive">
  </amp-instagram>

Instagram with Frame, Caption and Overflow Element

 <amp-instagram
      data-shortcode="BUO16FVDjtv"
      data-captioned
      data-default-framing
      width="500"
      height="500"
      layout="responsive">
      <div overflow>Show Caption</div>
  </amp-instagram>
Show Caption

Instagram Default Layout

<amp-instagram
      data-shortcode="BRIrHrujpja"
      width="381"
      height="381">
  </amp-instagram>


Instagram Video

<amp-instagram data-shortcode="BN6TQWuhzsF"
                 width="300"
                 height="300"
                 layout="responsive">
  </amp-instagram>

blog views
Reactions:
Donate via PayPal

You Might Also Like:

ADD A COMMENT WITH YOUR FACEBOOK PLEASE WAIT FOR FACEBOOK COMMENT WILL SOON OPEN

ADD A COMMENT WITH DISQUS HIDE COMMENT

Disqus Comments

ADD A COMMENT WITH GOOGLE PLUS HIDE COMMENT

google Comments

Hello, how may we help you? Just send us a message now to get assistance.

Facebook Messenger ×