最近、Twitterの魅力をうすうす感じつつあるひとぅですが(ようやくかい!)、「頭ん中」の増永さんの『「この記事にTwitterでコメント」ボタンをつけたよ』という記事にインスパイアされて、私のブログにもTwitterでコメントできるようにボタンを設置してみました。
記事のタイトル下にある「t」のアイコンをクリックすれば、その記事に対するコメントをTwitterで簡単にコメントできる、というものです。
私が使っているブログツールは「adiary」。以下に設置の方法をご紹介します。興味のある方は参考にしてくださいね。ちなみにこれまで、Twitterでブログの記事についてコメントをもらってことは増永さんと違って一度もありません(T_T)。グスン!
目次
■ adiaryに「この記事にTwitterでコメント」を設置する方法
- FTPソフトでサーバに接続します。「diary.user.skel」に「_main.html」がある場合はFTPソフトでダウンロードしてテキストエディタで開きます。
ない場合は、「diary.skel」から「_main.html」をFTPソフトでダウンロードしてテキストエディタで開きます。 - 90行目付近の
<@ifexec(s.disp_hatena_bicon, begin)><a href="http://b.hatena.ne.jp/entry/<@v.server_url><@t.this_diary_url>" class="bookmark-icon"><img src="http://d.hatena.ne.jp/images/b_entry_<@bc>.gif" alt="はてブ情報" width="16" height="12" class="icon" border="0"></a> <a href="http://b.hatena.ne.jp/append?<@v.server_url><@t.this_diary_url>" class="bookmark-icon"><img src="<@v.bookmark_icons>b_append_<@bc>.gif" alt="はてブに登録" width="16" height="12" border="0"></a> <a href="http://b.hatena.ne.jp/entry/<@v.server_url><@t.this_diary_url>" class="bookmark-count"><img src="https://b.hatena.ne.jp/entry/image/<@v.server_url><@t.this_diary_url>" alt="はてブ数" border="0"></a><$end>
の下に
<a href="http://twitter.com/home?status=@【自分のTwitter ID】%20(%20<@v.server_url><@t.this_diary_url>%20)" title="この記事にTwitterでコメント" rel="nofollow"><img src="<@v.bookmark_icons>twitter.gif" alt="t" /></a>
を挿入します。
- 「_main.html」を上書き保存し「diary.user.skel」ディレクトリ内にFTPソフトでアップロードします。
- 「diary.user.skel」に「_main_onelog.html」がある場合はFTPソフトでダウンロードしてテキストエディタで開きます。
ない場合は、「diary.skel」から「_main_onelog.html」をFTPソフトでダウンロードしてテキストエディタで開きます。 - 90行目付近の
<@ifexec(s.disp_hatena_bicon, begin)><a href="http://b.hatena.ne.jp/entry/<@v.server_url><@t.this_diary_url>" class="bookmark-icon"><img src="http://d.hatena.ne.jp/images/b_entry_<@bc>.gif" alt="はてブ情報" width="16" height="12" class="icon" border="0"></a> <a href="http://b.hatena.ne.jp/append?<@v.server_url><@t.this_diary_url>" class="bookmark-icon"><img src="<@v.bookmark_icons>b_append_<@bc>.gif" alt="はてブに登録" width="16" height="12" border="0"></a> <a href="http://b.hatena.ne.jp/entry/<@v.server_url><@t.this_diary_url>" class="bookmark-count"><img src="https://b.hatena.ne.jp/entry/image/<@v.server_url><@t.this_diary_url>" alt="はてブ数" border="0"></a><$end>
の下に
<a href="http://twitter.com/home?status=@【自分のTwitter ID】%20(%20<@v.server_url><@t.this_diary_url>%20)" title="この記事にTwitterでコメント" rel="nofollow"><img src="<@v.bookmark_icons>twitter.gif" alt="t" /></a>
を挿入します。
- 「_main.html」を上書き保存し「diary.user.skel」ディレクトリ内にFTPソフトでアップロードします。
- 「t」の画像ファイルを取得します。→「
」(アイコン上で右クリック→名前をつけて画像を保存でローカルに保存します。ファイル名は「twitter.gif」で。) - 「twitter.gif」をFTPソフトで「/public/b_icons/」に保存します。(はてブのアイコンが保存されているディレクトリに間借りします。)
以上で完了です。うまく上記画像のような「t」が表示されていますか?クリックしてみてTwitterに移動しコメントがあらかじめ入ってるか、確認してみてください。実際の動作はこの記事の「t」をクリックすれば確認できます。クリックしてみて早速コメントしてみましょう!!!(^_^;)。