★スクロールバー表示

プラグインにスクロールバーを表示するのをやってみたかったんです。
ただ、大して記事も書いて無いし、スクロールバーなんて表示するほどの何者もないのが現状でして・・・。
それでも、先日はてなアンテナのプラグイン表示設定をした折に、「ここには使えるかも」と思い立ってやってみることにしました。


★スクロールバーの設定★

[目標] スクロールバーをプラグインコンテンツ内に表示する。
[難易度感] 思ったよりあっさり。

・忍ブログ利用でのスクロールバー表示のサイトを検索。今回利用させて頂いたのはカスタマイズin忍者ブログさんです。
・単なるスクロールバーを表示するだけではなく、表示のON/OFF切り替えができるという優れモノです。

<script type="text/javascript">
<!--
size = 1;
sizeHeight = new Array("100%","200px");
function scrollbox(c) {
boxID = document.getElementById('scrollbarbox'+c)
size = ( size == 1) ? 0 : 1;
boxID.style.height = sizeHeight[size];
}
//-->
</script>

・上記の部分のjavascriptを説明にあるとおり貼り込みます。貼り込む場所はテンプレートHTMLでもプラグインHTMLでも良いそうです。あたしはプラグインHTMLに貼り込みました。
・判りやすくオレンジ表記になっている所が、スクロールバーを表示する長さ（ボックスの高さ）。これは自分の好みに合わせて変更します。

<div id="scrollbarbox1" style="height: 200px; overflow:auto;">
--スクロールバーが表示される中身の部分--
--（あたしの場合は、はてなアンテナ）--
</div>

・スクロールバーを表示させる部分に上記の部分を貼り込みます。
・あたしの場合は、どちらも同じプラグインHTMLの中での設定となりました。さらにこの中にはてなアンテナの設定があるので、もうごちゃごちゃです。
・オレンジの200pxのところは、最初のスクリプトと同じ値にするとのこと。ふむふむ・・・。
・プラグイン表示させるのに左右の幅と色を自分のブログのもの用に設定して設置完了。
・あっ、忘れてた。スクロールバーのON/OFF切り替えようのスイッチを下記のように設定。場所はどこでもいいらしいです。

<a href="#scrollbarbox1" onclick="scrollbox(1)" title="スクロールバーの表示・非表示の切り替えをします">Scrollbar ONorOFF</a>

[感想]
・やってみるとあっさりできちゃった。すごいです、説明が完璧。あるふぁさん、ありがとう～。
・気を良くしたので、アンテナをいくつか追加設定。あとでアンテナ先に挨拶周りしておかないと・・・。

★カテゴリー：BlogNote開始

ブログって記事書くのは、なかなか思うようにいきませんけど、ブログ自体をカスタマイズしたり組み上げて行く作業は面白いですね～。
あたしみたいに、ほとんど素人な者でも少しは頭を働かせる余地があって、上手くいかないことも多いけれど、思うようにできた時は、もうそれこそ感激モノです。

忍ブログは、見た目のデザイン変更が容易で、割と細部に手を入れやすいのもいいですね。他のブログもいくつか試してみましたけど、忍ブログを選んで良かったなと思うことがしばしばです。
小さなテキスト広告とユーザーがカスタマイズしたテンプレートをアップして、他の人でも使用できる共有テンプレートのシステムは特に◎です。

色んな個性をもった人のテンプレートみるだけでも楽しいですし、そういう人のテンプレートの設定内容をみたりするのもいい勉強になります。
いつかは、自分独自のテンプレートも・・・、などと思ってしまうくらい。

さて、このBlogNoteというカテゴリーなんですけど、これは自分のためのメモ、備忘録ってところです。
今まで、いくつかカスタマイズをしてみましたけど、色んな資料を見て訳もわからずに無理矢理やったものが多いので、同じことをもう一度しようと思ったときに、なんだか無理っぽそう・・・ですしね（笑）


★はてなアンテナのプラグイン表示★

[目標] Hatenaのアンテナを忍ブログのプラグインに表示する。
[難易度感] 四苦八苦。

・Hatenaのユーザー登録、アンテナ設定。
・忍ブログ、プラグイン設定-フリーエリアにアンテナ用の場所を作成。
・RSS FeedをJavascriptでウェブページに表示 (ベータ版)にて表示させたい情報と表示方法を選択。
・生成されたコードを、プラグイン設定-フリーエリアに貼り込み。
・頂いてきたCSSファイルを、テンプレートHTML編集にて組み込み。デザインを自分の好みに編集。

[感想]
以前はりょーちさんというところのスクリプトを利用させて頂いていたのが突然表示不可に。色々調べてみたけど判らないので、同じようなスクリプトを検索。
「はてなアンテナ」で調べると「Bloglines」さんとの組み合わせ、「コトウユウキの（ぅ）ラブログ」さん、「PLAYNOTE.NET」さんなどの有力そうなの見つかりました。
「Bloglines」さんのは設定が豊富すぎで、どこをどう弄ればいいのか良くわからないので、途中で放棄＞＜
「コトウユウキの（ぅ）ラブログ」さんのは、設定したものの表示できず。どうやらPHPのmbstringが使える環境というのがネックっぽく断念。自分のサーバにスクリプトを置けるので、出来るのであればこれが一番なんですけどね。
「PLAYNOTE.NET」さんのところは、英語でどこから設定してよいか不安で中止。
結局、設定自体は大したことなかったのに比べ、情報検索にとっても時間を費やしました。
最終的には、「moondakota」さんのスクリプトを拝借しました。
そうそう、ひとつ覚えた事と言えば、自分のはてなアンテナのデータは、「http://a.hatena.ne.jp/あなたのID/source?mode=hina&k=」で取得が可能だということ。
　・LIRS形式：source?mode=lirs&k=
　・HINA-DI形式：source?mode=di&k=
　・HINA 形式：source?mode=hina&k=
ちなみに、舞子のアンテナをHINA形式で表示させるとこんな感じ。