首页 » 互联网络 » 利用Google Feed API即时展示其它博客的Feed

2008-06-09 – 12:03 pm

个性化域名

去年我曾经介绍过在一个博客即时调用其它博客的RSS Feed的方法-利用Google Reader。这种方法的好处是你不需要知道任何技术细节,你只需要添加订阅到GR,制作一个Tag,然后设置成公开,最后调用。然而这种简单的方法有个不好的地方,一是在调用列表的底部会有个多余的Read More链接,另外无法预览文章摘要。利用Google Feed API可以很好地解决这个问题。

上图的Feed调用同时出现在可能吧右侧栏的底部。

除了可以单独调用一个Feed,还可以同时调用多个,如下图所示:

如何利用Google AJAX Feed API实现这个调用呢?

如果你对代码有恐惧感,不用害怕,放心看下去,你会发现即使你和我一样是代码白痴都能很好地使用Feed API。

下面一个最简单的Feed调用代码:

正在加载… 


 

将上面的模板稍作修改,就能在博客上调用其它博客的Feed。

哪些参数可以修改呢?

1、要调用的Feed

将要调用的Feed(一个或多个)写入到"var feeds"里头,格式如{title: ‘可能吧’, url: ‘http://feeds.kenengba.com/kenengbarss’ }要,调用多个Feed,中间用逗号分割。

2、常用参数:

numResults : 8, (展示条目数,这里用8)
displayTime : 2000, (单个项目展示时间,这里用2000毫秒)
fadeOutTime : 500, (渐变消失时间,这里用500毫秒)
scrollOnFadeOut : true, (滚动消失,设置成false的话每个条目将以淡出的方式消失)
pauseOnHover : true, (设置成false的话鼠标经过某个条目不会显示摘要)
stacked : false, (设置成true的话将在同时展示多个feed,false则轮番展示)
horizontal : false, (设置成true的话将以一个一个条目地展示feed,而不是列表形式)
title : ‘可能吧’ (标题)

每个参数之间用逗号分割。更多高级参数可以参考Google的帮助文档。

3、申请API Key

注意到模板中的“你的API Key“,要调用Feed API,你需要首先到这里申请API KEY,马上就能生成。

4、CSS修改

大多数情况下你不需要去修改CSS,除非你是个特别喜欢自定义的人。

默认情况下,FeedAPI调用的是http://www.google.com/uds/solutions/dynamicfeed/gfdynamicfeedcontrol.css这个CSS样式,如果你想个性化一点,可以下载这个CSS,然后修改成自己喜欢的样式。

然后在将新的CSS添加到模板里。

5、加入到博客

将修改好的整块代码放入到你想展示的位置,就像可能吧的右侧栏。

6、抓取频率

Google AJAX Feed API对feed的抓取大概是1小时一次。更新量大的博客抓取频率会相应提高。

7、遇到的问题

如果不修改CSS,在IE7下Feed API显示正常, 但在Firefox 2下不能调用CSS,也就是第三点中提到的默认CSS。我不知道这是不是我个人遇到的问题。

要解决这个问题很简单,将默认的CSS下载,然后将里面的内容复制到模板中,替换:

@import url("http://www.google.com/uds/solutions/dynamicfeed/gfdynamicfeedcontrol.css");

即可。

8、其它用途

1、展示最新留言(Wordpress提供最新评论的RSS输出)。

2、模拟Friend Feed。Friend Feed也是将所有RSS合并在一起,利用Google AJAX Feed API,你完全可以实现Firend Feed所能实现的功能。

最后,希望我的表述你能完全理解。


除非注明,本博客文章均为原创,转载请以链接形式标明本文地址
本文地址:http://www.kenengba.com/post/460.html
本文短网址:http://knb.im/dn

  • 27条评论

    1. No.1

      难得的沙发,先顶后看

    2. No.2

      沙发没了,板凳也行。顶了再慢慢去看代码。

    3. No.3

      这篇文章很喜欢,谢谢了

    4. No.4

      JS的API,理论上实现了不管哪个页面都能调用feed,太赞了
      对于google reader share, 那个more可以用CSS隐藏掉的:)
      i love google

    5. No.5

      我倒不需要这样的滚动显示效果,我在用gr里面的tag输出,read more 也拿掉了,可是我需要一个新窗口打开。。。

    6. No.6

      这个功能我还真的很喜欢诶~~
      马上去试用~~

    7. 这个有点像是RSS 订阅的功能一样!

    8. No.8

      Javascript调用的不好,对搜索引擎不友好。

    9. uida 发表于 2008-06-10,12:37 am
      No.9

      偶是被YD吸引进来的 呵呵 弱弱地飘过~~~~~

    10. 呵呵,这个不错。
      话说我在gr这么漏看了这篇文章呢?

    11. even 发表于 2008-06-12,8:24 pm
      No.11

      其实有个问题的,就是还是会延迟。

    12. No.12

      呵呵,原来如此。

    13. mason 发表于 2008-08-17,2:39 pm
      No.13

      不错学习了吗

    14. No.14

      哈哈,又学会一招

    15. 207 发表于 2008-08-31,12:20 pm
      No.15

      请问一下调用多个feed的代码具体怎么写啊,我怎么老做不成功呢?

    16. No.16

      可能吧,精品多啊。

    17. No.17

      学习到了

    1. 引用:

    2. Jun 9, 2008: ¡úPolaris
    3. Jun 10, 2008: 酷米小客 - 每日网摘 » Blog Archive » links for 2008-06-09
    4. Jun 12, 2008: 简单使用谷歌API,即时显示来自全球的相关信息 G日报
    5. Aug 9, 2008: 微视团队博客 » Blog Archive » 在博客加入2008北京奥运会赛程表小器件(widget)
    6. Aug 15, 2008: Google依赖症及使用Google服务的10大原因
    7. Aug 27, 2008: Top Friends 0.3 | RSS Reader
    8. Aug 29, 2008: 利用Google Feed API即时展示其它博客的Feed(转载) | 迈向成功的脚步
    9. Jul 8, 2009: 利用Google Feed API实现RSS订阅即时展示 - 木木木木木
    10. Aug 13, 2009: Google AJAX Feed API + Google Reader = ? | ZhangYing.info
    11. Jan 16, 2010: 利用Google Feed API即时展示其它博客的Feed(转载) | 迈向成功的脚步

    发表评论

    你的Email永远不会被公开 加*为必填项

    *