Description | Displays a Facebook post or video. |
Availability | Stable |
Required Script | <script async custom-element="amp-facebook" src="https://cdn.ampproject.org/v0/amp-facebook-0.1.js"></script> |
Supported Layouts | fill, fixed, fixed-height, flex-item, nodisplay, responsive |
Examples | Annotated code example for amp-facebook |
You can use the amp-facebook
component to embed a Facebook post or a Facebook video.
Example: Embedding a post
<amp-facebook width=486 height=657
layout="responsive"
data-href="https://www.facebook.com/zuck/posts/10102593740125791">
</amp-facebook>
Example: Embedding a video
<amp-facebook width=552 height=574
layout="responsive"
data-embed-as="video"
data-href="https://www.facebook.com/zuck/videos/10102509264909801/">
</amp-facebook>
data-href (required)
The URL of the Facebook post/video. For example: https://www.facebook.com/zuck/posts/10102593740125791.
data-embed-as (optional)
The value is either post
or video
. The default is post
.
Both posts and videos can be embedded as a post. Setting data-embed-as="video"
for Facebook videos only embeds the player of the video, and ignores the accompanying post card with it. This is recommended if you'd like a better aspect ratio management for the video to be responsive.
Check out the documentation for differences between post embeds and video embeds.
common attributes
This element includes common attributes extended to AMP components.
See amp-facebook rules in the AMP validator specification.