2个google ajax feed api 实例
这两天在学着美化自己的mediawiki,由于总感觉首页很单调,于是想在上面放个实时更新的界面,使得wiki首页看上去总有更新.主要是最新词条的信息和最近修改的信息.
由于知识有限,主要是去网上找些工具和代码,发现了google ajax feed api这样个好东西.其中的AJAX Dynamic Feed Control可以直接在网页中调用.
简单介绍2个实例,具体可以去google上看看.以下代码开头中的key=notsupplied-wizard这段在实际使用中请改成具体的google API key.
1.第一个比较简洁,列出RSS的标题和简洁,可以添加多个RSS. 效果见这.
<script type="text/javascript" src="http://www.google.com/jsapi?key=notsupplied-wizard"></script> <script type="text/javascript"> google.load("feeds", "1"); function initialize() { var feedControl = new google.feeds.FeedControl(); feedControl.addFeed("http://feed.feedsky.com/molezz", "molezz BAR"); feedControl.addFeed("http://feed.feedsky.com/molezz", "molezz BAR2"); feedControl.draw(document.getElementById("feedControl")); } google.setOnLoadCallback(initialize); </script> <div id="feedControl">Loading</div>
2.第二个比较花哨,有动态效果,也可以添加多个RSS,效果见这.
<div id="feed-control"> <span style="color:#676767;font-size:11px;margin:10px;padding:4px;">Loading...</span> </div> <!-- Google Ajax Api --> <script src="http://www.google.com/jsapi?key=ABQIAAAAYyAcC_2-AB_-d2frcEenJhT_l7btg2vey3SF4xrWe8eMrDUaihT1d3ADiu199b_6prRFCyRUi-QoAQ" type="text/javascript"></script> <!-- Dynamic Feed Control and Stylesheet --> <script src="http://www.google.com/uds/solutions/dynamicfeed/gfdynamicfeedcontrol.js" type="text/javascript"></script> <style type="text/css"> @import url("http://www.google.com/uds/solutions/dynamicfeed/gfdynamicfeedcontrol.css"); </style> <script type="text/javascript"> function LoadDynamicFeedControl() { var feeds = [ {title: 'molezz BAR', url: 'http://feed.feedsky.com/molezz' }, {title: 'molezz BAR 2', url: 'http://feed.feedsky.com/molezz' }]; var options = { stacked : true, horizontal : false, title : "Google feed api实例2" } new GFdynamicFeedControl(feeds, 'feed-control', options); } // Load the feeds API and set the onload callback. google.load('feeds', '1'); google.setOnLoadCallback(LoadDynamicFeedControl); </script>
更多设置参数详见google文档.另外这个实例中的外观也可以自己写css进行替换.
Popularity: unranked

Recent Comments