Movable Type
月別カテゴリーの部分をプルダウンメニュー化。
「NagaBLOG」がスタートして半年が過ぎましたが、月別カテゴリーの部分が、長くなってきたので、省スペース化ということで、プルダウンメニューしました。
カテゴリーの部分もプルダウンメニュー化しようと思ったんですが、利便性を考えたら今の状態の方が使いやすいですし、最初に作った時から1、2項目しか増えてないし、今後もあんまり増やさないだろうから、スッパリやめました。
最初、何もないところから作ってみたんですが、知識不足か設定がうまくいかなかったので、検索してみることに。
やっぱり、blog関連ですね。「hwp Blog」さんのエントリーに行き着きました。リストまで掲載してくれていたので大助かりです。そのままテキストをちょっと変更して使わせていただくことにしました。感謝感謝です。
とりあえず、忘れそうなので、手順を書いておくことにします。「hwp Blog」さんのリストを元に「NagaBLOG」用にカスタマイズしています。カテゴリーのも欲しい人は、「hwp Blog」さんのエントリーを見てください。
まず<head>〜</head>間に下記を追加。
<script language="javascript" type="text/javascript"> function MM_jumpMenu(targ,selObj,restore){ //v3.0 eval(targ+".location='"+selObj.options[selObj.selectedIndex].value+"'"); if (restore) selObj.selectedIndex=0; } </script>
そしてプルダウンメニューを挿入したい場所に下記を追加。
<form name="pulldown_monthlyarchives"> <select name="menu" onChange="MM_jumpMenu('parent',this,0)"> <option value=" http://naganaga.daa.jp/" selected>【月別アーカイブ】 </option> <MTArchiveList archive_type="Monthly"> <option value="<$MTArchiveLink$>"> ● <$MTArchiveTitle$></option></MTArchiveList> </select> </form>
そしてスタイルシートに下記を追加。
form { margin:0px; } select { width:100%; }
本来、CSSのselectの部分にはfont-family: "Osaka", "ヒラギノ角ゴ Pro W3", "MS P ゴシック", sans-serif;という1行が入るのですが、「NagaBLOG」の場合は、最初のbodyで定義してあるので省略しました。
これで、左のサイドバーがズルズルと長くなってしまうのを防げました。ただ、急造したのでJavaScriptの合併が出来ない箇所や、書き込む位置が悪かったりしているので、要修正かな。
とりあえず、これで「NagaBLOG」は完成しました。しばらく時間をおいたら、デザインを変えよう。
コメント [2]
この度はどうもです。
ウチのようなネタであれば、どんどん使って下さい。
皆さんの使い勝手が上がればブログも発展して行くでしょうし。
Macネタとか興味ある部分が多いんで、また来てみますね。
>hwpさん
けっこう、テンプレート作成の時の小ネタって重宝するんですよね。「自分はこう改造しました。」ってエントリーは、作り終えると無駄そうに見えるけど、まだの人にとっては実は使えるモノがなんですよ。blogの発展のためにメモとして残しているのです。(たいそうなモノではないですが)
こちらも、hwpさんのサイト、ちょくちょく覗かせてもらいます。