Twetterをホームページに一行だけ表示する方法
みなさんこんにちわ。
本日は、仕事メモを立て続けにリリースします。
タイトルを「Twetterをホームページに一行だけ表示する方法」と題したのですが、
ツイッターを、ホームページの左右のカラムなどに、ガジェットとして表示するのではなく、Twitterを簡単なNwes速報の様に、一行だけ表示できないかと相談を受けて対応したときのメモです。
でどうやったかというと、、、
1、まずこちらをダウンロード・・・↓
・1l_twetter_sample.zip
1l_twitter_sample というフォルダが出来ると思います。
中には次のようになってます。
・index.html
・js（フォルダ）
L ・top.js
L ・twitter.js
なお、よってそのまま index.html をクリックするとサンプル動作します。
2、次にTwitterアカウント変更します
・ファイル top.js の11行目…
――――――――――――――――――――――――――――
var user = "anli_d"; // ここを自分のユーザ名に変えてください
――――――――――――――――――――――――――――
anli_dの場所をあなたTwitterユーザー名に変更。
・さらに、68行目の途中に…
――――――――――――――――――――――――――――
<a href="http://twitter.com/anli_d" target="_blank">
――――――――――――――――――――――――――――
anli_dも、あなたTwitterユーザー名に変更。
3、最後にtwitterを表示したい場所に次のHTMLを書いてください
――――――――――――――――――――――――――――
<div id="twitter">
<script type="text/javascript" src="js/top.js"></script>
<script type="text/javascript" src="js/twitter.js"></script>
</div>
――――――――――――――――――――――――――――
4、では、動作確認です。
・「htmlファイル」と、「JSファイルをフォルダごと」アップロードします。
・その後「htmlファイル」にアクセスしてみる。
どうでしょうか動きましたでしょうか。
本当はもっと違う記述の仕方があるかもしれないのですが、
今のとここんな感じです。
なお、参考にしたサイトはこちら様です↓
↓ ↓ ↓
・twitterの埋め込み方法 >>
こちらのホームページ中にありました「twitter.js」をDL・・・
ダウンロードした「twitter.js」を一部書き直したという次第でございます。
なので内容はほとんど一緒です。ホントに参考になりました。
ありがとうございます(*^▽^*)
追伸：：：
●そういえば、スクロール(マーキー)的な動きのサイトもあるようです。↓
・Houyhnhnm（フイナム）さん >> TOP上部 （2011.3.17現在）
●また、これは直接接続されていないようですが好きな動きです↓
・EC CUBE様のホームページさん >> TOP上部 （2011.3.17現在）
いずれ、新たに需要があったら対応してみたいと思います。
なお、私もこの度の震災の速報をツイッターで確認したりしています。
例えば、そういった速報をホームページの片隅に、設置してみるものいいかもしれないかなと思い、この記事を書いてみました。
ちなみに、当アメブロ上にも右カラムツイッターの下に
「東北地方太平洋沖地震BOX」を設置してみました。
こちらは、ブロックスCMS様作成のプラグイン。
公開されていたソースをそのまま利用しました。
サイズが合ってないですが、情報が重要なわけで、そのまま稼働させてます＾。＾
以上、本日の仕事メモ「ツイッターを一行で表示してみる♪」でしたが
みなさん、いかがお過ごしでしょうか。
日本の一日も早い再興を今日も心から祈念しています。
つづく・・・
本日は、仕事メモを立て続けにリリースします。
タイトルを「Twetterをホームページに一行だけ表示する方法」と題したのですが、
ツイッターを、ホームページの左右のカラムなどに、ガジェットとして表示するのではなく、Twitterを簡単なNwes速報の様に、一行だけ表示できないかと相談を受けて対応したときのメモです。
でどうやったかというと、、、
1、まずこちらをダウンロード・・・↓
・1l_twetter_sample.zip
1l_twitter_sample というフォルダが出来ると思います。
中には次のようになってます。
・index.html
・js（フォルダ）
L ・top.js
L ・twitter.js
なお、よってそのまま index.html をクリックするとサンプル動作します。
2、次にTwitterアカウント変更します
・ファイル top.js の11行目…
――――――――――――――――――――――――――――
var user = "anli_d"; // ここを自分のユーザ名に変えてください
――――――――――――――――――――――――――――
anli_dの場所をあなたTwitterユーザー名に変更。
・さらに、68行目の途中に…
――――――――――――――――――――――――――――
<a href="http://twitter.com/anli_d" target="_blank">
――――――――――――――――――――――――――――
anli_dも、あなたTwitterユーザー名に変更。
3、最後にtwitterを表示したい場所に次のHTMLを書いてください
――――――――――――――――――――――――――――
<div id="twitter">
<script type="text/javascript" src="js/top.js"></script>
<script type="text/javascript" src="js/twitter.js"></script>
</div>
――――――――――――――――――――――――――――
4、では、動作確認です。
・「htmlファイル」と、「JSファイルをフォルダごと」アップロードします。
・その後「htmlファイル」にアクセスしてみる。
どうでしょうか動きましたでしょうか。
本当はもっと違う記述の仕方があるかもしれないのですが、
今のとここんな感じです。
なお、参考にしたサイトはこちら様です↓
↓ ↓ ↓
・twitterの埋め込み方法 >>
こちらのホームページ中にありました「twitter.js」をDL・・・
ダウンロードした「twitter.js」を一部書き直したという次第でございます。
なので内容はほとんど一緒です。ホントに参考になりました。
ありがとうございます(*^▽^*)
追伸：：：
●そういえば、スクロール(マーキー)的な動きのサイトもあるようです。↓
・Houyhnhnm（フイナム）さん >> TOP上部 （2011.3.17現在）
●また、これは直接接続されていないようですが好きな動きです↓
・EC CUBE様のホームページさん >> TOP上部 （2011.3.17現在）
いずれ、新たに需要があったら対応してみたいと思います。
なお、私もこの度の震災の速報をツイッターで確認したりしています。
例えば、そういった速報をホームページの片隅に、設置してみるものいいかもしれないかなと思い、この記事を書いてみました。
ちなみに、当アメブロ上にも右カラムツイッターの下に
「東北地方太平洋沖地震BOX」を設置してみました。
こちらは、ブロックスCMS様作成のプラグイン。
公開されていたソースをそのまま利用しました。
サイズが合ってないですが、情報が重要なわけで、そのまま稼働させてます＾。＾
以上、本日の仕事メモ「ツイッターを一行で表示してみる♪」でしたが
みなさん、いかがお過ごしでしょうか。
日本の一日も早い再興を今日も心から祈念しています。
つづく・・・