■サイドバーの開閉スクリプト

　T-Back【開閉スクリプトを改良（Seesaaで超簡単設置）】by ものづくり本音ブログ＠若旦那
　
　あぁ、やっとできた。
　長くなる一方のサイドバーを、ボタンで開閉できるようになったよ。
　最初、またべぇの【■開閉スクリプト】を試したんだけどマウチの知識のなさで失敗におわり、
　かといって諦めきれずにいろいろ検索していたら、若旦那さんのところに辿り着き。
　しかもseesaa仕様！　ナイス！
　
　自分のためにも、以下スクリプト設置方法のメモ。
　seesaa限定な書き方にしちゃうけど、他でも似たやり方でできるはず。
　
　
　１．showhide.js のダウンロード
　　《showhide.js》のjavaScriptを入手。
　　　Macなら、ctrlを押しながらクリック“リンク先のファイルをダウンロード”で
　　　デスクトップなど判りやすいところに保存。
　　　おそらくWinも似た感じ？　右クリックで“リンク先を保存”かな。
　
　２．showhide.js の読み込み
　　　ファイルマネージャで、showhide.js を読み込む。
　　　今までファイルディレクトリが《image》しかない（画像にしか使ってない）なら
　　　アップロードする前に《＋その他入力項目》で《javascript》ディレクトリを作っておく。
　　　そうしないと失敗した体験談。
　
　３．スクリプトの組み込み
　　　管理画面の《デザイン→コンテンツ》で新しいコンテンツの追加。
　　　種類：自由形式　追加先ページ：全ページ　配置：右（もしくは左）サイドバー
　　　並び順は、サイドバーコンテンツの一番上にくるように設定。
　　　あとで判りやすいように《サイドバー開閉スクリプト》等の名前をつけておく。
　　　自由入力欄に

<script type="text/javascript" src="http://sketch-book.seesaa.net/javascript/
showhide.js"></script>

　　　を入力。
　　　赤い文字のところはsketch-bookの場合なので、
　　　先ほどアップした自分のファイルディレクトリを記入すること。
　
　４．開閉スクリプトを生かしたいサイドバーのカスタム
　　　ちょっと手間かもしれないけど、
　　　開閉スクリプトを読ませるコンテンツ毎にHTMLを書き換え。
　　　管理画面の《デザイン→コンテンツ→コンテンツ一覧から任意の箇所をクリック》。
　　　右端に《コンテンツHTML編集》があるので、そこで編集。
　　　例はsketch-bookのMyBlogList開閉の場合。

<div class="sidetitle">
<% content.title %>
<input type="checkbox" onClick="showHide('HideMyBlogList');">
</div>
<% content.header -%>
<div class="side">
<div class="sidehide" id="HideMyBlogList">
<% loop:list_link -%>
<a href="<% content_link.url %>" <% if:content_link.target %>target="_blank"<% /if %>><% content_link.title %></a><br />
<% /loop -%>
<% content.footer -%>
</div>
</div>

　　　赤い文字を書き足すだけ。3行目がチェックボックスの位置。
　　　コンテンツ名の前につけたいなら、2行目と3行目を入れ替え。
　　　下線部分の単語は、開閉させるコンテンツ毎に任意で変更。
　　　上下の単語が違うと動かないので注意。
　　　この作業を、開閉させたいコンテンツのHTMLで逐一行えば完了。
　
　
　若旦那さんがやってた、チェックボックス方式が気に入ったので
　マウチはそれにしちゃったけど、HTMLをいじらない方法もメモ。
　
　管理画面の《デザイン→コンテンツ→コンテンツ一覧から任意の箇所をクリック》で
　コンテンツタイトルの上下にテキストを挿入できる欄があるから、
　その上の欄に

<a href="javascript:void(0);" onClick="showHide('hide1');" title="クリックする毎に伸び縮みします">▼続きを見る⇔折りたたむ▲</a>
<div class="sidehide" id="hide1">

　下の欄に

</div>

　を書き込むだけでも開閉は可能（試してないけど）。
　
　
　こういうのを自分でちゃんと考えてやれるようになれたらいいんだけどなぁ。
　人のふんどしでsketch-bookは成り立っております。

Comments

お役に立てたようで嬉しい限りです。
しかも私よりも丁寧な説明で、ナイスフォロー(^｡^)

実はあのあと、最初からチェック付いてて、開いている状態ってのを実装しようと、改造をしていたんですが、なかなかいまく行きませんで(T_T)
挫折しております。
私も昔は出来るプログラマでブイブイ言わしてたんですが……。
10年も経つと、状況は一変するもんで、今ではさっぱりですよ(´ﾍ`;)

Posted by 若旦那 at 050819 on 15:21

■若旦那さん
そりゃもう大変助かりましたですよ！
感謝感激ヒデキ感激。

開いてる状態のができたら、是非教えてください（←ずうずうしい
それもあったらステキ度倍増ですよ。

Posted by march at 050820 on 00:30