→最新版の「RSS購読ボタンの整理」記事はこちら
少し遅れてしまいましたが、新年、明けましておめでとうございます。更新がまばらですが、今年もpxblogを宜しくお願いいたします。
心機一転、リニューアルしてみました。
ヘッダーだけでなく、サイド→のナビゲーションとか、ちまちまカスタマイズしてみたんですが、中でも大きな変化は、RSS購読ボタンを１つにまとめたことですかね。
どのRSS Readerが一番人気なのか分からないし、一番人気…とかよりも、このブログを読んでくれてる人で、RSSリーダーを利用するとしたらどこを使うかは、全然予測不可だったので、とりあえず見たことあるのを全部盛り込んでみました。
良かったら、みなさんのブログのカスタマイズの際にも参照ください。
（ついでに、どっかミスっていたら教えてもらえると嬉しいです…）
すみません、ソースが長すぎて猛烈にブログレイアウトが崩れてしまうので、極力小さい文字掲載にしてみました。メモ帳とかにコピペして眺めてみてください。
■HTML
使うときに変更するところは、
■CSS
私のブログでは、ナビゲーションの幅が170pxくらい？で結構狭いので、selectの文字のサイズを9pxにしています。verdanaフォントなら読めるし、なんとかきちきち入ります。
Listmeっていうボタンの言葉をもっと短くしても、狭いところでも入ると思うし、後はお任せです。白とグレーの縞々装飾は、optionにクラスつけたら出来ますし。
果たしてどのくらいListmeボタンを押してくれる人がいるか楽しみです（汗）
■HTML
<!-- ListMe -->
<div id="Listme-form">
<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('http://ブログのＵＲＬが入ります/') + '&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('http://ブログのＵＲＬが入ります/')+'&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?http://ブログのＵＲＬが入ります/">はてなアンテナ</option>
<option value="http://r.hatena.ne.jp/append/http://ＲＳＳのＵＲＬが入ります">はてなRSS</option>
<option value="javascript:void(window.location='http://b.hatena.ne.jp/add?mode=confirm&title='+escape('ブログのタイトルが入ります')+'&url='+escape('http://ブログのＵＲＬが入ります/'));">はてなブックマーク</option>
<option value="http://www.bloglines.com/sub/http://ＲＳＳのＵＲＬが入ります">Bloglines</option>
<option value="http://reader.livedoor.com/subscribe/http://ＲＳＳのＵＲＬが入ります">LivedoorReader</option>
<option value="http://e.my.yahoo.co.jp/config/jp_promo_content?.module=jp_rss&.url=http://ＲＳＳのＵＲＬが入ります">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>
<option value="http://feedpath.jp/feedreader/feeds_add?url=http://ＲＳＳのＵＲＬが入ります">feedpath</option>
<option value="http://paipo.jp/bookmarklet/?url=http://ＲＳＳのＵＲＬが入ります">PAIPO READER</option>
<option value="http://www.newsgator.com/ngs/subscriber/subext.aspx?url=http://ＲＳＳのＵＲＬが入ります">NewsGator Online</option>
<option value="http://www.rojo.com/add-subscription?resource=http://ＲＳＳのＵＲＬが入ります">Rojo</option>
<option value="http://www.newsburst.com/Source/?add=http://ＲＳＳのＵＲＬが入ります">Newsburst</option>
<option value="http://fusion.google.com/add?feedurl=http://ＲＳＳのＵＲＬが入ります">google</option>
<option value="http://reader.goo.ne.jp/web/bookmarklet.html?,,http://ＲＳＳのＵＲＬが入ります">goo</option>
</select>
<input value="Listme" type="button" onclick="location.href=list.options[list.selectedIndex].value" class="listme_sub" />
</form>
</div>
<!-- /ListMe -->
使うときに変更するところは、
- http://ブログのＵＲＬが入ります/
- ブログのタイトルが入ります
- http://ＲＳＳのＵＲＬが入ります
■CSS
/* ListMeメニュー */
#Listme-form {
}
select.listme {
font-size: 10px;
color: #666;
background: #fff;
font-family: Verdana, "Osaka","ヒラギノ角ゴ Pro W3","Hiragino Kaku GothicPro","ＭＳ Ｐゴシック","sans-serif";
}
input.listme_sub {/* ListMe登録ボタン */
font-size: 10px;
font-weight: bold;
color: #FFFFFF;
background-color: #898989;
border: none;
}
/* /ListMeメニュー */
私のブログでは、ナビゲーションの幅が170pxくらい？で結構狭いので、selectの文字のサイズを9pxにしています。verdanaフォントなら読めるし、なんとかきちきち入ります。
Listmeっていうボタンの言葉をもっと短くしても、狭いところでも入ると思うし、後はお任せです。白とグレーの縞々装飾は、optionにクラスつけたら出来ますし。
果たしてどのくらいListmeボタンを押してくれる人がいるか楽しみです（汗）
Comments