2005年12月05日(月) コメント:6 トラックバック:1
前回の続き。
- ドロップダウン(プルダウン)メニューの長所・短所を考えると、月別アーカイブをドロップダウンメニューにするのはいいアイデアかもしれない。
- ただし、ページ移動をJavaScriptに依存するのはよくない。
以上2点を踏まえて、月別アーカイブをJavaScriptを使わないドロップダウンメニューにするカスタマイズです。
- CGIを使いましょう
- プルダウンメニューの隣に[GO]や[JUMP]や[移動]などといったボタンを置いておき、ボタンがクリックされると、選択項目に該当するURLがCGIに渡るようにしておきます。そうすれば、JavaScriptをOFFにしているユーザでも、プルダウンメニューを使って移動することができます。
しかし、FC2ブログではCGIをアップロードできません。ではどうするかというと……。ヒントはブログ内検索にありました。
- ブログ内検索のHTML
-
<form action="./" method="get"> <p> <input name="q" size="15" value="検索語を入力して下さい" type="text" /> <input value="検索" type="submit" /> </p> </form>
name属性の値がqであるinput要素のvalueの値を送信すると、「?q=検索語」というクエリー文字列のついたURLの検索画面になります。
われわれ(誰?)は、かつて、月別アーカイブ画面のURLが現在の「blog-date-YYYYMM.html」ではなく、「?date=YYYYMM」だったことを知っています。そしてこのURLは現在でも有効です。
つまり、name属性にdateを、value属性にYYYYMMを使えば、月別アーカイブ画面に移行できるのでは?というわけです。
- 月別アーカイブのドロップダウンメニュー
-
<form action="./" method="get"> <p> <select name="date"> <!--archive--> <option value="<%archive_year><%archive_month>"><%archive_year>-<%archive_month>(<%archive_count>)</option> <!--/archive--> </select> <input type="submit" value="Go" /> </p> </form>
このように、name属性の値を「date」にして、「年月」とともに送信してやれば、その月の月別アーカイブ画面を返してくれるようです。 ただし、当然、URLはblog-date-YYYYMM.htmlではなく、?date=YYYYMM形式になります。
ページ移動するにはボタンを押さなければなりませんが、それが嫌なら JavaScriptが有効な環境ではボタンが必要でなくなるように、JavaScriptを使って書き換えてやればいいでしょう(誰かが作ってくれそうです)。
同様に、name属性を「cat」にしてカテゴリ番号を送信すれば、カテゴリ別アーカイブのドロップダウンメニュー化もできると思いますが、 残念ながらカテゴリ番号を取得する変数は今のところ用意されていません。まぁ、ドロップダウンメニューとの相性を考えれば、月別アーカイブだけで充分でしょう。
改題。
コメント(6件)
はじめまして。すばらしいアイディアだと思います。
早速パクらせていただきましたm(_ _)m
JavaScriptで選択後即ジャンプは「勝手に飛ぶのが、かえって使いにくい」と言っていた人を見たことがあるので、今のところ導入する予定はないですね。
面白そうだとは思いますけど。
おそれいりました。 「素晴らしい」 の一言です。
確かに行けますね。 ボタンは簡単に隠せました。
「件数」を蹴れば カテゴリリストは自作できますね
( ナビリストにカテゴリ番号や記事番号の変数があれば・・ )
BNJさん、はじめまして。
>JavaScriptで選択後即ジャンプは「勝手に飛ぶのが、かえって使いにくい」
自分もかえって使いにくい派だったりします。「CSS切り替え」なら選択後即切り替えでもいいんですけど。なんとなく。
danielさん
>ボタンは簡単に隠せました。
ボタンはやはりnoscriptを使うのが簡単ですね。noscriptの効果的な使い方だと思います。
カテゴリや最近の記事はドロップダウン化するとかえって使い勝手が悪くなりそうですが、カテゴリ番号の変数はあるといろいろと便利だと思います。
はじめまして。
FCafeさん経由で知り、早速勝手に実装させていただいております。
JavaScriptオフでの動作も問題無いことを確認し、ちょびっと感動しております。
解説ではあっさりと書いていますが、実際に動作させるまでにいろいろと試行錯誤していたので、成功したときには自分でもちょびっと感動しました。
スゴイです。
それにしても二年前の記事なんですね。俺にはタイムリーな記事でした。