amp-facebook-page
Introduction
The amp-facebook-page component allows embedding Facebook pages into AMP files.
Setup
Import the amp-facebook-page component
<script async custom-element="amp-facebook-page" src="https://cdn.ampproject.org/v0/amp-facebook-page-0.1.js"></script>
Basic usage
The amp-facebook-page component only requires the href of the facebook post.
<amp-facebook-page width="340" height="130" layout="responsive" data-href="https://www.facebook.com/imdb/">
</amp-facebook-page>
Internationalization support
You can set the locale to render the page in a different language, for example French.
<amp-facebook-page width="340" height="130" layout="responsive" data-href="https://www.facebook.com/imdb/" data-locale="fr_FR">
</amp-facebook-page>
Show different tabs
Render the timeline and events tab for a particular Facebook page by specifying data-tabs="timeline, events".
<amp-facebook-page width="552" height="310" layout="responsive" data-tabs="timeline, events" data-href="https://www.facebook.com/barackobama/">
</amp-facebook-page>
Facebook page cover
Hide the cover of a particular Facebook page by specifying data-hide-cover="true".
<amp-facebook-page width="552" height="310" layout="responsive" data-hide-cover="true" data-href="https://www.facebook.com/manchesterunited/">
</amp-facebook-page>
Friends
Hide the friends who follow a particular Facebook page by specifying data-show-facepile="false". (Need to be logged in to see this.)
<amp-facebook-page width="300" height="300" layout="responsive" data-show-facepile="false" data-href="https://www.facebook.com/itsdougthepug">
</amp-facebook-page>
Call to action
Hide the call to action for a particular Facebook page by specifying data-hide-cta="true".
<amp-facebook-page width="300" height="300" layout="responsive" data-hide-cta="true" data-href="https://www.facebook.com/TCF.Pak/">
</amp-facebook-page>
Change header size
Show a small header for the page by specifying data-small-header="true".
<amp-facebook-page width="300" height="300" layout="responsive" data-small-header="true" data-href="https://www.facebook.com/itsdougthepug">
</amp-facebook-page>
如果此页面上的说明未能涵盖您的所有问题，欢迎与其他 AMP 用户取得联系，讨论您的具体用例。
前往 Stack Overflow 一项无法解释的功能？AMP 项目强烈鼓励您参与并做出贡献！我们希望您能成为我们开放源代码社区的持续参与者，但我们也欢迎您对所热衷问题做出一次性贡献。
编辑 GitHub 上的示例-