【发布时间】:2015-11-30 12:14:30
【问题描述】:
我想为一个 WordPress 网站创建一个脚本 (javascript/jQuery),它允许我拥有来自多个 Facebook 页面的最新帖子。我不希望帖子按帐户排序,而是混合在一起,按 created_time 排序。我已经在搜索插件了,我不需要 WP 插件。
<!doctype html>
<html>
<head>
<meta charset="utf-8" />
<title>FaceBook Posts</title>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/2.1.4/jquery.min.js"></script>
<script type="text/javascript">
function fbFetch(){
//Set Url of JSON data from the facebook graph api. make sure callback is set with a '?' to overcome the cross domain problems with JSON
var url = "https://graph.facebook.com/footengo31/posts?access_token=XXX&limit=5&callback=?";
var url2 = "https://graph.facebook.com/footengo01/posts?access_token=XXX&limit=5&callback=?";
var url3 = "https://graph.facebook.com/Footengo69/posts?access_token=XXX&limit=5&callback=?";
$.getJSON(url,function(json1){
$.getJSON(url2,function(json2){
$.getJSON(url3,function(json3){
var json = {};
json['json1'] = json1;
json['json2'] = json2;
json['json3'] = json3;
var json_array = [];
json_array.push(json);
//Use jQuery getJSON method to fetch the data from the url and then create our unordered list with the relevant data.
var html = "<ul>";
//loop through and within data array's retrieve the message variable.
$.each(json.json1.data, function(i,fb){
if (typeof fb.picture != "undefined") {
html += "<li>" + fb.message + "</br>" + '<img SRC="' + fb.picture + '">' + "</br>" + fb.created_time + "</li></br>";
}
else{
html += "<li>" + fb.message + "</br>" + fb.created_time + "</li></br>";
}
});
$.each(json.json2.data,function(i,fb){
if (typeof fb.picture != "undefined") {
html += "<li>" + fb.message + "</br>" + '<img SRC="' + fb.picture + '">' + "</br>" + fb.created_time + "</li></br>";
}
else{
html += "<li>" + fb.message + "</br>" + fb.created_time + "</li></br>";
}
});
$.each(json.json3.data,function(i,fb){
if (typeof fb.picture != "undefined") {
html += "<li>" + fb.message + "</br>" + '<img SRC="' + fb.picture + '">' + "</br>" + fb.created_time + "</li></br>";
}
else{
html += "<li>" + fb.message + "</br>" + fb.created_time + "</li></br>";
}
});
html += "</ul>";
//A little animation once fetched
$('.facebookfeed').animate({opacity:0}, 500, function(){
$('.facebookfeed').html(html);
});
$('.facebookfeed').animate({opacity:1}, 500);
});
});
});
};
</script>
</head>
<body onload="fbFetch();">
<div class="facebookfeed">Loading...</div>
</body>
我的 3 个帐户有 5 个最后的帖子,但第一页有 5 个最后的帖子,第二页有 5 个最后的帖子......这给了我这个结果:
【问题讨论】:
标签: javascript php jquery wordpress facebook