はじめまして。5月よりWEBデザイナーアシスタントとして入社致しました山田です。

今日はお仕事で活用したWebサイトやブログにつぶやきを表示する【twitter ウィジェット】について書いていこうと思います。

【1 】まずはWebサイトにアクセス
Twitterにログインしている状態で、ウィジェットを配布しているページへ移動。

Twitter / ウィジェット

↑ここから各種設定を行いウィジェットを作成。
MySpaceやFacebookに表示するためのウィジェットも紹介されていますが、
ここでは汎用的に使える「自分のサイト」をクリックします。

【2 】プロフィールウィジェットをクリック。

【3 】プロフィールウィジェットをカスタマイズする。
ここでウィジェットの設定を行います。
（1 ）Twitterユーザー名を入力
ここでは、前から気になってはいるけどなかなか勇気をだしてお店に入ることができずにいる会社一階にあるアクセサリーショップ『DAgDART』さんのつぶやきを設定してみたいと思います！

気になった人は足を運んでみてください☆.。.:*・゜☆.。.:*・゜

アクセサリーショップ『DAgDART』

（2 ）カスタマイズ
■カスタマイズ
●最新データを取得?
つぶやきを自動読み込みさせたい場合は「はい」をチェック。
●スクロールバーを表示?
表示が一定数を超えた際、スクロールバーを表示させたい場合は「はい」をチェック
●ツイートの表示方法
一定間隔でつぶやきを読み込みたい場合は「Timed Interval」を選択。そこで表示される「Loop results?」ではつぶやきをループして表示させるかどうか、「Tweet Interval?」では読み込みの秒数を指定します。適宜つぶやきを読み込みたい場合は「Load all tweets」を選択しましょう。
●表示するツイート数
つぶやきの表示数が設定できます。
●プロフィール画像を表示？
つぶやきにアイコンを表示させたい場合はチェック。
●投稿時刻を表示?
つぶやきに時間を表示させたい場合はチェック。
●ハッシュタグを表示?
ハッシュタグを表示させたい場合はチェック。
●表示するツイート数
つぶやきの表示数が設定できます。
●プロフィール画像を表示？
つぶやきにアイコンを表示させたい場合はチェック。

■デザイン
●外枠の背景、外枠の文字、ツイート投稿欄の背景、ツイートの文字、リンクの色がカラーコードで指定可能。カラーコードの右側にある四角の枠をクリックして色を選択することもできます。

■サイズ
●ウィジェットの大きさが指定できます。自動で幅を調整したい場合は「auto width」をチェックしましょう。
※ただし入力したサイズはウィジェットサイズはサイトに設置するまでプレビューされません。

設定を変更したら下段の［Test settings］ボタンを押せば右側にプレビューが表示されます。設定が完了したら［完了＆コード取得］ボタンをクリックしてください。

（3 ）コードを取得して張り付ける
画面にコードが表示されるので、コピーしてHTMLに貼り付ければ完了です。

やってみれば以外に簡単！興味を持たれた方は自分のブログにツイッターのつぶやきを表示してみてはいかがでしょう？アクセス数がぐっとあがるかも？？

サンプルは下記を参照ください。