サイドバーを折りたたむ方法(seesaaブログ)

カテゴリー別今日の人気ランキング
スポンサーリンク

はじめに

seesaa0.jpg

ブログを続けているとサイドバーにいろいろな項目が増えて、どんどん長くなってきます。

普段は折りたたんでおき、必要な度、開閉してもらうようにしておくと画面も見やすくスッキリします。

【設置手順】

  1. jsファイル(sidebarfold.js)を作成し、ファイルマネージャーでサーバーに転送
  2. sidebarfold.jsのリンク文をブログパーツ内に記述
  3. スタイルシート文末に「ボタンの色を開閉で変える」を追加

設置方法

jsファイル(sidebarfold.js)を作成し、ファイルマネージャーでサーバーに転送

  1. 下記の折りたたみスクリプト(sidebarfold.js)をコピーします。
  2. コピーしたスクリプトを、メモ帳などで jsファイル(名前 sidebarfold.js)として保存します。

    変更が必要な箇所は「/* 折りたたみ箇所指定 */」の部分のみです(スクリプト中の記述例は上記画像のようになります)。

  3. スクリプト中の/* 折りたたみ箇所指定 */で、折りたたみたいブログパーツ名と、開いておく場合は「true」、閉じておく場合は「false」をセットで指定します。

  4. 作成した sidebarfold.js を、ファイルマネージャーでサーバーに転送します。

sidebarfold.jsのリンク文をブログパーツ内に記述

  1. サイドバーの最下部に「自由形式」のブログパーツを新たに追加します。

    追加した場所より上の部分にしかスクリプトが効かないので、「seesaaロゴ」のブログパーツの後に追加するといいでしょう。

  2. 追加したブログパーツ内に、sidebarfold.js ファイルへの下記リンク文を記述します。

    ○○○○以下は上記手順4でアップロードしたsidebarfold.js ファイルのURLに変更します。また、文字コードは Shift-JIS で保存してるので、charset=”EUC-JP”は削除します。

  3. <script language=”JavaScript” type=”text/javascript” src=”http://○○○○.up.seesaa.net/image/sidebarfold.js”></script>

  4. 保存して完了です。

スタイルシート文末に下記「ボタンの色を開閉で変える」を追加

  1. デザイン → デザイン設定から使用中のスタイルシートを開き、文末に下記「ボタンの色を開閉で変える」を追加します。
  2. 保存して完了です。
スポンサーリンク
wp_レクタングル (大)
wp_レクタングル (大)
☆最後までお読みいただきましてありがとうございます。
☆この記事がお役に立ちましたらシェア・フォローしていただけると嬉しいです!

シェアする

フォローする