プルダウン式「ListMe!」の導入 : Project MultiBurst

Category : [ MovableType, アクセスアップ, インターネット ]
December 16, 2005 17:19
TAG : [BlogPeople,Bookmark,Customize,Javascript,MovableType,RSS,Template,UTF-8,Yahoo!]
Permalink

先日、Myblog Japan、MyblogList、MyClipが統合し、ドリコムRSSに移行しました。

ということで、早速MyblogListのタグを入れ替えました。

が、新しいドリコムRSSに、「ListMe!」という設定項目がない。。。
（私が見落としてるだけ？？）

で、ググっていたら、こんなカスタマイズを見つけた。

プルダウン式「ListMe!」

参考URL

blog*citron | プルダウン式ListMe！ver1.2

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

とのこと。

で、

↓最終的にこうなるわけです。

以下の文を、テンプレートに追加するだけでいいのが便利だ。

私の場合、PHPのモジュール化して、各ページに配置している。

<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&u=' + escape('★ブログのURL★') + '&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★')+'&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&title='+escape('★サイト名★')+'&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&.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>

スタイルシート（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; /* フォント指定 */ }

以上で、設置完了（＾＾；）

簡単だ～～

で、ついでに、

「ドリコムRSS」のBlogListにスクロールバーを付ける

というカスタマイズもつけました。

参考URL

小粋空間: ドリコムRSSのBlogListにスクロールバーをつける

おなじみ、小粋空間さんのカスタマイズである。

「ドリコムRSS」の部分に赤文字の部分を追加。

<div id="bloglist"> <script language="javascript" src="http://list.blog.rss.drecom.jp/xxxxx/" charset="UTF-8"></script> </div> <script type="text/javascript">  </script>

スタイルシート（CSS）

.drecomrss-main { overflow: auto; height: 200px; }

.drecomrss-powered-by {
margin-top: 10px;
margin-bottom: 0px;
}

.drecomrss-listMe {
margin-top: 0px;
}

これで完成です！！