amp-facebook

1.0 0.1

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

用法

您可以使用 amp-facebook 组件来嵌入 Facebook 帖子、Facebook 视频或 Facebook 帖子上的评论。

以下示例演示如何嵌入帖子

<amp-facebook width="552" height="310"
    layout="responsive"
    data-href="https://127.0.0.1/ParksCanada/posts/1712989015384373">
</amp-facebook>

以下示例演示如何嵌入视频

<amp-facebook width="476" height="316"
    layout="responsive"
    data-embed-as="video"
    data-href="https://127.0.0.1/nasaearth/videos/10155187938052139">
</amp-facebook>

以下示例演示如何嵌入帖子上的评论

<amp-facebook width="552" height="500"
    layout="responsive"
    data-embed-as="comment"
    data-href="https://127.0.0.1/zuck/posts/10102735452532991?comment_id=1070233703036185">
</amp-facebook>

属性

data-href

Facebook 帖子/视频/评论的 URL。例如，帖子或视频看起来像 https://127.0.0.1/zuck/posts/10102593740125791。评论或评论回复看起来像 https://127.0.0.1/zuck/posts/10102735452532991?comment_id=1070233703036185。

data-embed-as

该值可以是 post、video 或 comment。默认值为 post。

帖子和视频都可以作为帖子嵌入。为 Facebook 视频设置 data-embed-as="video" 会嵌入视频播放器，并添加随附的帖子卡片。设置 data-embed-as="post" 会忽略标题卡片。这样做是为了确保我们正确地放大视频。

comment 值会嵌入帖子上的单个评论（或对评论的回复）。这与 amp-facebook-comments 不同。

请查看文档，了解 帖子嵌入 和 视频嵌入 之间的区别。

data-include-comment-parent

该值可以是 true 或 false。默认值为 false。

当您嵌入评论回复时，您还可以选择包含回复的父评论。

data-allowfullscreen

该值可以设置或省略。默认值为省略（不全屏）。

嵌入视频时，设置此值以允许全屏体验。

data-align-center

该值可以是 true 或 false。默认值为 false。

对于帖子和视频，将此属性设置为 true 会将帖子/视频容器对齐到中心。

data-locale（可选）

默认情况下，区域设置设置为用户的系统语言；但是，您也可以指定区域设置。

有关此处接受的字符串的详细信息，请访问 Facebook API 本地化页面。

title（可选）

为组件定义一个 title 属性，以传播到底层的 <iframe> 元素。默认值为 "Facebook"。

常用属性

此元素包括扩展到 AMP 组件的常用属性。

验证

请参阅 AMP 验证器规范中的 amp-facebook 规则。