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>
Si las explicaciones que se encuentran en esta página no responden todas sus preguntas, no dude en comunicarse con otros usuarios de AMP para discutir el caso de uso exacto.
Ir a Stack Overflow ¿Faltó que explicáramos alguna función?¡El proyecto AMP alienta profundamente su participación y contribuciones! Esperamos que se convierta en un miembro permanente de nuestra comunidad de código abierto, pero también agradecemos las contribuciones esporádicas sobre los temas que le apasionan especialmente.
Editar ejemplo en GitHub-