サイドメニューの折りたたみ(v5.0:ゆっくり折りたたむ)

サイドメニューの折りたたみ(v5.0:ゆっくり折りたたむ)

Posted at August 24,2005 11:56 PM
Tag:[Ajax, Customize, Folding, JavaScript, MovableType, SideMenu]

Google MapsGoogleサジェスト で一躍有名になった Ajax(Asynchronous JavaScript+XML:エイジャックス) ですが、Ajax用JavaScriptライブラリを利用してサイドメニューをゆっくり折りたためるようにしてみました。
公開テンプレートを用いたサンプルを作りましたので、実際の折りたたみ動作をご確認ください。固定3カラム・可変3カラムを右上のリンクで切り替えられるようにしています。

ゆっくり折りたたむサンプル

本カスタマイズで参考にさせていただいたのは下記のサイトです。ありがとうございました。

なお、本カスタマイズはサイドメニューの折りたたみ(v4.0)を前提にカスタマイズしていますので、新たにサイドメニューの折りたたみを導入される場合はサイドメニューの折りたたみ(v4.0)のカスタマイズを行ってください。
また折りたたみマークで折りたたむようにしている場合の動作は未確認ですので予めご容赦ください。

1.Ajax用JavaScriptライブラリのダウンロード

Scriptaculous のページへジャンプし(接続できない場合は2項へ進んでください)、上の方にある downloads というタブをクリックします。次ページの右側にある Archived Versions の1.1b1 の zip または tar.gz のリンクをクリックしてください。なお他のバージョンでは動作しませんのでご注意ください。
ダウンロードしたアーカイブを解凍し、src というディレクトリに

  • controls.js
  • effects.js
  • dragdrop.js

の3つのファイルがあることを確認してください。この中から controls.js と effects.js を使います。

次に、downloads タブをクリックした次のページの本文にある Prototype JavaScript library のリンクをクリックし、次のページの Just the .js, please というリンクをクリックして prototype-1.3.1.js をダウンロードします(バージョンは2005年8月24日現在)。保存する時、または保存後、ファイル名を

prototype.js

に修正してください。

2.Ajax用JavaScriptライブラリのダウンロード

(1項が×の場合)

1項で Scriptaculous に接続できない場合は、下記のページより取得してください。

Ruby on Rails/spinoffs/scriptaculous/

取得するのは下記の3ファイルです。

  • prototype.js
  • controls.js
  • effects.js

prototype.js は lib/ のリンクをクリックして、次のページの prototype.js をクリックします。次ページでソースが表示されますのでマウスコピーし、任意のエディタで新規ファイルを作り、そこにペーストして prototype.js というファイル名で保存します(コピーする範囲に注意してください)。文字コードはブログと同じ文字コードが無難です。
他の3ファイルは、最初のページに戻って src/ のリンクをクリックします。後は prototype.js と同様の方法で保存してください。

3.menufolder.js のダウンロード(Ver4.00以下の方のみ)

下記の download をクリックして、次のページで menufolder.js をクリックして menufolder.js(Ver5.00) をダウンロードしてください。

download

4.スクリプトの修正

デフォルトの状態では正常に動作しない(折りたたみタイトルが変に表示される)ため、以下のいずれか片方のみを実施してください。修正方法は妥当でないかも知れませんので予めご容赦ください。

4.1 protptype.js を修正する

任意のエディタで prototype.js を開き、「show: function」で検索し、そのちょっと下の部分に青色の「block」を追加します。

show: function() {
  for (var i = 0; i < arguments.length; i++) {
    var element = $(arguments[i]);
    element.style.display = 'block';
  }
},

4.2 menufolder.js を修正する

任意のエディタで menufolder.js を開き、一番下から 50 行ほど戻ったところにある

        Element.show(effect.element); // prototype.js 修正要
//      element.style.display = 'block';

の赤色部分を削除して、その上の行の先頭に、青色のように

//        Element.show(effect.element); // prototype.js 修正要
      element.style.display = 'block';

とコメントマークを追加します。

5.スクリプトのアップロード

上記の4ファイルをローカル・サイト・パス(index.html が置かれているディレクトリ)にアップロードします。
なお、menufolder.js については6項の設定を行った後でアップロードしてください。

6.テンプレートの修正

折りたたみを行いたい各テンプレートの <head> ? </head> の部分に青色部分を追加します。

<script type="text/javascript" src="<$MTBlogURL$>prototype.js"></script>
<script type="text/javascript" src="<$MTBlogURL$>effects.js"></script>
<script type="text/javascript" src="<$MTBlogURL$>controls.js"></script>
<script type="text/javascript" src="<$MTBlogURL$>menufolder.js"></script>

7.折りたたみ速度の設定

menufolder.js では全てのメニューに対して一括してゆっくりにする方法と個別に設定する2通りの方法を用意しています。

7.1 全てのメニューに対して一括してゆっくりにする

menufolder.js の下記の赤色部分を slow に修正してください。デフォルトは normal になっています。 テンプレートで FoldNavigation を起動している部分の変更は不要です。
//-----------------------
// 折りたたみスピード
//-----------------------
// 通常:'normal'
// 遅い:'slow'
var speed = 'slow';

7.2 個別に設定する

ゆっくり折りたたみたいメニューリストの下に下記の記述を追加します。

<script type="text/javascript">
<!--
FoldNavigationSlowly('idName','initState',viewListNumber);
//-->
</script>

すでにご利用中の方は

FoldNavigation('idName','initState',viewListNumber);

の FoldNavigation を FoldNavigationSlowly に変更してください。
赤色部分については menufolder.js マニュアルの3項を参照してください。

設定が終わったらテンプレートを保存・再構築してください。設定が正常にできていれば折りたたみ動作が変わっているはずです。

8.折りたたみスピードを変更する

サンプルの折りたたみ速度はデフォルトよりやや速くしています。速度を変更する場合は、effect.js の下記の赤色部分を変更します。

Effect.Base.prototype = {
  setOptions: function(options) {
    this.options = Object.extend({
      transition: Effect.Transitions.sinoidal,
      duration:   1.0,   // seconds
      fps:        25.0,  // max. 100fps
      sync:       false, // true for combining
      from:       0.0,
      to:         1.0
    }, options || {});
  },

単位は「秒」で、デフォルトは「1.0」(つまり1秒)なので、これを「0.5」等に修正すれば動作が早くなります。

9.その他

公開テンプレートはサンプルでご覧の通り正常に動作します。BlogPeople 等のリンクリストを overflow 指定でスクロールさせている場合も問題ありません。
折りたたみ動作で開く瞬間と閉じる瞬間に点滅するような場合は1行目の

<?xml version="1.0" encoding="utf-8"?>

を削除してみてください(取り除くことで正常に動作することを確認しています)。

またサブカテゴリーリストの折りたたみは不具合があるようです(原因不明)。また他のCSSを用いられている場合、設定?によってスムーズに動作しない可能性があります(原因は究明できておりません)ので予めご容赦ください。
また折りたたむ動作はメニューリストの上下 margin が少ない方がスムーズに動くようです。

以上です。

2005.08.25
折りたたみ時に発生する不具合を解消するための4項を追加しました(既知の事象でしたが本文に盛り込むのを忘れておりました、すいません)。

2005.11.01
折りたたみ時にメニューリストが点滅する場合の対処を9項に追記しました。

2007.10.25
6項のソースコードについて、JavaScript エラー回避のため、controls.js と effects.js の順序を入れ替えました。

関連記事
zenback
人気エントリー
トラックバックURL


トラックバック

サイドメニュー折り畳みV5.0 from 夏のクラクション
小粋空間 yujiro先生のサイドメニュー折畳みv5.0を導入してみた。 サイド... [続きを読む]

Tracked on August 25, 2005 2:52 PM

サイドメニューの折りたたみ(v5.0:ゆっくり折りたたむ) from FFF HP
小粋空間さんで、サイドメニューの折りたたみの新verが出ました。 サンプルを動か... [続きを読む]

Tracked on August 25, 2005 6:06 PM

ブログのカスタマイズをどこまでやるか from Mar de Leite : 凪の海
ブログの構築をどこまでやろうか……なんて最初から考えていた。 しかし出来るだけ費用がかからないように、自宅でサーバーを立てて、Linuxやウインドウズでサーバ... [続きを読む]

Tracked on August 26, 2005 12:08 PM

サイドメニューをゆっくり折りたたむ from grumble...
ここ最近、ブログの大量エラーが気になり 3.171フルパッケージを再インストールしてみた(3.2が出るというのにね笑) ... [続きを読む]

Tracked on August 26, 2005 1:46 PM

ゆっくりジワ?ッと開閉するサイドメニュー from やむやむ
ブログ開設当初 から 一番のお気に入りカスタマイズで 以来 ず???っと使わせて... [続きを読む]

Tracked on August 27, 2005 10:01 AM

サイトリニューアルに伴い折りたたみまくっております from EDGE of the dreamin'
小粋空間様のサブカテゴリー折りたたみスクリプトを導入させていただきました。 なん... [続きを読む]

Tracked on September 10, 2005 3:18 PM

blog設計・・・/折りたためるメニュー from コーチングダイアリー
相変わらず業務の合間に色々と構想を練っている俺です。今日はトラックバックの実験をしていました。トラックバックpingっていうんだけど・・・ただのpostデータの... [続きを読む]

Tracked on October 7, 2005 12:33 AM

[sz] 秋の夜長にMTカスタマイズ。(意味不明 from M E T A B O L I S M
 実はやらなきゃいけない事がたーくさんあるんですがどうしても調子が上がらず、寝よ... [続きを読む]

Tracked on November 5, 2005 5:35 AM

なにげにAjaxしたい、というおはなし。 from alicetale.jp
いまのサイドメニュー、未完成ながら、折りたためるようになっています。閉じているの... [続きを読む]

Tracked on December 9, 2005 1:49 PM

只今カスタマイズ中 from dotabata.net
今日はちょっと仕事から早く帰れたので, 夕方からあれやこれやとさわってみた。 前... [続きを読む]

Tracked on December 19, 2005 11:30 PM

サイドバー折りたたみ?ブログ人でmenufolder.jsを使う from Bet.diary
2列にするとサイドバーも長くなってきたので、My Blog List以外は最近よ [続きを読む]

Tracked on December 30, 2005 9:43 PM

サイドタイトル、やっと折りたためた from ヴァイオリンのススメ?下手のよこずき?
MovableTypeどうして、簡単そう? でも、ちゃんと腰をすえてやらないと出... [続きを読む]

Tracked on January 5, 2006 2:34 AM

サイドメニュー折りたたみを導入 from てぃあら
ここ で まず最初に取り組みたいカスタマイズにあげてた サイドメニュー折りたたみを やっと導入。MT 同様、サイドメニューが ひとつずつ 折りた... [続きを読む]

Tracked on January 19, 2006 4:41 PM

超久しぶりですぅ。 from Channel * chris
皆さん、(^^)/ コンバンハ〓♪ ちょっと色々あって、ずっと放置していまして... [続きを読む]

Tracked on January 22, 2006 3:49 PM

ツリー化とサイドメニューの折りたたみ from TOM'S HOME
小粋空間yujiro大先生のところを参考にツリー化とサイドメニューの折りたたみの... [続きを読む]

Tracked on February 26, 2006 1:31 AM

サイドメニューの折りたたみ・・・出来た(∇〃) from Relaxation
ってことで、ちびちびやってたんだけど、無事にサイドメニューの折り畳みが出来ました ん?、いいねぇ(笑) 私にはかなり難しかったけど、無事に完成して... [続きを読む]

Tracked on March 23, 2006 2:34 AM

テンプレートを完了。 from 我楽多日報!?
もう。なんか大変でしたが、このBLOGのテンプレートを1から改修大工事が、 ついに完了しました。2日強かかったような...。 見た目はDr.Blog[3... [続きを読む]

Tracked on April 21, 2006 10:03 PM

テンプレートを完了。 from 我楽多日報!?
もう。なんか大変でしたが、このBLOGのテンプレートを1から改修大工事が、 ついに完了しました。2日強かかったような...。 見た目はDr.Blog[... [続きを読む]

Tracked on April 21, 2006 10:15 PM

サイドバーを折りたためるようにしました from VOX POP
 エントリーの数だけ増えてきて、だんだん見づらくなってきたなーと思っていたところ... [続きを読む]

Tracked on April 24, 2006 1:03 AM

FC2ブログでサイドメニュー折りたたみスクリプト導入 from showry's Blog
FC2ブログで小粋空間様で公開しているサイドバーの折りたたみスクリプトを導入してみました。 [続きを読む]

Tracked on June 14, 2006 1:42 AM

スライダーで画像を拡大・縮小 from Memo for a Moment
prototype.jsに基づくAjaxライブラリの一つであるscript.aculo.us を利用して、スライダーで画像の大きさを変え... [続きを読む]

Tracked on January 8, 2007 3:57 PM

サイドバーメニューの折りたたみ from あかつき財務戦略研究所
カスタマイズもかなり進んできた。今回挑戦するのは、サイドバーメニューの折りたたみ... [続きを読む]

Tracked on February 24, 2007 11:01 PM

ナビゲーション部折畳みスキン for WDP from 他山之石 -Cyprus on the Web-
  【ダウンロード】 ※サンプルページはこちら ・skin_fold(lzh) ・skin_fold(zip) 「Web Liberty」にて、ないと様が... [続きを読む]

Tracked on May 21, 2007 11:55 PM

サイドメニューの折りたたみ(v5.0:ゆっくり折りたたむ) from Az ::clivia::
カスタマイズのエントリが続いてますが(汗)Ajax用JavaScriptライブラリを利用してサイドメニューをカッコ良く素敵チックに折りたためるようにしまし... [続きを読む]

Tracked on January 18, 2008 9:17 AM

5/18/09 ブログのサイドメニューを折りたたみ式に改良 from 南紀白浜スパダイブログ
ブログのデザイン・機能を少し変えてみました。右のサイドメニューが折りたためます。JavaScriptは、小粋空間: サイドメニューの折りたたみよりそのまま... [続きを読む]

Tracked on May 18, 2009 10:21 PM
コメント

4項の修正案にて正常に動作しました。

それと、リクエストに答えて頂き、ありがとうございますw。

[1] Posted by rpm : August 25, 2005 4:15 PM

昨夜から今朝にかけて謎の現象に悩まされ泣く泣くあきらめて眠りにつきましたが、あきらめきれずに今起きて見て見ると・・・!
早速4項の修正箇所を追加したところすんなり動作しました。
感激です。ありがとうございました。(*- -)(*_ _)ペコリ

[2] Posted by も。 : August 25, 2005 4:45 PM

こんにちは。
このたび、ブログを引っ越すことにいたしました。
つきましては、小粋ユーザーリストから、はずしていただきますようお願いいたします。
私が今まで、MTでブログを楽しんでこられたのも
小粋空間さんと出会えたからと感謝しています。
ありがとうございました。(*^^*)

[3] Posted by イーハトーブ : August 25, 2005 6:17 PM

>rpmさん
こんばんは。
ご連絡ありがとうございました!
不具合の記述がもれていてすいませんでした。
うまくできたようでよかったです。

>も。さん
こんばんは。
ご利用&コメントありがとうございます。
記事に不備があって申し訳ございませんでした。
ごゆっくりお休みください。

>イーハトーブさん
こんばんは。
ご連絡ありがとうございました。
ブログが変わっても引き続きお付き合いのほどよろしくお願い致します。
こちらこそありがとうございました!

[4] Posted by yujiro : August 26, 2005 12:24 AM

yujiroさん、(*・ω・)ノ こんにちわ♪
そしてお久しぶりでございます。
「ゆっくりサンプル」見て、面白そうなんで
早速やってみました。
4項の修正案が出てからだったので
↑の皆さんのように悩まされることなく
バッチリ出来ました。
ありがとうございました。

[5] Posted by やむ : August 26, 2005 1:11 PM

こんばんは。
「こんなカスタマイズもできるのか!」と感心しつつ利用させてもらっています。いつもありがとうございます。
早速今回のカスタマイズも試してみたのですが、一つだけ気になる現象が起きました。

サイドバーメニューの配置がmargin指定だからなのか、サブカテゴリーの閉開で深い階層を開くと重なってしまうのです。例えば、「MT」の下に「Template」、その下に「カスタマイズ」があったとします。「Template」は正常に開きますが、「カスタマイズ」を開くと下部のカテゴリまたはタイトル等に重なってしまう、と言う事です。

現在は悩み疲れて通常の閉開に戻しています^^;

[6] Posted by WIND : August 26, 2005 11:04 PM

(^o^)こ(^_^)ん(^O^)ば(^_^)ん(^〇^)わ♪
サンプル見て いい感じなので、やってみたんですけど・・・
「ゆっくり折りたたむ」ことは できたんですけど、「構文エラーです」っていうエラーになっちゃいます。
こんな感じ。ページを更新すると、なぜかエラーが消えます。どうして出るエラーなんでしょう?

[7] Posted by さえら : August 26, 2005 11:50 PM

こんばんは。
コレ、面白いカスタマイズですね。早速導入させていただきました。有り難うございます。どのくらいのスピードがいいのか、ヒトリでカチカチとクリックしてマス(笑)。

[8] Posted by toycozy : August 27, 2005 12:23 AM

>やむさん
こんばんはー。
お久しぶりです。
早々のご利用ありがとうございます。
うまくできたようで良かったです。

>WINDさん
こんばんは。
記事参照ありがとうございます。
こちらでもソースお借りして試してみましたがうまく動作しないようです。
ということでサブカテゴリーのみ標準に戻す設定ができるバージョンを提供したいとおもいます。訂正:標準に戻しても不具合は解消しないようです。すいません。

>さえらさん
こんばんは。
ご利用ありがとうございます。
ご質問の件ですが、こちらで動作させてみたところ、

http://caetla.oops.jp/cgi/mt/control.js

が正常に読み込まれていないようです(404 Not Found)。ファイルが指定したディレクトリに存在しているかご確認いただけますでしょうか。

以上です。
それではどうぞよろしくお願い致します。

>toycozyさん
こんばんは。
ご利用ありがとうございます。
うまくできたようで良かったです。

いい感じのスピードですね!
私も検証で1000回はクリックしました。(嘘)

[9] Posted by yujiro : August 27, 2005 2:05 AM

おはようございます。「(≧ロ≦) アイヤー ファイル名が cotrols.js になってました。(〃∇〃)
なんて初歩的なミス・・・オハズカシイ (* ̄Θ ̄*) ファイル名修正したら、バッチリできました。
のちほどエントリあげます、ありがとうございました。

[10] Posted by さえら : August 27, 2005 5:49 AM

おはようございます。

検証して下さっていたのですね。ありがとうございます。
あ?でもやっぱり駄目でしたか・・・残念。
個別に設定するか、諦めるか、、、、う?ん、悩みどころw

さえらさんのところでも同じ現象が出てますね^^;

[11] Posted by WIND : August 27, 2005 9:04 AM

新しい物好きなので導入させていただきました。ありがとうございました。

[12] Posted by わいるど : August 27, 2005 7:43 PM

>さえらさん
こんばんは。
トラックバックありがとうございます。
無事回復したようで良かったです!

>WINDさん
こんばんは。
理由がわからずすいません。
menufolder.js を介さずに直接起動することも可能ですのでお時間があるようでしたら色々お試しください。
BlogPeopleも導入しているようです。

>わいるどさん
こんばんは。
ご利用&ご連絡ありがとうございました。
うまくできたようで良かったです。
ではでは!

[13] Posted by yujiro : August 28, 2005 3:15 AM

おはようございます。
サイドメニュー折りたたみの状態保持が 
IEではちゃんとできてるんだけど、Firefoxではできてないことに気付きました。(うちだけの現象です。)
どうしたら Firefoxでも 状態が保持できるようになるでしょうか。

[14] Posted by さえら : September 27, 2005 6:08 AM

すみません、できました。さっきどうしてできなかったのかわからないままなんですけど、
ちゃんと 前に開いておいたところは次に見ても開いてるし、
閉じておいたところは閉じてます。お騒がせしました。

[15] Posted by さえら : September 27, 2005 6:22 AM

>さえらさん
こんにちは。
なおったようでよかったです。

Firefoxでできなくなった原因は不明ですが、やはりキャッシュの問題でしょうか。(謎)

[16] Posted by yujiro : September 27, 2005 5:39 PM

はじめまして、早速試してみて無事成功したのですが、なぜか、タイトルと1番目の項目リストの間に空白(リスト1項目分くらいの空白)が生じてしまいます。タイトルとその直下のリストとの間の感覚の設定は出来るのでしょうか。大変恐縮ですが宜しくお願い致します。

[17] Posted by yusuke : September 29, 2005 1:06 AM

>yusukeさん
こんばんは。
ご利用ありがとうございます。

ご質問の件ですが、タイトルとリストの間隔の設定はスタイルシートの .sidetitle または .side の margin プロパティ(あるいは padding)の値を変更することで調節可能と思います。

以上です。
それではよろしくお願い致します。

[18] Posted by yujiro : September 29, 2005 10:51 PM

v5.0を無事導入することが出来ました。
折りたたみマークを付けていますが正常に動作しています。
いろいろカスタマイズ出来てとても嬉しいです。(^^)

[19] Posted by Suzuran : October 5, 2005 2:26 PM

>Suzuranさん
こんばんは。
ご利用&ご連絡ありがとうございます。
こちらはうまくできたようで良かったです。

またのご利用をお待ち申し上げます。

[20] Posted by yujiro : October 5, 2005 11:43 PM

はじめまして。
初めてのMT導入でこちらのテンプレートをお借りしました。お世話になります。
まだいろいろテストしてみている段階なのですが、折りたたむ時と開く時に跳ねるような動きになってしまいます。
何か考えられる原因がありましたらお願いします。

[21] Posted by avi : November 1, 2005 5:16 PM

>aviさん
はじめまして。
テンプレート&折りたたみご利用ありがとうございます!
ご質問の件ですが、9項に対処方法を追記しましたので参考になれば幸いです。

以上です。
それでは今後ともどうぞよろしくお願い致します。

[22] Posted by yujiro : November 1, 2005 8:22 PM

折りたたみ点滅の件ですが追記していただいた内容で修正できました。
ありがとうございました!

[23] Posted by avi : November 1, 2005 9:06 PM

>aviさん
こんばんは。
うまくできたようでよかったです。
ではでは!

[24] Posted by yujiro : November 2, 2005 1:28 AM

はじめまして

サイドメニューの折りたたみを探していたところ、こちらで理想のものを見つけ、領させていただいております。

しかし、Apache/2.0.53 (Win32) というテスト環境で、ゆっくり折りたたむことができるものの、実際のサーバーであるApache/1.3.33 (Mac OS X Server) でうまく動作できていません。プラットホームで依存等、ございますでしょうか。

ご存じでしたら、ご指導の程、よろしくお願いいたします。

[25] Posted by さかまたみなも : December 9, 2005 10:17 AM

設定ミスでした。お目汚し、申し訳ありませんでした。

[26] Posted by さかまたみなも : December 9, 2005 1:43 PM

>さかまたみなもさん
はじめまして。
ご利用ありがとうございます。
無事に直ったようでなによりです。
ではでは!

[27] Posted by yujiro : December 10, 2005 2:46 AM

ブログ人ユーザーですが、ちょっと手を加えてmenufolder使わせていただきました。ありがとうございます。
しかし、これ以外にもすごいカスタマイズの情報量ですねぇ…。すごい。

[28] Posted by 桃薫 : December 30, 2005 10:04 PM

>桃薫さん
こんばんは。
ご利用&トラックバックありがとうございます!
他のブログでの報告はあまりないため大変ありがたいです。
それではまたのお越しをお待ち申し上げます。

[29] Posted by yujiro : December 31, 2005 11:16 PM

こんにちはぁ。
SereneBach でも 折りたたみ使わせていただきました。

[30] Posted by さえら : January 19, 2006 4:37 PM

>さえらさん
こんばんは。
ご利用ありがとうございます。
ツリーの件は自分でも修正した記憶があるのですが、エントリーしておりませんでした。
確認します。

[31] Posted by yujiro : January 21, 2006 1:51 AM

yujiroさん、(^-^*)/こんにちは?
いつも、お世話になっています。
折りたたみスクリプトの5.0バージョンをダウローさせていただきました。
今回は、スムーズに設置できました。
これ、とても良いですね。
ありがとうございました。

[32] Posted by クリス : January 22, 2006 3:56 PM

>クリスさん
こんばんは。
お世話になります&ご利用ありがとうございます。
バッチリできましたね。
体調も回復されたようで良かったです。
ではでは!

[33] Posted by yujiro : January 23, 2006 11:25 PM

こんばんは。
色々重宝させて頂いております。
えーと…サンプルページがデッドリンクになっているようなので、ご報告申し上げます。
近々ゆっくり挑戦させて頂こうと思っています。
でわでわ。

[34] Posted by クミチョフ : February 20, 2006 2:23 AM

>クミチョフさん
こんばんは。
お世話になります。
デッドリンクのご連絡ありがとうございました。
先ほど修正致しましたのでご確認ください。

[35] Posted by yujiro : February 20, 2006 11:32 PM

こんにちは。 m(__)m
はじめまして、いつもお世話になっております。
いつも参考にさせていただいております。
ブログのカスタマイズとは直接関係無いのですが、
サンプルページの「ゆっくり折りたたむサンプル」を表示すると「小粋空間さん」の表示が上手く表示できなくなりました。
もう一台のパソコンでも同様の現象です。
再起動などしても元に戻りません。
スタイルシートを読み込まなくなったようにも見えますが、詳しい事が解りません。
初歩的なことで大変お恥ずかしいのですが、今後も参考にして行きたいと考えていますが、このままでは見辛くてご相談させていただきました。
Windows2000Pro Sp4
IE Ver6.0 and Ver5.0
よろしくお願い致します。

[36] Posted by てるてる : March 5, 2006 4:13 PM

自己レスです。
すみません解決しました。
先ほどのページを見ることで、スタイルが変わってしまったようです。(Netscapeで言う基本ページスタイルになってしまったようです。←よくわかりませんが。^^;)
で、このページの「styles」を探して、StyleSheetsを選択したら直りました。
これ以降、サンプルページに行ってもこの現象は起こりませんでした。
大変失礼しました。 m(__)m
今後ともよろしくお願い致します。

[37] Posted by てるてる : March 5, 2006 4:43 PM

>てるてるさん
はじめまして。
ご利用ありがとうございます。
無事に直ったようでよかったです。
もしまた表示に不具合が発生したら、[ツール]-[インターネットオプション]-[全般]タブでインターネット一時ファイルおよび履歴を削除してみてください。

以上です。
それではどうぞよろしくお願い致します。

[38] Posted by yujiro : March 6, 2006 8:02 PM

 はじめまして。
 サイドメニューの折りたたみにチャレンジし、昨日、この記事にトラックバックしたものです。
 現在のブログのインターフェースに、折りたたみはありませんが、いたずらにトラックバックしたわけではないので、ご報告を……。

 自宅のOSX-Safariでいじって「成功!」かと思いきや、外のwin-IEで見たら、レイアウトが崩れていまして。
 当方、こちらのテンプレートを使用しているわけではないので、なにかのタグの使い方などが間違っていたのだと思います。

 失礼しました。

[39] Posted by Chie : April 25, 2006 2:51 AM

>Chieさん
こんにちは。
ご連絡ありがとうございます。
折りたたみを設定された状態でページを拝見させて頂ければ何かアドバイスできるかも知れません(当方Mac環境がありませんが)。
必要であればご連絡ください。
ではでは。

[40] Posted by yujiro : April 26, 2006 12:47 PM

こんにちは。
いつも参考にさせていただいています。

少し前からサイドメニューの折たたみに挑戦していますがうまくいきません。
なので、テストページにてチャレンジしています。

このたびなぜか【エントリーリスト】の部分だけできました。しかし、他がうまくできません。
【トラックバック】と【月別アーカイブリスト】をやってみましたができていません。

EntrynameとEntrylistのEntryの部分だけ変更するだけではいけないのでしょうか?

宜しくお願いいたします。

[41] Posted by ふぅ : July 10, 2006 4:33 PM

申し訳ありません。v4.0の方にコメントするのにコチラに書いてしまいました。

[42] Posted by ふぅ : July 10, 2006 4:35 PM

>ふぅさん
こんにちは。
ご利用ありがとうございます。
ご質問の件ですが、カテゴリーリストの折りたたみはカテゴリーリストのすぐ下にある

FoldNavigation('Entry','off',false);

FoldNavigation('category','off',false);

に修正してください。

月別アーカイブリストの場合は、月別アーカイブリストのすぐ下にある

FoldNavigation('Entry','off',false);

FoldNavigation('MonthlyArchive','off',false);

に修正してください。
それではよろしくお願い致します。

[43] Posted by yujiro : July 11, 2006 1:22 PM

お世話になります。ゆっくりの開閉ができました。
なんだか、夢のようです。うふ♪(* ̄ー ̄)v
ありがとうございました。

[44] Posted by もみぃ : August 8, 2006 7:20 PM

>もみぃさん
こんばんは。
ご利用ありがとうございます。
テンプレートの1行目にある

<?xml version="1.0" encoding="<$MTPublishCharset$>"?>

を削除すれば動きがもっとスムーズになりますよ。
ではでは!

[45] Posted by yujiro : August 9, 2006 12:15 AM

今日はこちらを導入してみました。
一応 なんかと動作できるようになりました。
しかし、テンプレートの1行目を削除するとテンプレートが崩れる現象が出ます。
またお手数をかけますが、よろしくお願いします。

[46] Posted by chi- : November 8, 2006 7:52 PM

>chi-さん
こんばんは。
ご利用ありがとうございます。
ご質問の件ですが、HTMLマークアップに誤りがあるために表示が崩れるようです(Firefox では1行目を削除しなくても崩れています)。
Another HTML-lint gatewayでチェック・修正されることをお勧めします(「?に対応する終了タグ?がみつかりません」のメッセージを修正すれば表示崩れはなおるかもしれません)。
それではよろしくお願い致します。

[47] Posted by yujiro : November 11, 2006 2:15 AM

yujiroさん
大変お世話になりました。
原因はCSSの}抜けが2箇所あって それだったようです。
お陰でばっちり作動してます。
これからもいろいろ参考にさせていただきたい思っております。
ありがとうございました。

[48] Posted by chi- : November 11, 2006 11:13 AM

>chi-さん
こんにちは。
ご連絡ありがとうございました。
CSSの方でしたね。気がつかずすいませんでした。
ともあれ無事になおって良かったです。
ではでは!

[49] Posted by yujiro : November 13, 2006 10:38 AM

すみません。
ライブドアブログで使用されてるケースがないようなのですが、使用することはできないのでしょうか?
テンプレートのどこを変えていいものかわかりませんのでした。。
サイドバーにはこのような表示がでます。
==========================
○<%recent_title>
==========================
よろしくおねがいします。

[50] Posted by ぽてち : November 16, 2006 11:27 AM

>ぽてちさん
こんにちは。
ご質問の件ですが、適用可能か確認してみます。可能であれば別途エントリーしたいと思います。すいませんがしばらくお時間ください。
それではよろしくお願い致します。

[51] Posted by yujiro : November 16, 2006 5:28 PM

ありがとうございます。
お忙しいところ申し訳ありませんが、よろしくお願い致します。

[52] Posted by ぽてち : November 16, 2006 11:38 PM

始めましていつも拝見させて頂いています。
さて、この折りたたみのスクリプトですが、本来ブログ用に作成されているとは思いますが、ブログ以外のサイトでも使用してもよろしんでしょうか?

JavaScriptの知識が殆どないので自分でカスタマイズは出来ないので、そのまま流用しようとは思ってるですが。
試しにローカル上で作成した物は動作に問題は無かったので、許可していただけたらウチのサイトで折りたたみスクリプトを使用させていただこうと思ってます。

[53] Posted by オンチ映画祭HP管理人 : November 30, 2006 8:30 AM

>オンチ映画祭HP管理人さん
はじめまして。
いつもご覧くださりありがとうございます。
折りたたみスクリプトはブログに限っておりませんので、ご自由にお使いくださって結構です。
ご連絡くださりどうもありがとうございました。

[54] Posted by yujiro : November 30, 2006 9:54 AM

>yujiroさん
ありがとうございます。早速使わせていただきました。

ブログ風なHPデザインを作っていて、今更「コレってブログで作ったら良かったんじゃん」って思うところがありますが、今更過ぎるのでやめました。DWのテンプレートで何とかやっています。

サブカテゴリーの折りたたみや、アーカイブの折りたたみも試してみましたが、当HPには同じ形式で複数設置しているため断念しました。
若干デザインや使用方法に手を加えてはいますが、問題ないでしょうか?

[55] Posted by オンチ映画祭管理人 : December 4, 2006 1:48 PM

>オンチ映画祭HP管理人さん
こんばんは。
こちらも問題ございません。ご自由にアレンジしてやってください。
それではよろしくお願い致します。

[56] Posted by yujiro : December 4, 2006 11:39 PM

こんにちは。v4.0を利用しています。

質問なのですが、状態保持の設定を個別に指定することは出来ますか?
現在状態保持は有効に設定しているのですが、1ヶ所だけほとんど使わない(メールフォーム)の部分だけ、無効(常に閉じた状態)になればいいなと思うのですが、そのようなことは可能でしょうか。

また、上記の質問とは関係ないのですが、最新版がv5.0ですが、折りたたみのスピード調節が必要ない場合はv4.0が最新?と考えていいのでしょうか。
なんでも最新版を使いたいタチなのですが(笑)v5.0にしてスピード調節は無効で使う意味があるのかどうかがちょっと気になるのです。

[57] Posted by みる : April 23, 2007 2:14 PM

>みるさん
こんばんは。
カスタマイズご利用ありがとうございます。
ご質問の件ですが、状態保持の設定を個別に設定することは現在できませんが、機会をみて機能追加したいと思います。ご要望ありがとうございます。

また、現在の最新バージョンは 6.03 です。バージョンアップ内容の詳細はスクリプトのページをでご覧ください。
それではよろしくお願い致します。

[58] Posted by yujiro : April 24, 2007 6:54 PM

こんにちわ。
折りたたみ機能を使用したく飛んで参りました。

showry's Blog 様の紹介している「FC2ブログでサイドメニュー折りたたみスクリプト導入」(トラバ参照)を参考にしてみたいのですが、説明の例が小粋空間様のテンプレで説明されています。(項目5・6が解らなくて)
FC2の共有テンプレでは出来ないのでしょうか?
出来るとすれば「HTMLの編集」の何処を変更すれば良いのでしょう?
FC2 共有テンプレ do_qp_dot_3c 使用しています。

お忙しいとは思いますが、お時間がある時にでもお返事下さい。
素人なので小粋空間様のテンプレカスタマイズ出来そうもなく、他のテンプレで折りたたみ機能が出来たらなぁと思っているのですが。。。

[59] Posted by トントン : May 24, 2007 10:35 AM

>トントンさん
こんばんは。
ご質問の件ですが、共有テンプレートでも利用は可能ですが、この記事に書いている設定とは手順ちょっと異なりますので、改めて記事にしたいと思います。
それではよろしくお願い致します。

[60] Posted by yujiro : May 26, 2007 1:15 AM

yujiro様

こんばんわ。
是非お願いします。
FC2のテンプレでも利用出来るという事でとても嬉しいです♪

他にも方法はあるのですが、その方法だと開け閉めの保持が出来ないのです。
記事になるのをお待ちしております。
解りやすい所にお願いします。
記事が沢山あるので迷ってしまうので(^-^;
宜しくお願い致します^^

[61] Posted by トントン : May 28, 2007 11:15 PM

>トントンさん
こんにちは。
記事はトップページの途中辺りに最新記事を並べて表示してますので、そちらを2日?3日に一度ご覧になってください。

[62] Posted by yujiro : May 29, 2007 3:31 PM

yujiroさま。
こんにちわ。いつもお世話になっております。
1個1個ご質問ばかりで申し訳ないと思っております。
折りたたみに成功したのですが・・・コメントやカテゴリなどの
次のページにいくとテンプレートがくずれてしまいました。
アーカイブインデックスなどにも何かするのでしょうか?
ご指導を宜しくお願い致します。

[63] Posted by 亜風瑠 : September 16, 2007 2:18 AM

>亜風瑠さん
こんばんは。
ご質問の件ですが、HTMLを拝見させて頂くと、

<div id="links-left-box">
<dl id="links-left">

のすぐ下に

</div>

があるのが原因の一端かもしれません。

http://htmllint.itc.keio.ac.jp/htmllint/htmllint.html

等でHTMLマークアップが正しいことをご確認ください。
それではよろしくお願い致します。

[64] Posted by yujiro : September 20, 2007 1:48 AM

yujiroさま。
こんにちわ。いつもお世話になっております。
お返事が遅れてしまい大変申し訳ございません。
yujiroさまのご指導で</div>を外したら直りました。
ありがとうございました♪
これからも宜しくお願い致します。
PS:名前を亜風瑠からアプルにしました。

[65] Posted by アプル : September 24, 2007 3:42 PM

>アプルさん
こんにちは。
ご連絡ありがとうございました。
無事に直ったようでよかったです。
ではでは!

[66] Posted by yujiro : September 25, 2007 11:23 AM

yujiroさま。こんにちわ。いつもお世話になっております。
2個目の質問です(-_-;)
サイドバーの向かって左と右のCategoriesまでの枠のサイズが
同じなんですが、 Monthly Archives ・Links ・Counterの3つが
枠のサイズが大きいように見えるのですが、何かおかしいのでしょうか?
お忙しいとは思いますが、宜しくお願い致します。

[67] Posted by アプル logo : October 23, 2007 1:02 AM

>アプルさん
こんにちは。
ご質問の件ですが、スタイルシートの下記の青色を追加して、赤色を削除してみてください。

.sidetitle2 {
    width: auto;
    margin:3px 0px 0px 0px;
    padding: 0px;
    text-align: center; /* テキスト配置 */
    line-height: 2.0;
}
 
/* 通常 */
.sidetitle2 a:link,
.sidetitle2 a:visited {
    display: block;
    padding: 2px;
    border: 1px solid #999999; /* 枠線 */
    color:#666666; /* 文字色 */
    background-color:#ffffff; /* 背景色 */
    font-family: Verdana, Arial, sans-serif;
    font-size:10px;
    text-decoration: none;
}
 
/* マウスポイント時 */
.sidetitle2 a:hover {
    padding: 2px;
    border: 1px solid #999999; /* 枠線 */
    color:#ffffff; /* 文字色 */
    background-color: #999999; /* 背景色 */
    font-family: Verdana, Arial, sans-serif;
    font-size:10px;
    text-decoration: none;
}

それではよろしくお願い致します。

[68] Posted by yujiro logo : October 23, 2007 11:17 AM

yujiroさま。こんにちわ。いつもお世話になっております。
青色を追加が分からなかったので照らし合わせて
line-height: 2.0;を追加でいいんですよね?
本当に初歩的なご質問ばかりで申し訳ないです。
ありがとうございました♪
これからも宜しくお願い致します。

[69] Posted by アプル logo : October 23, 2007 8:18 PM

>アプルさん
こんにちは。
すいません。表示を修正しましたので再度ご確認ください。
それではよろしくお願い致します。

[70] Posted by yujiro logo : October 25, 2007 10:04 AM

yujiroさま。こんにちわ。いつもお世話になっております。
ここでのコメントでいいのか?またまた分からないのですが・・・。
TOPは崩れていませんが、コメント・CategoryやMonthly Archives
などのページに移動するとスタイシートがどうしても崩れてしまいます。
お忙しいとは思いますが、宜しくお願い致します。

[71] Posted by アプル logo : November 19, 2007 2:42 PM

>アプルさん
こんにちは。
ご返事遅くなり申し訳ございません。
不具合が解消されていないようであれば、不具合のある状態にして再度ご連絡いただけますでしょうか。
それではよろしくお願い致します。

[72] Posted by yujiro logo : November 22, 2007 1:50 PM

yujiroさま。こんにちわ。いつもお世話になっております。
何も変えてないので、崩れているはずですが(-_-;)
私だけなのでしょうか?
エントリ 
http://shakuo.s31.xrea.com/musashi/2007/11/post-60.php

Categories 
http://shakuo.s31.xrea.com/musashi/diary/

Monthly Archives
http://shakuo.s31.xrea.com/musashi/2007/11/

にそれぞれ移動すると右サイドバーのスタイルシートが
崩れてしまいます。

お忙しいとは思いますが・・・宜しくお願い致します。

[73] Posted by アプル logo : November 23, 2007 12:38 AM

>アプルさん
こんにちは。
不具合見落としておりました。申し訳ありません。
ご質問の件ですが、「BlogPeople Search」というタイトルの10行ほど下に

</ul>
</div>

という、冗長と思われるマークアップがありますので、これを削除してみてください。

なお、全体的に(X)HTMLマークアップ誤りが多いため、下記のサイトを利用してマークアップを修正されることをお勧めいたします。

Another HTML-lint gateway

このチェック結果で表示された7~9点のものだけはできる限り修正してください(内容によっては修正が難しいものもありますが、ほとんど直せると思います)。
それではよろしくお願い致します。

[74] Posted by yujiro logo : November 26, 2007 7:39 PM

yujiroさま。こんにちわ。いつもお世話になっております。
お返事が遅れてしまってすいません(-_-;)
直りました♪えっと・・・よく分からないのですが・・・多分
今までのMTが置いた場所がxreaサーバーのMySQLの
バージョンが低い為に色々な面で再構築が出来なかったのが
分かったようなので違うサーバーに移行したら同じように
スタイルシートが崩れたのですが・・・yujiroさまのご指導で
直りました。本当に感謝しております。移行したらもう少し
勉強してAnother HTML-lint gatewayチエックして
修正しようと思っております。
このたびもご親切なご指導をありがとうございます。
そしてカレンダーがまたまた変なのでご指導を宜しくお願い致します。

[75] Posted by アプル logo : November 30, 2007 2:04 AM
コメントする
greeting

*必須

*必須(非表示)


ご質問のコメントの回答については、内容あるいは多忙の場合、1週間以上かかる場合があります。また、すべてのご質問にはお答えできない可能性があります。予めご了承ください。

太字イタリックアンダーラインハイパーリンク引用
[サインインしない場合はここにCAPTCHAを表示します]

コメント投稿後にScript Errorや500エラーが表示された場合は、すぐに再送信せず、ブラウザの「戻る」ボタンで一旦エントリーのページに戻り(プレビュー画面で投稿した場合は、投稿内容をマウスコピーしてからエントリーのページに戻り)、ブラウザをリロードして投稿コメントが反映されていることを確認してください。

コメント欄に(X)HTMLタグやMTタグを記述される場合、「<」は「&lt;」、「>」は「&gt;」と入力してください。例えば「<$MTBlogURL$>」は「&lt;$MTBlogURL$&gt;」となります(全て半角文字)