Friday, February 10, 2012

Feedsky feedburner
当前位置 首页 / 互联网络 / 博客上添加twitter挂件的方法-超级简单

博客上添加twitter挂件的方法-超级简单

2010-06-10 by zhiwei  

17 Comments

最近一不小心发现原来在博客上添加twitter挂件很简单。只需要一个twitter api  地址，几行代码就可以了，现在贴出来与各位同学分享。以下是相关说明。

假设你的twitter api地址是：http://abc.com/api/

只需要将以下代码第六行中的twitter_username改为你自己的twitter用户名，其中的count=2是说明只显示最新的两条推。你可以根据自己的需求而适当更改。将这几行代码加到<head></head>之间，当然，你也可以加到主题的function.php或其他.php文件里面。看完以下代码后你会发现，只需稍做修改就可以运用到静态网页中了。

1
2
3
4
5
6
7
8
9

<?php
function twitter_show()
{
    ?>
    <script type="text/javascript" src="http://abc.com/api/javascripts/blogger.js"></script>
    <script type="text/javascript" src="http://abc.com/api/statuses/user_timeline/twitter_username.json?callback=twitterCallback2&count=2"></script>
    <?php
}
?>

以下代码是显示twitter条目的代码，你可以加到博客侧边栏或者加到博客顶部，像我博客(chenzhiwei.net)这样，由于博客主机速度原因，加载javascript太慢，所以将顶部tweets去掉了，效果见http://chenzhiwei.net/twitter/tweets.php ，因api原因，有时可能会显示不出来，刷新一下就OK了。如果懂CSS的话，你自己还可以优化一下tweets的显示，使用其更加美观。

1
2
3
4
5
6

<div id="">
	<ul id="twitter_update_list">
		<li>&nbsp;loading...</li>
		<?php twitter_show(); ?>
	</ul>
</div>

到此，博客上添加twitter挂件功能就实现了，非常简单。
下面给出一个测试例子：index.php文件，将该文件中的http://abc.com/api/改为你自己的twitter api地址，然后运行该文件后就会显示两条tweets。效果见http://chenzhiwei.net/twitter/tweets.php 。

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20

<html xmlns="http://www.w3.org/1999/xhtml" >
<head profile="http://gmpg.org/xfn/11">
<title>show tweets</title>
<?php
function twitter_show()
{
    ?>
    <script type="text/javascript" src="http://abc.com/api/javascripts/blogger.js"></script>
    <script type="text/javascript" src="http://abc.com/api/statuses/user_timeline/chenzhiwei.json?callback=twitterCallback2&count=2"></script>
    <?php
}
?>
</head>
<body>
    <ul id="twitter_update_list">
        <li>&nbsp;</li>
            <?php twitter_show(); ?>
    </ul>
</body>
</html>

© 2010, chenzhiwei.net. 版权所有.
本文永久链接：http://chenzhiwei.net/2010/06/add-twitter-gadget-on-your-blog/

Tags: , ,

相关日志

Comments

17 Responses to “博客上添加twitter挂件的方法-超级简单”
  1. 王先进博客 说道：
    2010年07月30日 10:39 上午

    这方法不错

    回复
  2. 五号杂货铺 说道：
    2010年07月19日 10:43 下午

    测试一下文章评论功能。

    回复
  3. 庄振声 说道：
    2010年07月10日 3:16 下午

    恩，挺有用的,就是难度有点大.

    回复
  4. Leyond 说道：
    2010年06月25日 6:18 下午

    不错啊~ 呵呵

    回复
  5. dengm 说道：
    2010年06月25日 4:49 下午

    twitter 一直打不开

    回复
  6. BoKeam 说道：
    2010年06月25日 12:53 下午

    暂无打算把twitter加在上面

    回复
  7. 童宝宝 说道：
    2010年06月23日 7:21 下午

    bz的方法，看的偶很鸡动啊

    回复
  8. andol 说道：
    2010年06月22日 3:37 下午

    恩，挺有用的

    回复
  9. Mucid 说道：
    2010年06月20日 10:07 下午

    现在换上了VPS，主题的widget可以接收到偶的twitter真的很有爱^_^

    回复
  10. 帅哥 说道：
    2010年06月18日 10:07 上午

    我好久不玩Twitter了，。

    回复
  11. lazywen 说道：
    2010年06月16日 10:27 下午

    看见你上面的twitter啦,原来是这样的,收藏

    回复
  12. zhukun 说道：
    2010年06月11日 6:28 下午

    我不喜欢微博，上twitter只是为了看看特殊的新闻以及大家的看法而已

    回复
  13. Louis Han 说道：
    2010年06月10日 11:56 下午

    好像不能用官方的API吧

    回复
  14. houkai 说道：
    2010年06月10日 9:41 下午

    方法很好 收藏备用之~~

    回复

Speak Your Mind