2007年06月07日

サイドバーコンテンツの折り畳み


前からやりたいなと思ってたんですが、
サイドバーのタグリストなどがどんどん長くなっちゃって、
スクロールするのが面倒だったので、
とうとう重い腰を上げてスクリプトに挑戦しました。

元になったスクリプトはこちらからリンクアイコンいただきましたが、
ずぶの素人にはどうしたらいいかわかりにくい部分もあり、
その辺はこちらの記事リンクアイコンから助けていただきました。

ジャバスクリプト形式のファイルを扱えるソフトも、
上記サイトで紹介されているのだと、なぜか私のところでは
.js形式が選択肢になくて、.javaだけで、それでは当然機能せず、
結局このEmEditorリンクアイコンを利用しました。

さて、それでもボタンのデザインがなぜか反映されず、
結局もとのKOROPPYさんのこちらの記事リンクアイコンを参照して
ようやく解決。
それでもまだトップページではちゃんと表示されるのに、
他が変わらない〜〜、というところで馬鹿みたいに悩んでしまいましたが、
最近CSSがトップページと他のページ、別々に設定していたことを思い出し、
それも解決。

というわけで、アクセスするにはまた少し重くなってしまったかも……。
でもおかげですっきりしたので、私は満足してます(笑。
「最近のトラックバック」はひとつもないので、
何も隠すことはないんですが、だからってこれだけさらしておくのも
バランス悪いかなと思って、同様の処理を施しました。
まあ増えることももしかしてあるかもしんないし……。

あと、カテゴリのところも、年が明けたら長くなっていくので、
それは別の方法で対処しようと思ってますが、
まあまだ余裕あるので、それは来年やります(こら、鬼、笑うな)。

あ、それと、雑談掲示板へのリンクも、
トップからしかないのは不便だなと思ったので、
サイドバーに組み込みました。
記事を読んでいてふと思い立った話題など書き込みたいときは
そこから直接飛べますしね。

あ〜、さらに、カスタマイズのブログをさまよっていたら、
ファビコンのつけ方も偶然見かけたので、ついでに入れてみました。
URLの左に出るアイコンのことです。
メキシコユニのアイコンはこちらからリンクアイコンいただきました。




この記事へのコメント
自分用の覚え書きですが。
IEとファイアフォックスを仔細に見比べていて、
サイドタイトルの高さが微妙に違うことを発見。
タイトルバックには画像を入れているわけだが、
ファイアフォックスだと下に少し(1mmほど)隙間ができる。
そこは目立たないバックグラウンドカラーでごまかしていたんだが、
IEだとそれがなくて画像にぴったり。
それで思いついて、サイドタイトルの高さを固定してみた。
そしたら、歯抜け現象はなくなった(よね?)。

ただ、カテゴリのフィールドがタグリストのタイトルに吸い付いてしまうのはまだそのまま。
タイトルの上にマージンを入れると今度は全部バラバラになるしな。
タグリストのタイトルだけclassを別にすると折り畳みスクリプトが利かなくなる。
フィールドのボトムマージンは指定してあるのに、それが利いていない様子。
でもまあカテゴリ欄もいずれ長くなるので、いじれば直るかも知れない。

カテゴリを短く見せる処置のアイディアはふたつ。
1.サイドにスクロールバーをつけて、最新の年の分だけ見える高さに設定する。
2.カテゴリコンテンツをふたつ作って、一方には過去カテゴリだけ表示(もちろん折り畳む)、もうひとつには最新年の分だけ表示。

2のほうがすっきりしそうだけど、二重にカテゴリを取り込むので、見た目はそうでもないけど実はサーバー的に無駄というのと、
表示しないカテゴリは手書きで指定するので面倒かも。まあ年に一度のことだけど。
追記  2007年06月08日 06:19
む。
スクロールバーをつけるのは簡単だから、物の試し、
とやってみたら、早くも頓挫。
ツリー表示のスクリプトと両立しない様子。

特定のカテゴリを表示しない、というのには
プラグインがネット上にある模様。
でも結局どのカテゴリかは一個ずつ手書きだよな。
だったら直接コンテンツのHTMLに書くほうが簡単かも。
追記  2007年06月08日 06:43
むむ。
折り畳みとツリー化も両立しない。
ツリー化のスクリプトを折り畳みスクリプトに組み込めばいいのかもしれないが……。
ひとまず頓挫。
追記  2007年06月08日 07:14
むむむ。
IEでファビコンが表示されるためには
拡張子.icoでないとダメ、という記述を発見したので、
そうして入れ替えてみたけど、やっぱりダメぢゃん。
追記  2007年06月08日 09:00
IEでのファビコン、ついに成功〜。
http://q.hatena.ne.jp/1133217127
こちらで同じことを質問してる人がいて、
3番目の回答者がすごく詳しい〜。
しかしこの人が推薦しているソフトをDLしても、元アイコンがGIFなのでうまく行かなかった。
そこで、こちらを利用してみた。
http://favicon.webmeister-jp.com/
ネット上で、GIFやその他の形式のアイコンを.icoに変換してくれる。
で、名前も勝手に付けずにそのままのfavicon.icoで保存、アップロード。
半信半疑でHTML書き直してIEで開くと……。
で〜け〜た〜!

めでたい。
追記  2007年06月08日 09:42
http://aiko0129.seesaa.net/article/4428055.html
こちらを参考にしてスクリプトの合体。
ツリー化と折り畳みがめでたく両立。
今のところカテゴリは折り畳まなくていいんだけど、
来年役に立ちそうだから、そのままにしておく。
追記  2007年06月13日 07:33
また自分用の覚書なんだけど。

今日は、カテゴリのツリー化と折りたたみスクリプトの合体して、
うまく行ったのでカテゴリコンテンツをふたつに増やし、
ひとつは折りたたみ、もうひとつはそのまま。
ツリー化は両方。
そしてさらについでに、そのふたつのカテゴリ一覧に表示するカテゴリを仕分けた。
これで来年も大丈夫、と思って、ふと気がついたら、
各カテゴリの記事数が出なくなってる……。

カテゴリコンテンツをふたつに増やしたせいかと思って、
片方削ってみても同じ。
ツリー化スクリプトがダブってるからかと、元のHTMLに戻しても同じ。
非表示カテゴリを大量に入れたせいかと思ってそれも戻してみたが同じ。

となると、折りたたみスクリプトのせいとしか思えないんだが、
参考にしたサイトなんかだとちゃんと記事数も(折りたたんでツリー化して)表示できてるんだよねえ。
どこがおかしいんだろう。
まあ記事数なくても困らないけど、原因がわからないと気持ち悪い。
カテゴリのHTMLにはちゃんと記事数表示するように書かれてるんだから。

でも折りたたみスクリプトを削除してみたけど、やっぱり変わらんかった。
あと考えられるのは、折りたたみスクリプトをもともとは
jsファイルとしてアップしてそこからジャバスクリプトにしてたんだけど、
今回HTMLに直接ジャバスクリプト書き込んだ(でもコピペしただけなんだけど)、
それが何かで引っかかってるのかなあ?
ファイル自体はまだアップしたまま残してるけど、そのファイルへスクリプトつないだコンテンツは削除しちゃったよ。

とにかく、以上、実験して消去した可能性だけは列挙しておく。

あと、ホントはカテゴリのツリー化も二段じゃなくて三段にしたいんだけど、
MTならもともとサブカテゴリってのがあって、割と楽にできるみたいなんだけど、
今はそこまで手が回らないので、またいつか。
追記  2007年06月13日 13:08
http://aiko0129.seesaa.net/article/4559980.html

さらについでに、これもやりました。
カテゴリ・過去ページに、記事本文無しでタイトルだけ表示。
ついでに、投稿者の名前はいつも同じだから削除して、
postedを右寄せに。
追記  2007年06月13日 13:44
はじめまして。参考にさせてもらいました!
私は”アセラ”という所でペットブログをしています。(seesaaと基本システムが同じ?)
いろいろ見つけたものの、スクリプト、、、.jsや.javaがどうの・・・ってのが全く分からずで、この記事はとっても参考になりました。
ありがとうございます!
Dood-lee-doo  2007年08月16日 13:52
>Dood-lee-dooさん
はじめまして。コメントありがとうございます。
私も何もわからず手探り状態であれこれいじってます。
ネットのいろんなところから助けていただいてます。
こんな寄せ集め記事でも、お役に立てたのでしたら幸いです。

そちらも見せていただきました。
大型犬を飼っておられるんですね!
うちにもでかいのがおります。
ワンちゃんとの生活&ブログライフ、楽しんでください。
 2007年08月16日 22:17
カテゴリのところに記事数が出ないの、やっぱりちょっと不便だよなあと思って、
タグリストみたいにポップアップで出るのでもいいんだけど、といじってみる。
でもタグとカテゴリでは同じにならないらしくてダメ。

で、不本意ではあるのですが、
カテゴリの記事数をリンク範囲内に入れてみたら、
あら不思議、てかスクリプトがきっとそうなってるんだろうな、
ツリーになってもちゃんと表示されるようになりました。
もともとはこういうデザインで、でも記事数にリンクがかかってるってのは
合理的じゃない気がして外してて、前はそれでも行けてたのにな……。
でもまあこの際それは瑣末事ってことで無視して。

一応最後の問題もこれで解決。
追記  2007年08月23日 22:47
コメントを書く
お名前: [必須入力]

メールアドレス:

ホームページアドレス:

コメント: [必須入力]

認証コード: [必須入力]


※画像の中の文字を半角で入力してください。
この記事へのトラックバックURL
http://blog.seesaa.jp/tb/44077943
※言及リンクのないトラックバックは受信されません。

この記事へのトラックバック
×

この広告は1年以上新しい記事の投稿がないブログに表示されております。