yoppa.org


Blog

Twitterのブログ貼り付けメモ

Twitterから提供されている方法(オフィシャル版)

  • HTML + Javascript版
    • シンプルにHTMLのみを出力。リスト形式で指定した個数の投稿を列挙する。
    • 書き出されたHTML全体が、<div id="twitter_div">で囲まれているので、#twitter_idをセレクタにしてCSSでデザインすることで、自由にカスタマイズ可能。
  • Flash版
    • 2つのバージョン
    • Interactive
      • 指定した個数の投稿を表示、スクロールバーで上下に
    • Display-only
      • 一つずつ、投稿を表示
  • 作成方法
    • http://twitter.com/badges/ にアクセス、作成したいidでログインする。
    • "Where do you want to put it?" の選択を"Other"にしてContinue
    • Flash or HTMLを選択
    • Flash
      • Interactice or Display-onlyを選択
      • プレビューを確認しながら、パラメータを調整
      • テキストエディト欄に表示されているHTMLコードをコピーして、自分のページにペースト
    • HTML
      • 表示する投稿数、タイトルを設定
      • テキストエディト欄に表示されているHTMLコードをコピーして、自分のページにペースト

出力サンプル:HTML+ Javascript版


HTMLソース

出力サンプル:Flash版 – Interactive

HTMLソース

出力サンプル:Flash版 – Display-only

follow tadokoro at http://twitter.com

HTMLソース

Twitterから提供されている別の方法(HTML + Javascript)

  • Twitterで提供されている別のウィジット
  • Javascriptを使用
  • Twitter / Widgetsにアクセス http://twitter.com/widgets
  • "Widgets for…" で "My Website" を選択
  • "Profile Widget" を選択
  • 各種設定を調整
    • Settingで"Username" を設定
    • Preferenceでプレビューで見ながらパラメータを調整
    • Appearanceで色を設定
    • Dimensionsでサイズを設定
  • 調整が完了したら"Finish & Grab Code"をクリック
  • テキストエディト欄に表示されているHTMLコードをコピーして、自分のページにペースト

出力サンプル


HTMLソース

その他、サードパーティー製