デザイン変更(サブカテゴリ化完成?)

 ずっとやりたかったサブカテゴリ化、ようやく出来ました。
参考にさせていただいたのは、「Des notes de KOHtan」さまの記事
 なるほど、JavaScriptでカテゴリ名中の文字列検索して、それでサブカテゴリ表示するわけですねっ!
SeesaaにはMTみたいな所謂「サブカテゴリ」が無いので、こういう仕掛けを作らないとダメなわけなのですね。一生懸命タグ検索して、いじろうとしていた私…(^^;)
スクリプトの仕組みは、カテゴリ名を順に文字列検索して、カテゴリ名、サブカテゴリ名と分けて、ツリーの部品(頭文字)を付けて、HTMLに吐き出していくというもの。
王道といえば、王道ですが、実際に考え付くまでと、スクリプト書くのは別。拝見して、思わず「な~るほどっ!」と唸ってしまいました。
こちらのKOHさまのサイトを参考にして、いろいろスタイルを変えたり、折りたたみ式にしたり、結構皆さん発展させていらっしゃる。
「seesaa カテゴリ サブカテゴリ」でググるとざっとその辺りの情報が出てきます。
 私は、KOHさまのスクリプトを参考に、「:」で区切るようにして(KOHさまのスクリプトをそのままエディタにコピって、検索&置換で「>」を「:」を変更。更にカテゴリ単位のスタイルをCSSで変えてみました。
他にも確認しつつぼつぼつ弄る予定。これを使うと、他のコンテンツに結構楽にリンクできるので、便利っ!
スクリプト公開してくださったKOHさま!ありがとうございます揺れるハート


 蛇足ですが、私の場合に変更した部分。
スタイルシートに以下を追加。
(カテゴリのタイトル行のスタイル)
———————————————–
.category_title {
color:#000080;
font-weight:bolder;
width: 190px;
padding:3px 30px 1px 10px;
border-top:solid 1px #00B480;
border-bottom:solid 1px #00B480;
}
———————————————–
HTMLの変更部分
—–変更部分は赤字—————————-
//出力
var tmpHTML=””;
for(i=1;i<(category.length-1);i++){
if(subcategory[i]==null){
tmpHTML+=(“<span class=\”category_title\”>”+category[i]+”<br> </span><br>”);
}else{
if(category[i]!=category[i-1]) tmpHTML+=(“<span class=\”category_title\”>”+category[i]+”<br></span>“);
if(category[i]==category[i+1]){
———————————————–

よかったらシェアしてね!
  • URLをコピーしました!
  • URLをコピーしました!
目次