异步加载wordpress最新评论

→

昨天回家了,忙到大半夜才歇脚,就没写了,评论也大多没回复,今天堆一起回估计又要超标了.
本文原理是利用Google AJAX APIs实现RSS的异步加载,也可以广泛应用在其他地方,例如:我们都知道wordpress默认抓取RSS的函数fetch_feed()比较影响速度,所以如果你的网站有抓取rss,就可以采用此方法,这样不会影响后面元素的正常加载.
方法很简单,把如下代码扔到你要加载最新评论的地方即可,比如边栏

<div id="feedControl">loading...</div>
<!--当ajax抓取到feed之后,会将此容器覆盖,loading可改成你想要的加载效果-->
<script src="http://www.google.com/jsapi" type="text/javascript"></script>
<script src="http://www.google.com/uds/solutions/dynamicfeed/gfdynamicfeedcontrol.js"></script>
<script type="text/javascript">
function LoadDynamicFeedControl() {
var feeds = [
{title: '',
url: 'http://你的网址/comments/feed'
}];
var options = {
numResults : 10, //抓取的条数 
displayTime : 2000, //上方单条摘要展示的时间,单位毫秒
fadeOutTime : 1000, //轮换展示的间隔,单位毫秒
scrollOnFadeOut : true,//切换时是否使用渐隐效果
pauseOnHover : true, //当鼠标移过时是否显示其摘要
stacked : false, //是否同时展示多条摘要
horizontal : false, //true则一次只展示一条,false则以列表形式展示
title : "最新评论" //标题,可不写,为了与主题搭配,下面的css中已经将其隐藏
}
new GFdynamicFeedControl(feeds, 'feedControl', options);
}
google.load('feeds', '1');
google.setOnLoadCallback(LoadDynamicFeedControl);
</script>
<!--CSS开始-->
<style type="text/css">
@import url("http://www.google.com/uds/solutions/dynamicfeed/gfdynamicfeedcontrol.css");
.gfg-root { border:0px}
.gfg-title,.gfg-subtitle{ display:none}
.gfg-listentry {line-height: 2.5em}
.gfg-listentry a{text-decoration:none;color:#444}
.gfg-listentry-odd {background:none;}
.gfg-listentry-highlight {background:#ddd}
</style>

这段代码同样适用于其他任何你想抓取RSS的地方,最终效果如图,