为博客侧边栏添加 twitter 挂件,此挂件来自 twitter 官网,一共有Profile WidgetSearch WidgetFaves WidgetList Widget 四种模式。以 Profile Widget 为例,其功能是显示用户最近的几条推。进入 Profile Widget 页面,在左边的 setting 里填入你的 Username ,右边就会显示出挂件的预览效果,如果不满意,可以进入 apperance 等进行自定义,颜色可以通过代码精确的设置,利用这个小软件 下载 可以获得网页上任意像素的颜色代码,就可以设置成隐藏 bar 的效果了。
设置满意后获取代码如下:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
<script src="http://widgets.twimg.com/j/2/widget.js"></script>
<script>
new TWTR.Widget({
  version: 2,
  type: 'profile',
  rpp: 4,
  interval: 6000,
  width: 250,
  height: 300,
  theme: {
    shell: {
      background: '#333333',
      color: '#ffffff'
    },
    tweets: {
      background: '#000000',
      color: '#ffffff',
      links: '#4aed05'
    }
  },
  features: {
    scrollbar: false,
    loop: false,
    live: false,
    hashtags: true,
    timestamp: true,
    avatars: false,
    behavior: 'all'
  }
}).render().setUser('Tsquall0629W').start();
</script>
因为用的是官方 api,这样直接贴到 sidebar.html 里肯定是要被墙的,所以要进行一些修改,代码的第一行调用了这样一个 js 文件 http://widgets.twimg.com/j/2/widget.js ,我们先用浏览器把它下载来看看。
随便找个差不多点的文本编辑器打开下载到的 widget.js,可以看到代码都密密麻麻的挤在一起了,但是别怕,只需用文本编辑器的替换功能将所有的  http://twitter.com/ 替换成你的 twitter 的 api 地址,注意要保证所替换的 api 地址以 “ / ”结尾。保存修改好的 widget.js。
将上段代码中的 http://widgets.twimg.com/j/2/widget.js 替换成 http://你博客的域名/static/js/widget.js ,然后将修改好的代码复制到 sidebar.html 中。
如果搞不定 api 的话,就把前面调用的  http://widgets.twimg.com/j/2/widget.js 直接改成 http://gayiorg.googlecode.com/files/widget12.js 就行了。