【追記】2010/07/27
現在、Twitterのウィジェットは下記で紹介しているものとは別のものになっていて
下記の解説では、現在のウィジェットでは適用できません。。。。
そして、新しいウィジェットはJavascriptで出来ているため、現状のYahoo!ブログの仕様では
記事中に貼り付けることは不可能です。
一昨日くらいのGoogle検索キーワードランキングに
「ツイッター」というキーワードがあり、ずっと放置していたアカウントにログインして
ここ数日、再びTwitterを使い始めました。
前と違って言語選択が出来るようになってて、タイムライン上にも日本のユーザしか
表示されないようになっててちょっと使いやすくなったように思います。
あと、iPhoneで投稿している人も多いみたいで前以上ににぎわってる印象でした。
「Twitterを再開したからには、書いたことが自分のブログにも表示されたらいいなぁ」ということで
Yahoo!ブログにTwitterガジェットを貼る方法を見つけたので、紹介したいと思います。
1.設定画面を開いて、↓のリンクをクリック。
2.Myspaceを選択して「続く」ボタンをクリック。
3.好きなデザインを選択(例では左)して「続く」ボタンをクリック。
4.デザインを設定して、HTMLタグをコピーする。
↑の画像の左上で色合いの設定や幅などが選択できます。
(幅に関しては後で修正が可能なので、とりあえずWideを選択するといいです)
選択が終わったら、下にあるHTMLタグをすべてコピーします。
5.コピーしたコードから、Yahoo!ブログ用のコードを作る。
4でコピーしたHTMLタグをメモ帳や、Yahoo!ブログの記事書き込みスペースに貼り付けると
以下のようになります。
<object classid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=9,0,124,0" width="290" height="350" id="TwitterWidget" align="middle">
<param name="allowScriptAccess" value="always" />
<param name="allowFullScreen" value="false" />
<param name="movie" value="http://static.twitter.com/flash/widgets/profile/TwitterWidget.swf" />
<param name="quality" value="high" />
<param name="bgcolor" value="#000000" />
<param name="FlashVars" value="userID=13753462&styleURL=http://static.twitter.com/flash/widgets/profile/smooth.xml">
<embed src="http://static.twitter.com/flash/widgets/profile/TwitterWidget.swf" quality="high" bgcolor="#000000" width="290" height="350" name="TwitterWidget" align="middle" allowScriptAccess="sameDomain" allowFullScreen="false" type="application/x-shockwave-flash" pluginspage="http://www.macromedia.com/go/getflashplayer" FlashVars="userID=13753462&styleURL=http://static.twitter.com/flash/widgets/profile/smooth.xml"/>
</object>
一見、難しそうに見えますが、重要なのは最後から2行目の「<embed 」で始まる↓の部分です。
<embed src="http://static.twitter.com/flash/widgets/profile/TwitterWidget.swf" quality="high" bgcolor="#000000" width="290" height="350" name="TwitterWidget" align="middle" allowScriptAccess="sameDomain" allowFullScreen="false" type="application/x-shockwave-flash" pluginspage="http://www.macromedia.com/go/getflashplayer" FlashVars="userID=13753462&styleURL=http://static.twitter.com/flash/widgets/profile/smooth.xml"/>
↑の部分から、2つを抜き出します。
(1)src部分
src="http://static.twitter.com/flash/widgets/profile/TwitterWidget.swf"
(2)FlashVars部分
FlashVars="userID=13753462&styleURL=http://static.twitter.com/flash/widgets/profile/smooth.xml"
この(1)と(2)を余計な部分を切り取って↓のように「?」でくっつけます。
http://static.twitter.com/flash/widgets/profile/TwitterWidget.swf?userID=13753462&styleURL=http://static.twitter.com/flash/widgets/profile/smooth.xml
これで貼り付け用FlashURLの準備はOK。
あとは、ほかのFlashと同様に
[[embed(http://〜,1,横幅,縦幅)]]
と指定すればいいので
[[embed(http://static.twitter.com/flash/widgets/profile/TwitterWidget.swf?userID=13753462&styleURL=http://static.twitter.com/flash/widgets/profile/smooth.xml,1,550,350)]]
と、書けるので、↑を貼り付ければ↓こんな風に表示されることができます。
ちょっと長くなりましたが、Twitterをやってる方はぜひぜひ試してみてください!
あと、この記事は転載OKなので、Twitterをやってる方に教えてあげたい方は
気軽に転載して、お使いくださいませ!
|