blog*citron

色々なListMeをつけるで、いろんなサービスへのListMeボタンの作り方を紹介しましたが、更にそれをプルダウン式にまとめてみました。いくつ増えても縦に長くならないし、その分サイドバーのスペースも空けられます(*´ー`*)
HTMLの編集ができればどのblogでもOKのコピペで使えるListMeセット。 BlogPeople、BlogPeopleTags、はてなアンテナ、はてなRSS、はてなブックマーク、Bloglines、Yahoo!RSS、ドリコムRSSの8種類に対応しています。

※MyBlogListは2005/12/12でリコムRSSへサービス統合。
2006/3月で完全停止。要コード変更。詳細はドリコムRSSにて。

サンプル： BlogPeople BlogPeopleTags はてなアンテナ はてなRSS はてなブックマーク Bloglines MyYahoo!RSS DrecomRSS

ver1.1 (2005.09.23)
・はてなRSSの登録URL変更に伴いソースを修整。
・はてなブックマークに対応。

ver1.2 (2005.12.14)
・ドリコムRSSにサービス統合されたMyBlogListを削除。 ・ドリコムRSSに対応。

HTMLの編集

プルダウンをつけたいところに下記のソースをコピペして下さい。
★ブログのURL★、★サイト名★、★RSSのURL★をそれぞれ自分のサイトに合わせたものに書き換えておきましょう。
不必要なものがあれば、その行の<option～から</option>までを削除。
※「'」や「;」など記号を消してしまわないように注意！

<!--ListMe_start--> <form action="./" name="topic" id="topic"> <select name="list" size="1" class="listme"> <option value="javascript:void(window.open('http://www.blogpeople.net/addlink.jsp?n=1&amp;u=' + escape('★ブログのURL★') + '&amp;ti='+escape('★サイト名★'),'blop','scrollbars=no,width=475,height=350,left=75,top=175,status=yes,resizable=yes'));">BlogPeople</option> <option value="javascript:void(window.open('http://tags.blogpeople.net/tags_addlink.jsp?u='+escape('★ブログのURL★')+'&amp;ti='+escape('★サイト名★'),'BlogPeopleTags','scrollbars=no,width=480,height=320,left=100,top=100,status=yes,resizable=yes'))">BlogPeopleTags</option> <option value="http://a.hatena.ne.jp/append?★ブログのURL★">はてなアンテナ</option> <option value="http://r.hatena.ne.jp/append/★RSSのURL★">はてなRSS</option> <option value="javascript:void(window.location='http://b.hatena.ne.jp/add?mode=confirm&amp;title='+escape('★サイト名★')+'&amp;url='+escape('★ブログのURL★'));">はてなブックマーク</option> <option value="http://www.bloglines.com/sub/★ブログのURL★">Bloglines</option> <option value="http://e.my.yahoo.co.jp/config/jp_promo_content?.module=jp_rss&amp;.url=★RSSのURL★">MyYahoo!RSS</option> <option value="javascript:void((function(){var w=window.open('http://rss.drecom.jp/shortcut/add_rss?url='+encodeURIComponent(location.href),'add_rss','scrollbars=yes,width=450,height=500,left=100,top=100,status=yes,resizable=yes');w.focus();})());">DrecomRSS</option> </select> <input value=" ListMe! " type="button" onclick="location.href=list.options[list.selectedIndex].value" class="listme_sub" /> </form> <!--ListMe_end-->

CSSの編集

CSSにはこちらをコピペ。（無くても動きます）
文字色や背景色などスタイルは自由に変更して下さい。

/* ListMeメニュー */
select.listme {
font-size:10px; /* 文字サイズ */
color:#666666; /* 文字カラー */
background:#fff; /* 背景色 */
font-family: "ヒラギノ角ゴ Pro W3","Hiragino Kaku GothicPro","Osaka","Verdana","ＭＳ Ｐゴシック","sans-serif"; /* フォント指定 */
}

/* ListMe登録ボタン */
input.listme_sub {
font-size:10px; /* 文字サイズ */
color:#fff; /* 文字カラー */
background:#808080; /* 背景色 */
border:none; /* ボーダー設定 */
font-family:Verdana,Arial,sans-serif; /* フォント指定 */
}

※日本語を含むフォームで英語フォントを優先指定すると、Macで文字化けするのでご注意。登録ボタンの方は「ListMe!」など英語だけなら英語フォントで大丈夫ですが、日本語を使う場合はselect.listmeと同じfont-family指定にして下さい。

ListMeのリンクはサイドバーの上に置かれることが多いと思うのですが、増えてくるとだんだん長くなります。 すると、エントリーやカテゴリーなど訪問者が最初に見ることの多いリストが、その分だけ下がってしまいます。
エントリーリストやカテゴリリストは、出来るだけスクロールをしない状態でも手が届く場所にあるといいなぁと個人的な好みから、何とか短くしちゃろうとプルダウンに押し込めることにしました（笑）
ListMeがあると「このブログいいな」と思った時にすぐ登録できるので、リピーターさんが集まりやすいんじゃないかなと思います＾＾