当ブログでは現在、こちらを採用。
本来はMovable Typeなどのウェブログシステム用らしいですが、Seesaaでも通用します。
参照記事(有難うございます)
■ サイドメニューの折りたたみ（v4.0） [ 小粋空間 ]
※最新のカスタマイズ方法に『（v5.0）ゆっくり折りたたむ』という紹介記事がありますが、Seesaaで通用するかは謎。
時間がある時に試してみようかと思います。
1.menufolder.js ダウンロード
上記リンク記事内「１．menufolder.js ダウンロード」項にある『ダウンロード』テキストリンク先で『 menufolder.js 』をクリックし、同ファイル名でPCに保存。
2.menufolder.js の設定
エディタソフトでこのファイルを開き、必要項目の設定を行います。
折りたたみマークを表示する・しない場合それぞれの設定イメージが小粋空間さんの記事内にありますのでご参照下さい。
menufolder.js マニュアルも併せてどうぞ。
当ブログでは設定イメージそのままの「折りたたみマークを表示する」を選択しています。
3.指定が済んだら、文字コードをShift-JISにて保存（Seesaaの文字コード）。
4.ファイルマネージャーでこのjsファイルをアップロード。
5.デザイン＞HTMLで使用中のHTMLファイルを選択し、<head>〜</head>の間に、アップロードしたファイルのURLを指定して保存します。
例：
<script type="text/javascript" src="http://**.up.seesaa.net/***/menufolder.js"></script>
※ **…ご自分のブログアカウント、***…ファイルをアップロードしたフォルダ
6.スタイルシート追加
デザイン＞デザイン一覧 で使用中のデザインを開きます。
こちらも小粋空間さんの記事通りのcss設定を使わせて戴いておりますのでそちらからコピペ。
ご自分のブログデザインに合わせ、適宜変更して下さい。
尚、class 属性も任意の名称に変更可能だそうです。
7.コンテンツHTML修正
サイドメニューの開閉をしたいコンテンツのHTMLに下記のように追加・変更します。
「最新の記事」の例
<div class="sidetitle2" id="newentriesname">
<% content.title %></div>
<div class="side" id="newentrieslist">
<% content.header -%>
<% loop:list_article -%>
(<% article.createstamp | date_format("%m/%d") %>)<a href="<% article.page_url %>"><% article.subject | tag_break %></a><br />
<% /loop -%>
<% content.footer -%>
</div>
class="sidetitle2"
スタイルシート追加で指定したclass属性です。コンテンツタイトル部分のclass名を変えている場合は sidetitle2 部分を丸ごとご自分の指定したclass名に書き換えて下さい。
（開閉しないメニューと区別出来る名称に変更の事。）
id="newentriesname"
id="newentrieslist"
開閉したいコンテンツのタイトル部分と本文のDIVタグに固有のid属性を設定します。
タイトル部分には ***name を、本文には ***list を必ず指定の事。（***部分は任意の文字。コンテンツ毎に解りやすいid名を付けて保存して下さい。例えばカテゴリーリストは"category"、過去ログは"log"等）
8.コンテンツの設定に戻り、挿入テキスト(下部)にmenufolder.js の関数実行スクリプトを追加します。（※１）
<script type="text/javascript">
<!--
FoldNavigation('newentries','on',false);
//-->
</script>
コンテンツHTMLにてdiv属性にidを付加するのは、ここでidに対してスクリプト実行を指定する為です。
次の''内にはデフォルトの開閉状態を指定。開いておくなら on 、閉じておく場合は off とします。
最後の部分にはリスト数の表示を指定するようですが、今回はこの設定は使用しませんので false のままです。
※１ 自由形式コンテンツには「挿入テキスト(下部)」のフォームがありませんので、コンテンツHTMLにて <% content.footer -%> の次の行に追加します。
全ての工程でそれぞれ必ず保存して下さい。
設定が反映されないようでしたら、設定＞ブログ設定 で『最新の情報に更新』項目にある『実行』ボタンクリックにて再構築をかけてみましょう。
ダラダラと書き連ねましたが、実際のところ、小粋空間さんにて変更の仕方が全て解り易く解説されています。
そちらを読む方が早いと思います(爆)
  ブログの記事、ブログの話題 |
I know. に追加
