一个前端引用Facebook评论插件案例

首页 > 代码库 > 一个前端引用Facebook评论插件案例

一个前端引用Facebook评论插件案例

2024-08-24 03:52:08 220人阅读

最近公司海外的同事提了一个新的需求；那就是将Facebook的评论系统接入到公司海外网站的资讯详情页。

下面做一个简单的介绍：

　　首先我们登录到Facebook开发者平台；然后进入评论插件系统(https://developers.facebook.com/docs/plugins/comments)

然后我们就可以看到Facebook评论插件的详细介绍。

进去之后我们就可以看到一个获取代码的按钮；只要输入我们需要评论的宽度就可以了：

JS代码：
/*****************************注意：这里面src那里 “th_TH”代表的是此评论需要引入的语言类型*******************************************/
1 <script>(function(d, s, id) {
2     var js, fjs = d.getElementsByTagName(s)[0];
3     if (d.getElementById(id)) return;
4     js = d.createElement(s); js.id = id;
5     js.src = "http://connect.facebook.net/th_TH/sdk.js#xfbml=1&version=v2.8&appId=Facebook账号设置评论应用的id";
6     fjs.parentNode.insertBefore(js, fjs);
7 }(document, ‘script‘, ‘facebook-jssdk‘));</script>

1 <div id="fb-root"></div>  <!--这里表示Facebook评论框id-->
2 <div class="fb-like" data-share="true" data-width="450" data-show-faces="true"></div><!--显示点赞和分享按钮-->
3 <div class="fb-comments" data-url="http://xxx"  data-width="670" data-numposts="5"></div><!--表示当前评论是那个url下的，评论框宽度670px,一次显示5条评论-->