電気ウナギ的○○

About Home

Twitterの最新のツイートを表示させるウィジェット

shinoda (2009年11月 6日 02:56)
tsubuyaki.jpgTwitter のプロフィール情報(プロフィール押した時に表示される発言一覧)を表示するウィジェットをブログ(MTOS)に貼ってみる。

まずは、ウィジェットの HTML を取得する必要がある。

Twitter活用術→ウィジェットの画面(http://twitter.com/widgets)にアクセスする。
ちなみにこの画面、うちの InternetExplorer8 on Windows Vista Business SP2 の環境では正常に表示されない。
左の「Widgets for...」のメニューが表示されないのだ。
つーことで、俺は Firefox でアクセスした。

で、「自分のサイト」の「プロフィールウィジェット」を選択する。
設定画面が開くので、自分の環境に合わせて設定を行う。
俺は、「デザイン」で色を自分のブログに合わせ、「サイズ」で横幅をブログの右ペインの幅に収まるように、250→198 に変更。そして、ディフォルトでは 4つである表示するつぶやきの数を 5つにした。「Preferences」の「Number of Tweets」のところね。

そして、「完了&コード取得」ボタンを押せば、HTML が生成される。

ここから後は、MTOS のウィジェットの貼付手順どおりに作業をすればいい。
Nike+ のブログツールをサイドバーに」を参考にしてみてちょ。

取得した HTML ソースは、おきまりの <div> タグで囲っておくこと。

(例)
<div class="widget-twitter widget">
    <div class="widget-content">

<script src="http://widgets.twimg.com/j/2/widget.js"></script>
<script>
new TWTR.Widget({
  version: 2,
  type: 'profile',
  rpp: 5,
  interval: 6000,
  width: 198,
  height: 300,
  theme: {
    shell: {
      background: '#e3b200',
      color: '#ffffff'
    },
    tweets: {
      background: '#ffffff',
      color: '#2e230b',
      links: '#f03c28'
    }
  },
  features: {
    scrollbar: false,
    loop: false,
    live: false,
    hashtags: true,
    timestamp: true,
    avatars: false,
    behavior: 'all'
  }
}).render().setUser('Shar6507').start();
</script>
    </div>
</div>


いやぁ、簡単ですねえ。MovableType へのウィジェットの追加。

電気ウナギ的○○

電気ウナギ的○○

About Back

コメント(2)

ちろ |2010年4月25日 11:42

Firefoxでも出来ない場合はどうしたらいいですかね?(泣)

電気ウナギ的○○

電気ウナギ的○○

About Back

トラックバック(0)

トラックバックURL: https://blog.netandfield.com/mt/mt-tb.cgi/865

電気ウナギ的○○

About This Site

電気ウナギ的○○
岩国在住。広島で働く超零細IT企業社長のいわゆる社長日記。
何か、酒と食い物のことばかり書いているようで・・・お察しのとおり、肥満体です:-)


2011/06/24
iPhone用サイト公開

Create with jQuery, jQTouch.


CLOSE