Do you build things with AMP? Fill out the new AMP Developer Survey!
AMP

amp-facebook

Description

Displays a Facebook post, video or comment.

Required Scripts

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

Overview

You can use the amp-facebook component to embed a Facebook post, a Facebook video or a comment on a Facebook post.

Example: Embedding a post

<amp-facebook width="552" height="310"
    layout="responsive"
    data-href="https://www.facebook.com/ParksCanada/posts/1712989015384373">
</amp-facebook>
Buka cuplikan ini di playground

Example: Embedding a video

<amp-facebook width="476" height="316"
    layout="responsive"
    data-embed-as="video"
    data-href="https://www.facebook.com/nasaearth/videos/10155187938052139">
</amp-facebook>
Buka cuplikan ini di playground

Example: Embedding a comment on a post

<amp-facebook width="552" height="500"
    layout="responsive"
    data-embed-type="comment"
    data-href="https://www.facebook.com/zuck/posts/10102735452532991?comment_id=1070233703036185">
</amp-facebook>
Buka cuplikan ini di playground

Attributes

data-href (required) The URL of the Facebook post/video/comment. For example, a post or video will look like https://www.facebook.com/zuck/posts/10102593740125791. A comment or comment reply will look like https://www.facebook.com/zuck/posts/10102735452532991?comment_id=1070233703036185. For comments, see the Facebook documentation on how to get a comment's URL.
data-embed-as The value is either post, video or comment. The default is post.

Both posts and videos can be embedded as a post. Setting data-embed-as="video" for Facebook videos embeds the player of the video, and adds the accompanying post card with it. Setting data-embed-as="post" ignores the caption card. This is done to make sure we are zooming in on videos correctly.

The comment value embeds a single comment (or reply to a comment) on a post. This is not to be confused with amp-facebook-comments.

Check out the documentation for differences between post embeds, video embeds, and comment embeds.
data-include-comment-parent The value is either true or false. The default is false.

When you are embedding a comment reply, you can optionally also include the parent comment of the reply.
data-align-center The value is either true or false. The default is false.

For posts and videos, having this attribute set to true would align the post/video container to center.
data-locale (optional) By default, the locale is set to user's system language; however, you can specify a locale as well.

For details on strings accepted here please visit the Facebook API Localization page
common attributes This element includes common attributes extended to AMP components.

Validation

See amp-facebook rules in the AMP validator specification.

Perlu bantuan lainnya?

Anda telah membaca dokumen ini belasan kali, tetapi belum semua pertanyaan Anda terjawab? Mungkin orang lain merasakan hal yang sama. Berinteraksilah dengan mereka di Stack Overflow.

Kunjungi Stack Overflow
Menemukan bug atau ada fitur yang kurang?

Proyek AMP sangat menganjurkan partisipasi dan kontribusi Anda! Kami berharap Anda akan terus ambil bagian dalam komunitas sumber terbuka kami, tetapi kami juga menerima kontribusi satu kali untuk topik tertentu yang Anda minati.

Kunjungi GitHub