How to Embed Video and Facebook Status on the Blog with AMP HTML

Agung Winarno
Agung Winarno
22.49
To display the status or Facebook Videos to blogs, the main requirement to save this JS in head tag
<script async='async' custom-element='amp-facebook' src='https://cdn.ampproject.org/v0/amp-facebook-0.1.js'/>

Sample code to display the posting/Facebook Status

<amp-facebook width="552"
      height="303"
      layout="responsive"
      data-href="https://www.facebook.com/zuck/posts/10102593740125791">
</amp-facebook>

Layout that support: fill, fixed, fixed-height, flex-item, nodisplay, responsive



To embed facebook videos

  <amp-facebook width="552"
      height="310"
      layout="responsive"
      data-href="https://www.facebook.com/zuck/videos/10102509264909801/">
  </amp-facebook>



Add data-embed-as="video" then only perform the video only and responsive.

<amp-facebook width="552"
      height="310"
      layout="responsive"
      data-embed-as="video"
      data-href="https://www.facebook.com/zuck/videos/10102509264909801/">
</amp-facebook>