2005.02/ 07 [Mon]
カテゴリーのツリー化の手順
カテゴリーのツリー化に成功したので、せっかくだからFC2の掲示板に投稿しようと思ったんですが、文字数制限にひっかかったので、こっちに書いちゃいます。
どっかに書いておかないと自分も忘れちゃいそうなんで（＾＾；
ワンダとはあまり関係ないですが、お許しを…。
【作動確認済みテンプレート】
公式：black／blue／grave-bear／gray／rose／sofa／white／yellow／
共有：bluesky／cork_board／cute flower／ing-yang_2_big／kumo／ohirune2／post_it／sanyou3-gray／simple-brown／Simple3／white_book／
※うまくツリー化できたら、公式／共有を明記の上、テンプレート名と併せてコメントにて教えていただけたらうれしいです（≧∀≦）
※ご自身のブログでのこの記事の紹介
じゃんじゃん紹介
※現在、トラックバックは一時拒否しています。
ツリー化作業の前にひとつ。
作業が複雑ですので、完成するまで時間がかかります！
途中でメゲずに根気よく頑張ってください〜（￣∀￣；）ﾉ
よく聞かれるツリー化後のカスタマイズについても最後に載せてますので、参考までにどうぞ。
◆ツリー化後、行間を狭める方法と└が点線になる方法
◆大カテゴリーの［］の表示をなくしたい
◆大カテゴリーの太字設定を解除したい
◆スクリプト部分を外部から呼び出すように設定したい。
▼▽▼ツリー化手順はここから▼▽▼
【はじめに】
カテゴリーのツリー化は、「管理者ページ」の
環境設定≫テンプレートの設定の画面で行います。
ツリー化したいテンプレート名の右側の[編集]をクリックすると、そのテンプレートのHTML編集画面になります。
そのHTMLをちょちょちょいっといじるとツリー化ができてしまうという、とてもステキなスクリプトがあるのです。
利用するのは、JUGEMで超有名なJUGEMカスタマイズ講座の「ツリー化スクリプト ver 2」です。
これをFC2用に改造します。
【手順】
[1]JavaScriptをHTMLに挿入
[2]JavaScriptを改造
[3]HTMLに追記
[4]独自ログのソースを修正
[5]カテゴリーの編集
【参考サイト】
Ａ）ツリー化スクリプト ver 2［JUGEMカスタマイズ講座］
Ｂ）【カスタム】ツリー化スクリプトのカテゴリ・アーカイブ対応［まめの一言（JUGEM出張所）］
Ｃ）クリスマスツリーに肖ってツリー化の手引き［ヒヨコ君増殖中 愛 FC2版］
［１］まず、環境設定≫テンプレートの編集から、ツリー化したいテンプレートのHTMLを開いてください。
htmlテンプレートの最後の方にある、</body>の直前にＡのページに載っているJavaScriptを挿入します。
背景が水色になっている部分の<script type="text/javascript">から</script>までのすべてをコピペ（コピー＆貼り付け）してください。
［２］つぎに、いま挿入したスクリプトを改造します。
Ｂのページに載っている青字の部分を挿入して下さい。
場所を間違えないように注意！（＞＿＜）
［３］テンプレートのHTMLに、カテゴリの呼び出しを追記します。
赤字の部分を追記して下さい。
createTreeList('newentrylist',gTreeOption); // 最新エントリリストのツリー化
createTreeList('entrylist',gTreeOption); // エントリリストのツリー化
createTreeList('commentlist',gTreeOption); // 最新コメントリストのツリー化
createTreeList('tblist',gTreeOption); // 最新トラックバックリストのツリー化
createTreeList('linklist',gTreeOption); // リンクリストのツリー化
createTreeList('categorylist',gTreeOption); // カテゴリリストのツリー化
［４］最後に、独自ログのソースを修正します。
▼フラグイン非対応のテンプレートの場合▼
カテゴリー部分の
<ul>
<!--category-->
<li><a href="<%category_link>" title="<%category_name>"><%category_name> (<%category_count>)</a></li>
<!--/category-->
</ul>
の部分を
と修正して下さい。<div id="categorylist">
<ul>
<!--category-->
<li><a href="<%category_link>"><%category_name>(<%category_count>)</a></li>
<!--/category-->
</ul>
</div>
そのままコピペで大丈夫です（タグはいじらなくてもOKです。）
テンプレート部分の作業はこれで終わりです。
最後に「更新」ボタンを押すのをお忘れなく。。。（笑）
▼プラグイン対応のテンプレートの場合▼
HTMLでのタグ変更に加え、プラグインの編集での作業が必要となります。
「▼フラグイン非対応のテンプレートの場合▼」でのHTML変更を行なった後、管理者ページの
プラグイン設定＞プラグインの編集＞カテゴリー＞HTML編集
を開いて、ソースを以下のものと置き換えてください。
<div id="categorylist">
<ul>
<!--category-->
<li><a href="<%category_link>"><%category_name>(<%category_count>)</a></li>
<!--/category-->
</ul>
</div>
［５］最後に、カテゴリーを編集します。
カテゴリーの登録・編集は、
管理者ページ＞環境設定＞カテゴリーの編集
で行ないます。※テンプレートのHTMLはいじらなくてもよいです。
カテゴリーの編集で、各カテゴリーを［大カテゴリー］サブカテゴリーという風に登録します。
[ ]は半角で統一します。
たとえば、
というふうにカテゴリーの登録をおなった場合、[ゲーム]PS・PS2
[ゲーム]GB・NDS
[ゲーム]ゲーム音楽
[エンターテイメント]映画
[エンターテイメント]マンガ
[エンターテイメント]アニメ
と、表示されるようになります。[ゲーム]
⇒PS・PS2
⇒GB・NDS
⇒ゲーム音楽
[エンターテイメント]
⇒映画
⇒マンガ
⇒アニメ
※すべてのカテゴリーが[大カテゴリー]サブカテゴリというスタイルで登録されていないと、ツリー化で表示されません。
以上で、カテゴリーのツリー化の手順は終了です。
わたしは
とりあえず、公式テンプレート[grave-bear]で確認しましたが、このテンプレートでは問題ないようです。
なにかご質問がありましたら全力で答えれるように努力しますが、なにぶんHTML初心者なのもので、答えられないこともあると思います。。。ごめんなさい。
詳しい方に教えていただけたら、ほんとうに助かります。
［2005/2/16追記］
たまにツリー化がうまくいかない方がいるみたいです。。。
原因としては、「カテゴリの登録の不具合」が一番可能性が高いと思います。
その場合は、すべての[]が半角モードで入力されているかを確認してみてください。
カテゴリ「未分類」も『[大カテゴリ]サブカテゴリ』のスタイルで登録するのを忘れないでくださいね。
［8/31追記］
▼質問・コメント下さった皆さまへ▼
各テンプレートでツリー化が正しく表示されるのかは、わたし一人では到底確認できないので（だってテンプレートが900以上あるんですもん：汗）、ビジターの方々に自力作業をさせてしまって申し訳ないなぁと思ってます。。。
ですが、こればっかりはご勘弁を！
ほんとに一人では確認無理なので（＞＿＜）
さらに、わたし自身HTML、スクリプトともに知識はほぼゼロなので、的確なアドバイスができなくて申し訳ありません。
ツリー化手順を公開はしていますが、じつは「なぜにこのスクリプトでツリー化できるのか」という理論はまったく分かっていなかったりします（；＿；）
「にこに聞いても無理じゃね？」
という内容の質問は、サポート掲示板の玄人の皆様に伺っていただいたほうが、早く解決すると思います。
お手数かけますが、質問する場合はこのエントリーのコメントと合わせて、FC2ブログのサポート掲示板のほうにも質問をしていただけると幸いですｍ（＿ ＿）ｍ
FC2ブログサポート掲示板
FC2ブログサポート掲示板＞カスタマイズ掲示板
［2005/9/3追記］
プラグイン対応のテンプレートを利用する場合、［４］の作業において
管理者ページ＞環境設定＞カテゴリーの編集
での編集も必要となります。（みいなさまより：Thasnks!）
》プラグイン機能についてはコチラを参照
※現在、公式テンプレートはすべてプラグイン対応です。
「プラグイン対応のテンプレートでツリー化できない」と悪戦苦闘している方は、こちらの作業も忘れずに行なってください。
[2006/1/24追記]
カスタム掲示板で、ツリー化に関して色々な質問が出ているので答えられる範囲で補足です（＾＾；
◆ツリー化後、行間を狭める方法と└が点線になる方法
⇒ JUGEMカスタマイズ講座に説明がありますので、ワード検索をして編集作業を行なってください。
◆大カテゴリーの［］の表示をなくしたい
⇒ツリー化スクリプトの中に
となっている部分が何箇所かあるので、そのすべての赤字の部分を消してください。('<strong>[',RegExp.$1,']</strong>')
◆大カテゴリーの太字設定を解除したい
⇒ツリー化スクリプトの中に
となっている部分が何箇所かあるので、そのすべての赤字の部分を消してください。('<strong>[',RegExp.$1,']</strong>')
◆スクリプト部分を外部から呼び出すように設定したい。
⇒klericさんのブログで外部javascriptファイルを読み込むように設定する方法が紹介されていますので、そちらをご参照ください。
- at 13:57
- [[ブログ]カスタマイズ]
- TB(-) |
- COM(216) |
- *Top
有り難うございます
カテゴリーのツリー化 上手くいきました これもNICO（ニコ）さんのお陰です
お陰で使いやすくなったと好評です <(_ _)>