amp-facebook-comments
简介
amp-facebook-comments
组件允许将 Facebook 评论嵌入到 AMP 文件中。
设置
导入 amp-facebook-comments
组件
<script async custom-element="amp-facebook-comments" src="https://cdn.ampproject.org/v0/amp-facebook-comments-0.1.js"></script>
基本用法
amp-facebook-comments
组件只需要评论的 href。
<amp-facebook-comments width="486" height="657" layout="responsive" data-href="http://www.directlyrics.com/adele-25-complete-album-lyrics-news.html">
</amp-facebook-comments>
国际化支持
您可以设置语言环境以使用不同的语言渲染评论,例如法语,只需指定 data-locale="fr_FR"
即可。
<amp-facebook-comments width="552" height="310" layout="responsive" data-order-by="social" data-href="https://developers.facebook.com/docs/plugins/comments" data-locale="fr_FR">
</amp-facebook-comments>
限制评论数量
您可以通过指定 data-numposts="5"
来限制一次显示的评论数量。
<amp-facebook-comments width="552" height="310" layout="responsive" data-numposts="5" data-href="http://www.directlyrics.com/adele-25-complete-album-lyrics-news.html">
</amp-facebook-comments>
主题
通过指定 data-colorscheme="dark"
将评论的配色方案设置为深色。
<amp-facebook-comments width="552" height="310" layout="responsive" data-colorscheme="dark" data-href="http://www.directlyrics.com/adele-25-complete-album-lyrics-news.html">
</amp-facebook-comments>
评论排序
默认情况下,评论按最受欢迎的顺序排序,您可以通过指定 data-order-by="time"
将其更改为按时间排序。
<amp-facebook-comments width="552" height="310" layout="responsive" data-order-by="time" data-href="http://www.directlyrics.com/adele-25-complete-album-lyrics-news.html">
</amp-facebook-comments> </body>
需要进一步解释?
如果本页的解释没有涵盖您的所有问题,请随时联系其他 AMP 用户,讨论您的具体用例。
前往 Stack Overflow 未解释的功能?AMP 项目强烈鼓励您的参与和贡献!我们希望您成为我们开源社区的长期参与者,但我们也欢迎您为自己特别关注的问题做出一次性贡献。
在 GitHub 上编辑示例-
作者: @nainar