<< 浮気? | main | どうも体調が悪い・・・;; >>
スポンサーサイト

一定期間更新がないため広告を表示しています

| - | | - | - |
【スクリプト】ツリー化スクリプトのカテゴリ・アーカイブ対応 sbサブカテゴリ対応版
以前に作成した、「【カスタム】ツリー化スクリプトのカテゴリ・アーカイブ対応」のsb向け改訂版です。
sbではサブカテゴリの作成が可能なのですが、sbで出力されるコードは<ul><li><ul><li>の形で出力されており、一応字下げ(=ツリー化と私は認識していますが^^;)はされているものの、takkyun氏のスクリプトによる従来のツリー化のイメージで見たい(統一したい?)という声もあるようです。

それに対応するため、以前の記事で実現したカテゴリのツリー化をsb向けのサブカテゴリ対応に変更してみました。
一応、ウチのsb仮運用サイトにはスクリプトを追加したので、確認してみて下さい。

なお、これを使用する場合には、[大カテゴリ]小カテゴリという名前にする必要はありません。[大カテゴリ]小カテゴリという形でサブカテゴリを使用せずにツリー化するのであれば、前の記事のスクリプトを利用して下さい。
1.元のスクリプトを改造します。(前回追加部分は青字、今回追加・修正部分は赤字)
var baseCategory;
function makeTreeElements (idName,objList) {
  if (!objList.innerHTML) return;
  var objLink = objList.getElementsByTagName('a')[0];
  var linkUrl = objLink.getAttribute('href');
  if (idName.indexOf('comment') > -1 || idName.indexOf('tb') > -1) {
    var tmpText = objList.innerHTML.split("⇒");
    tmpText[0] = tmpText[0].slice(0,tmpText[0].search(/<BR/i));
    this.base = Array('<a href="',linkUrl,'">',tmpText[0],'</a>').join('');
    this.elem = objLink.innerHTML;
  } else if (idName.indexOf('entry') > -1) {
    var tmpText = objList.innerHTML;
    tmpText.match(/¥((¥d¥d¥/¥d¥d)¥)/);
    this.base = Array('<strong>[',RegExp.$1,']</strong>').join('');
    this.elem = Array('<a href="',linkUrl,'">',objLink.innerHTML,'</a>').join('');
  } else if (idName.indexOf('link') > -1) {
    var tmpText = objList.innerHTML;
    if ( tmpText.match(/¥[(.+)¥](.+)/) ) {
      this.base = Array('<strong>[',RegExp.$1,']</strong>').join('');
      this.elem = Array('<a href="',linkUrl,'" target="_blank">',RegExp.$2,'</a>').join('');
    }
  } else if (idName.indexOf('category') > -1) {
    var tmpText = objList.innerHTML;
    tmpText.match(/¥((¥d+)¥)/);
    var tmpLink = Array('<a href="', linkUrl, '">', objLink.innerHTML, '</a> (', RegExp.$1 , ')').join('');
    if ( linkUrl.split('¥?')[1].indexOf('-') == -1 ) {
      baseCategory = tmpLink;
      this.elem = '';
    } else {
      this.elem = tmpLink;
    }
    this.base = baseCategory;

  } else if (idName.indexOf('archive') > -1) {
    var tmpText = objList.innerHTML;
    tmpText.match(/¥((¥d+)¥)/);
    var tmpCnt = Array(' (', RegExp.$1, ')').join('');
    tmpText = objLink.innerHTML;
    tmpText.match(/(.+) (¥d+)/);
    this.base = Array('<strong>[',RegExp.$2,']</strong>').join('');
    this.elem = Array('<a href="',linkUrl,'">',RegExp.$1,'</a>', tmpCnt).join('');

  }
  return this;
}
function createTreeList(idName,option) { // version 2.2
  var objFocus = this.document.getElementById(idName);
  if (!objFocus) return;
  if (!objFocus.innerHTML) return;
  var objLists = objFocus.getElementsByTagName('li');
  var linkList = new Array();
  var outText = new Array();
  if (objLists.length > 0) {
    for (var i=0;i<objLists.length;i++) {
      var chckFlag = true;
      var elemText = new makeTreeElements(idName,objLists[i]);
      if (!elemText.base || (idName.indexOf('category') == -1 && !elemText.elem)) return; // ←修正箇所 
      for (var j=0;j<linkList.length;j++) {
        if ( linkList[j].base.indexOf(elemText.base) > -1 ) {
          chckFlag = false;
          linkList[j][linkList[j].length] = elemText.elem;
        }
      }
      if (chckFlag) {
        var tmpNum = linkList.length;
        linkList[tmpNum] = new Array();
        linkList[tmpNum][0] = elemText.elem;
        linkList[tmpNum].base = elemText.base;
      }
    }
    if (linkList.length > 0) {
      outText[outText.length] = '<ul>¥n';
      for (var i=0;i<linkList.length;i++) {
        outText[outText.length] = Array('<li>',linkList[i].base,option.top).join('');
        if (linkList[i].length > 0 && option.sort) linkList[i].reverse();
        for (var j=0;j<linkList[i].length;j++) {
          if ( linkList[i][j] == '' ) continue; // ←追加箇所
          outText[outText.length] = (j == linkList[i].length - 1) ? option.end : option.list;
          outText[outText.length] = Array(linkList[i][j],option.leef).join('');
        }
        outText[outText.length] = Array(option.btm,'</li>').join('');
      }
      outText[outText.length] = '</ul>¥n';
      objFocus.innerHTML = outText.join('');
    }
  }
}

2.必要に応じて、カテゴリおよびアーカイブの呼び出しを最後に追記してください。
createTreeList('categorylist',gTreeOption);     // カテゴリリストのツリー化
createTreeList('archivelist',gTreeOption);     // アーカイブリストのツリー化


カテゴリ・アーカイブに指定するIDは、それぞれ'categorylist''archivelist'としてください。
他、詳細の設定内容は、JUGEMカスタマイズ講座のツリー化スクリプトを参考にして下さい。

[13:50 修正]空の子が出力される不具合の対策。
[10/20 修正]本来のコードが一行消えていたのを元に戻して、そこを修正箇所として再掲載

*** 役に立ったと思われましたら、下の広告などをポチッと押してもらえると助かります汗 ***
| [Custmize]sb | 11:29 | comments(31) | trackbacks(7) |
スポンサーサイト
| - | 11:29 | - | - |
コメント
まめさまコンニチワ!
お知らせ下さり有難う御座います!
早速チャレンジしたのですが、私のミスの所為か、ちょっと妙な具合に(汗
サブカテゴリーのないものにも、ツリー化の枝(?って言えばいいんでしょうか・・・)が出て、サブカテゴリーがあるものだと、サブカテゴリーの上に空の枝が出来てしまいます…。
すっごくわかりづらい説明かと思うのですが…。
http://suitability.sakura.ne.jp/sb/sb.cgi?tid=7
こういった感じになってしまいます(汗

何か記述ミスなのでしょうか…。
お手数お掛けして申し訳ないのですが、お気付きの点御座いましたらお教え願えると嬉しいです。私もまたいじってみます〜。
折角新しく記事UPしていただいたのにもうしわけないです!!
| くみッぺ | 2004/10/14 12:58 PM |
こんちわデス!
ご連絡ありがとうございます!

ワタシも、くみッぺさんと同じ症状に・・・。その他は問題なさそうです。
JUGEMだったらentryひとつひとつのカテゴリの変更なんて、うざくてやってられなかったでしょうが、sbだとチョーカンタンですネ(^o^)丿
ゼヒ、このまま設置したいので、よろしくご教授くださいv
| yuki | 2004/10/14 1:26 PM |
女くみっぺ様
私の方のgTreeOptionの設定が<div>を使用する形だったため、要素が空の場合には何も出力されないため、私のところでは現象が確認できていませんでした。私の思慮不足により、ご心配をおかけして申し訳ありませんでした。
対策などは記事の方に記載いたしましたので、よろしければご参考になさって下さい。
| まめ | 2004/10/14 1:33 PM |
女くみっぺ様、女yuki様
目処が付きましたので、これから記事を修正します。お待たせして申し訳ありません。
| まめ | 2004/10/14 1:43 PM |
バッチリグッド上手くいきました〜。
早速のご対応、多謝です拍手
| yuki | 2004/10/14 1:47 PM |
女yuki様
あぅ。暫定対応で書いた記事の方を入れたんですね男汗
今、元の<li>でも動作するスクリプトに書き換えましたので、面倒でなければそちらを入れることをおすすめ致します。ごちゃごちゃになって申し訳ないです
| まめ | 2004/10/14 1:59 PM |
早急なお返事感謝致します!
サブカテゴリーに出てくる<li>が原因の空の枝が無事消えました!
しかしながら、大変申し訳ないのですけれど、サブカテゴリーのないカテゴリーの枝がそのまま出来ているのが消えないのです(汗
これはどうにかして消すことが出来るものでしょうか…?
度々申し訳御座いません!!
現在の状況も、上記のURLの状態です。
もし無理なのだとしたら、サブカテゴリーを作ってしまおうか、とも考えているのですけれども…。
大変申し訳ないのですが、何かお気付きの点ありましたらお教え願いたら助かります〜。
| くみッぺ | 2004/10/14 2:03 PM |
あ、被ってしまいました!
修正してきますー!有難う御座います!!
| くみッぺ | 2004/10/14 2:07 PM |
女くみッぺ様
すみません、少し前にスクリプトを改定しましたので、そちらでもう一度お試し頂けないでしょうか?ばたばたとして、申し訳ありませんでした。
p.s.名前間違っていました。重ね重ね申し訳ありません。
| まめ | 2004/10/14 2:08 PM |
ダイジョブです!
すぐさま元に戻し、liで動作するほうに差し替えました!
テンプレのバックアップをその都度とってるので、1〜2行程前に戻るのはカンタンだったりします汗
ワタシはサブカテゴリのないカテゴリというのは作ってないので、これでバッチリグッドです。
ありがとうございました〜♪
| yuki | 2004/10/14 2:08 PM |
有難う御座いますー!!!!
バッチリ成功です!
ガガーッとコピペさせて頂きました!
凄く嬉しいです!感謝感激です〜!私の我侭を取り入れて下さって本当に有難う御座います〜!
名前、全然大丈夫です(笑
大概の方間違われるので!
早急な対応、本当に有難う御座いましたッ拍手
| くみッぺ | 2004/10/14 2:17 PM |
コンバンワー。
度々スミマセン…汗
サブカテゴリーから、サブカテゴリーのエントリーに飛べるわけですけれど、何故か飛べない部分もあって…。
原因がさっぱりわからなくて、ちょっと困っております悲しい
私の記述ミスなのでしょうか…。
多分あってると思うのですけれど冷や汗
もし何かお気付きの点御座いましたら、お教え頂けると助かります〜。
度々ご迷惑お掛けして本当に申し訳ないです…!
| くみッぺ | 2004/10/18 1:26 AM |
女くみッぺ様
その、飛べないリンクは&が付いている物でしょうか?
takkyun様に問い合わせてみますが、sb自体の不具合のような気がします。
| まめ | 2004/10/18 1:34 AM |
あ、ハイ!
サブカテゴリー名に&が入ってます!
そして飛べないのが&が入っているものです!
不具合ですかー…。なるほど。
って、今回も早急なご返答感謝です!!
とりあえず現状維持でいっておきます汗
| くみッぺ | 2004/10/18 3:10 AM |
女くみッぺ様
一応、sbのUserGroupにあるパティオに書き込んでおきました。
とりあえず&を外すか、全角にすれば回避できると思います。
| まめ | 2004/10/18 10:19 AM |
はじめまして。JUGEMからsbに移行した際に
このスクリプトとページナビのスクリプトを
お借りしました。

おかげでとってもスッキリ見やすくなりました拍手
sb版ということでとっても有り難いです。
ブログピープルに登録させて
いただいちゃってもいいでしょうか???

ではまた拝見させていただきます
楽しい
| Xiao | 2004/10/18 11:12 AM |
女Xiao様
コメントありがとうございます。BlogPeopleは、被リンクとしてこちらから登録する際には条件は付けていますけど(ある意味当たり前のことですけどやってないところもあるので冷や汗)、うちを登録する場合は制限していません。というか登録して頂けるならありがたいです楽しい
| まめ | 2004/10/18 1:54 PM |
まめさま、重ね重ね有難う御座いますー!!
とりあえず全角にすることで問題は回避されました拍手
パティオの方にも書き込んで下さったとのことで、本当に有難う御座います!
とっても助かりましたー!
| くみッぺ | 2004/10/18 10:15 PM |
はじめまして。
スクリプト使わせていただきました。
あっという間にスッキリです拍手
ありがとうございました。
| Yuka | 2004/10/20 1:49 AM |
女Yuka様
コメントありがとうございます〜 こうして返事をいただけるのがイイ版の励みになります楽しい
| まめ | 2004/10/20 4:07 AM |
sb仮運用サイトにseiko様から以下のコメントがありましたので転載およびレスします。
『はじめまして、こんにちわ。お邪魔致します。

この度、私もJUGEMからsbに移り、その際カテゴリーを細分化したのですが、やはりツリー化を導入していた事で、カテゴリーの表記の仕方が他のものと違ってしまっていたのでどうしたらよいのかなあ、と思っていた所でしたので、こちらさまの記事を拝見してとても嬉しく思った次第です。
先ずは、こちら様のスクリプトをお借りいたしました。ありがとうございます。

さて、元々JUGEMの時のテンプレを持ってきておりまして、先も申しましたお通りツリー化をしていたのですが、大カテゴリ、小カテゴリとはしておりませんでしたので、こちらのスクリプトをコピー&ペースト致しましたが、アーカイブのツリー化(こちらもまだ未設定でした)は反映されたのですが、カテゴリーの方がどうにも反映されません。
何度も貼りなおしをしてみたのですが・・・。
どこが間違っているか、すらわからなくなってしまい、書き込ませて頂きました。
どうぞ、お力添えを頂けたら嬉しいと思います。
よろしくお願いいたします。

初見で長々と申し訳ありませんでした。 』

はい。コード掲載時にミスがあり、修正する必要があった1行が非表示になっていました。その行は無くなっても実運用上問題はないため、うちのスクリプトを(修正が不要な部分も含めて)コピーした場合は問題ないのですが、修正箇所のみをきちんと入れた人は、抜けた部分の修正が無いため、カテゴリの処理が行われない場合がありました;;

ですので、コードの修正箇所を表示されるように直しました。お手数をおかけして申し訳ありませんが、差し替えのほどお願い致します。
| まめ | 2004/10/20 8:43 AM |
こんにちわ、まめさま。
こちらに転載してくださり、そしてレスをありがとうございました。
また、sb仮運用サイトにはコメントを控えなくてはいけなかったのに気が付きませんで、本当にお手数をお掛けしまして申し訳ありませんでした。
早速、修正版の方をコピペさせて頂いた結果、無事カテゴリー、サブカテゴリーのツリー化が出来ました。
本当にありがとうございました。

まだまだこういったカスタマイズの部分ではこのようにスクリプトなどを配布して下さるまめさまや皆さまのお力がないとどうにも出来ない私ですが、すばやく対処してくださって本当に嬉しかったです。
お忙しいとは思いますが、これからもどうぞ頑張って下さい。
この度は本当にありがとうございました。
| seiko | 2004/10/20 12:27 PM |
まめさま、はじめまして。
sbのカテゴリーが、ツリー化されなくて見苦しかったのですが、こちらのスクリプトを使わせていただいて、スッキリまとまりました。
こんなに便利なものを作っていただいて感謝です。ありがとうございます。
他のスクリプトも使わせていただこうと思っていますので、これからもどうぞよろしくお願いいたします。
| ばす | 2004/10/21 10:54 PM |
女ぱす様
コメントありがとうございます。うちのスクリプトで不明な点がありましたらご連絡下さい。また、JUGEM向けに作成したスクリプトはすべてそのままで動くわけではありませんので、確認されるのであれば
http://mamejiro.jugem.cc/?eid=240
をご覧下さい。
| まめ | 2004/10/22 1:07 AM |
こんにちは、はじめまして。
いつも色々と参考にさせていただいています。
今回ツリー化スクリプトの後に、
http://nz.jugemers.net/log/eid42.html
こちらの一覧表示のスクリプトを導入しました。
すると、トップに表示されるはずのカテゴリ名が、一瞬表示された後に
すぐ消えてしまいます。
ツリーのスクリプトを消すとうまく動作します。

このカスタマイズの記事のコメント欄に私と同じようになってる人の投稿があり、
対策も書いてあったのですが、これをやったところソースがそのままでてしまいます。
ツリー化スクリプトが別のものだからなのかな?と考え、
恐縮ですがこちらへ質問に参りました。

共用する方法がありましたら、ご教示ください。
よろしくおねがいします汗
| けいこ | 2004/11/10 2:14 PM |
女けいこ様
 一瞬表示されるというのは今まで無かったかと思いますし、スクリプトの修正はすべて反映されていますので、問題はないかと思うのですが。
 情報が少ないので、判断が難しいのですが・・・
 あと、この記事はsbというブログツールを使用した物で、JUGEM用は別になります。あと、ブラウザがOperaでの動作確認は記事掲載時は行っていません。
 以上を元に、問題がないようでしたら、こちらで検証したいのでスクリプトを適用したテンプレートのURLを教えていただけないでしょうか?
| まめ | 2004/11/10 8:47 PM |
追記
ソースがそのまま表示されているのであれば、takkyun様のツリー化スクリプトを入れた上でのコード置き換えを行われているのでしょうか?
あくまでこのスクリプトはtakkyun様のツリー化スクリプトの機能増強版ですので、まずそちらを確認してください。
| まめ | 2004/11/10 11:30 PM |
まめさん。こんばんは。
先日はjugemのカスタマイズでお世話になりました。が、レンタルサーバー設置を思い立ち、sbを導入するに当たり、またまた、スクリプトでお世話になることになりました。設置は、色々勘ぐりすぎてずいぶん苦労しましたが、見ていただければ分かりますが、うまく設置に成功しました。今後もこのBLOG参考にさせていただきますので、よろしくお願い致します。
| たるたる | 2004/11/11 12:58 AM |
お返事ありがとうございました。
私の設置したスクリプトはSBです。
経過をわかりやすく書き直しますと、

1 まめさまのツリー化スクリプト導入
2 takkyunさまのタイトル一覧スクリプト導入
3 カテゴリ名が一瞬しか表示されない事に気づく
4 タイトル一覧スクリプトのコメントに、私と同じ症状の人が
5 takyun氏の書いた対策をとるが、うまくいかず
  ツリー化スクリプトの違いかな?と思いまめさまに相談

こんな感じです。まめさまに相談するのは筋違いですね〜。
すいませんでした。

ちなみに、タイトル一覧は一見タイトルのみ表示されますが、
表示されていないだけでソースには全部の記事が表示されています。
JUGEM用のものでもそのまま使えたらいいな〜と思って試してみましたが、
なかなか知識がないとうまくいかないものですね><
一応該当URLもはってみます。
| けいこ | 2004/11/11 9:59 PM |
女けいこ様
状況がわかりました。同じ症状というのはJUGEMカスタマイズ講座のことだったんですね。
>表示されていないだけでソースには全部の記事が表示されています。
これは、しょうがありません。JavaScriptは、ブラウザで動作するので、読み込むデータはJavaScriptを追加しても変わりません。タイトル一覧スクリプトも普通は表示される記事をスクリプトで表示しないようにしているだけであり、サーバからは記事すべてが送られてきているのです。
| まめ | 2004/11/11 10:19 PM |
なるほど〜理解できました。
JUGEMで設置している方のソースも覗いて確認したつもりでいたのですが、何せ知識不足でした><
もうちょっと頑張って色々試してみます。
本当にどうもありがとうございました^^
| けいこ | 2004/11/11 11:06 PM |
コメントする









この記事のトラックバックURL
http://mamejiro.jugem.cc/trackback/250
トラックバック
SB奮闘記 [ツリー化編2]
昨夜うまくいかなかったサブカテゴリーのツリー化スクリプト!ついに導入成功です!まめさまがわざわざ新しいスクリプトが出来たことをお知らせ下さったのです!ワーイ!!まめさまってなんていい人なのかしら… アタ...
| Suitabirity | 2004/10/14 2:29 PM |
またまたカスタマイズ。
今日は、2つの機能を追加してみました。まず1つめstroll:blogさんの記事、コメント&トラックバックの編集ページへのリンクを作成する(sb用)これのよさは、まだ実感してないんだけどこれからじっくりと感じていけれ...
| Ayaka's blog | 2004/10/14 3:52 PM |
サブカテゴリがステキ♪
Yukaさん経由でまめの一言様の『ツリー化スクリプトのカテゴリ・アーカイブ対応 sbサブカテゴリ対応版』にチャレンジしました〜♪Yuka様、まめ様いつもありがとうございますですヽ(´▽`)/
| Clunky days | 2004/10/21 11:49 PM |
サブカテゴリーー♪
実は、サブカテゴリーってどないして使うの?何それ?・・・って思って私。( ̄∀ ̄*)イヒッそれを「お〜〜♪なるぅ〜♪いいじゃーん♪」と思わせてくれたのがハルしゃんでした。。(笑) ありがとぉ〜♪(普通は分かる...
| MARBLE | 2004/10/22 11:12 PM |
サイドバーをツリー化
サイドバーの記事を、まめの一言さんの、【スクリプト】ツリー化スクリプトのカテゴリ・アーカイブ対応 sbサブカテゴリ対応版にしたがってツリー化しました。しかし、sbのサブカテゴリーって便利ですね。
| Here and There @ sb | 2004/10/31 7:50 PM |
またまたsbいじり
まめの一言 | 【スクリプト】ツリー化スクリプトのカテゴリ・アーカイブ対応 sbサブカテゴリ対応版とstroll::blog | sb絵文字入力支援スクリプトを導入してみましたうまく動いているでしょうかstrollさん、豆じろ...
| LOVE!? | 2004/10/31 11:42 PM |
ツリー化スクリプトのカテゴリ・アーカイブ対応 sbサブカテゴリ対応版
まめの一言 | 【スクリプト】ツリー化スクリプトのカテゴリ・アーカイブ対応 sbサブカテゴリ対応版ツリー画像をしようする場合は、ツリー化カスタマイズ応用編を参照のこと。すっきりさせるにはこれ
| easy as pie...vol.2 | 2004/12/25 12:29 PM |