2月
24
2010
Twitterを表示する
投稿者: admin, カテゴリ: WordPress, tags: CSS, JavaScript, PHP, RSS, WordPress投稿日: 2010.02.24 - 04:26
更新日: 2010.02.24 - 04:48
Twitterを様々な場所に表示したい。
◆Wordpress では Twitter WordPress Sidebar Widget を使うことにした。
◆PHP では 今日も勉強しました: simpleXML でRSSの表示 PHP5 の方法がいいと思う（試してない）
<?php
$xml = simplexml_load_file('http://blog.goo.ne.jp/jhta0729/index.rdf');
$i = 0;
foreach ($xml->item as $item) {
if(++$i>3) break;
$title = (string)$item->title ;
$link = (string)$item->link ;
print ($title.$link."<br>");
}?>
◆Javascript や Flash では公式サイトのものが利用できる。
<div style="><div id="twitter_div" style="width:720px;margin-left:auto;margin-right:auto;text-align:left;"> <h2 style="display: none;" >Twitter Updates</h2> <ul id="twitter_update_list"></ul> <a href="http://twitter.com/xxxxxxxx" id="twitter-link" style="display:block;text-align:right;">follow me on Twitter</a> </div> <script type="text/javascript" src="http://twitter.com/javascripts/blogger.js"></script> <script type="text/javascript" src="http://twitter.com/statuses/user_timeline/xxxxxxxx.json?callback=twitterCallback2&count=5"></script> </div>
<style type="text/css">
<!--
#twitter_div {
margin : 0;
padding : 0;
width:180px;
border : 1px solid #cccccc;
background-color : #ffffff;
text-align : left;
color : #666666;
word-break: break-all;
font-size : 12px;
}
#twitter_div h2 {
margin : 5px 0 5px 0px;
text-align : center;
padding-left : 0px;
color : #33ccff;
font-size : 12px;
}
#twitter_div li {
margin-left : 0px;
padding-top : 5px;
padding-right : 5px;
padding-left : 5px;
padding-bottom : 5px;
border-bottom : 1px dashed #cccccc;
list-style-type: none;
}
#twitter_div a:link {
color : #088253;
}
#twitter_div a:active {
color : #088253;
}
#twitter_div a:visited {
color : #088253;
}
#twitter_div a:hover {
color : #28a273;
}
#twitter_update_list {
margin-left: 5px;
padding-left : 0px;
padding-top : 2px;
border-top : 1px dashed #cccccc;
}
</style>
<div id="twitter_div">
<h2>Twitter Updates<span></span></h2>
<ul id="twitter_update_list"></ul>
<a href="http://twitter.com/xxxxxxxx" id="twitter-link">follow me on Twitter</a>
</div>
<script type="text/javascript" src="http://twitter.com/javascripts/blogger.js"></script>
<script type="text/javascript" src="http://twitter.com/statuses/user_timeline/xxxxxxxx.json?callback=twitterCallback2&count=5"></script>
◆APIによる通信もできるとか。
◆参考文献
- WordPressのウィジェットにTwitterのつぶやきを表示する :
http://miyearnzz.sakura.ne.jp/archives/450 - Velvet Unravelled » Twitter WordPress Sidebar Widget :
http://www.velvet.id.au/twitter-wordpress-sidebar-widget/ - 創造マラソン – WordPressユーザー向け、10のtwitterツール：WPユーザー以外でも一部OK :
http://yoshikazuasada.biz/news/900 - WordPressでTwitter表示 :
http://www.ohmiyapatriots.com/blog/2007/06/21/wordpress%E3%81%A7twitter%E8%A1%A8%E7%A4%BA/ - README | alexking.org :
http://alexking.org/projects/wordpress/readme?project=twitter-tools - [Twitter] WordPressでTwitterのつぶやきを表示するプラグイン NiTwPress :
http://www.nwlab.com/?p=3974 - WordPressにTwitterを表示させる方法 | カグア！Google Analytics 活用塾:事例や使い方 : http://www.kagua.biz/tips/phptwitter1.html
- 今日も勉強しました: simpleXML でRSSの表示 PHP5 :
http://yumisaiki.blogspot.com/2009/05/simplexml-rssphp5.html - シンプルなTwitterのCSSレイアウトを考えてみる。 | feel my soul :
http://skyfinds.blog86.fc2.com/blog-entry-190.html - CSSについての質問です。 ボックスからはみ出るものを制御するのに 通常はoverflowを使用すると思うのですが 希望するような動作ができません。 やりたい内容は 横幅を固定.. – 人力検索はてな :
http://q.hatena.ne.jp/1148829723 - word-break－スタイルシートリファレンス :
http://www.htmq.com/style/word-break.shtml
エントリ (RSS)