2005年08月30日

Blogカスタマイズ65〜コメント・トラックバック・カテゴリーのツリー化を設定(リニューアル版)〜

livedoor Blogがリニューアル版に移行された事で、今まで設定していた「Blogカスタマイズ59・60」の
コメント・トラックバックのツリー化ができなくなってしまったので、新たな設定方法にチャレンジしてみました。
今回は、コメント・トラックバックに加えて、カテゴリーのツリー化もまとめてできます。
(「弱小エンジニアの小言」さんを参考にさせて頂きました。感謝致します♪)

画像を使うと、テンプレートを変更する度にそれに合う画像をアップしなくてはならないので、
前回同様、画像は使わずに、投稿者名と同じ色になるように設定してみました。

とりあえず、私が設定した投稿者名の前に画像を使わないバージョンを書き記しておきたいと思います。(基本はその下にあります)

※livedoor Blogリニューアル後に作られたテンプレートでは、設定できないようです。
(全部を試したわけではないので、もしかしたら、使えるものもあるのかもしれませんが)

★トップページ・コメントのツリー化を設定

「ブログの設定/管理」→「プラグインの新規追加 」→「上級者向けプラグイン」→「フリーエリア」を作成します。

<script language="JavaScript"><!--

var commnets_div = GetPluginByTitle("最新コメント");
var comments_tree = CreateTreeDataFromComments(commnets_div);
var commenttd = new TreeDataObj(); // おまじない
commenttd.LeafTS = ' ・ ';
commenttd.LeafTSL = ' ・ ';
commenttd.LeafTE = '<br /">';
commenttd.LeafTEL = '';
commenttd.OutKey = 'モダチョキ';
commenttd.LeafOut = ' さん';
ConvertTree(comments_tree,commnets_div,commenttd);

var trackbacks_div = GetPluginByTitle("最新トラックバック");
var trackbacks_tree = CreateTreeDataFromTrackBacks(trackbacks_div);
var trackbacktd = new TreeDataObj(); // おまじない
trackbacktd.LeafTS = ' ・ ';
trackbacktd.LeafTSL = ' ・ ';
trackbacktd.LeafTE = '<br /">';
trackbacktd.LeafTEL = '';
ConvertTree(trackbacks_tree,trackbacks_div,trackbacktd);

// --></script>

上記のタグ内の太文字部分を自分のBlogの内容に合わせて書き換え、フリーエリアに貼り付け、保存します。
「プラグインの設定 」のフリーエリアの「順序」は、一番最後にします。(3カラムの設定の場合は「位置」の「B」の一番最後)
そして、最後に「再構築(全ページ)」をして完了。

var commnets_div = GetPluginByTitle("最新コメント"); ←プラグインのコメントのタイトル名
commenttd.LeafTS = ' ・ ';   ←投稿者名の前のデザイン(通常のツリーアイテム) 【例】「+」「├」「→」など。
commenttd.LeafTSL = ' ・ ';   ←投稿者名の前のデザイン(最下段のツリーアイテム)【例】「+」「└」「→」など。
commenttd.LeafTE = '<br /">';  ←投稿者名の後のデザイン
commenttd.LeafTEL = '';
commenttd.OutKey = 'モダチョキ'; ←自分の投稿者名の後ろに「さん」「様」付けない場合は、自分の投稿名を設定します。
commenttd.LeafOut = ' さん';   ←投稿者名の後に「さん」「様」などを付ける。

※私の場合は、カテゴリーの2段階目を設定していないので、その部分は削除しました。
 カテゴリーも追加する場合は、下の基本タグの中からコピーして下さい。


■基本のタグは下記になります。投稿者名の前に画像を使う場合はこちらを設定します。
 (下記の画像・javascriptは「弱小エンジニアの小言」さんが作られたものです。
  自分の画像を使う場合は、アップロードして書き換えます)

<style>
.key_area {
padding:0 0 0 10px;
text-align:left;
}
.key {
}
.leaf_area {
margin:3px 3px 3px 3px;
text-align:left;
}
.leaf {
padding:2px 2px 2px 18px;
margin:0;
background: url(http://image.blog.livedoor.jp/takoashi/tbm.gif) no-repeat;
}
.leaf_last {
padding:2px 2px 2px 18px;
margin:0;
background: url(http://image.blog.livedoor.jp/takoashi/tbe.gif) no-repeat;
}
</style>
<script type="text/javascript"
src="http://blog.livedoor.jp/takoashi/js/ConvertTree.js"></script>
<script language="JavaScript"><!--

var commnets_div = GetPluginByTitle("最新コメント");
var comments_tree = CreateTreeDataFromComments(commnets_div);
var commenttd = new TreeDataObj(); // おまじない
commenttd.OutKey = 'モダチョキ';
commenttd.LeafOut = ' さん';
ConvertTree(comments_tree,commnets_div,commenttd);

var trackbacks_div = GetPluginByTitle("最新トラックバック");
var trackbacks_tree = CreateTreeDataFromTrackBacks(trackbacks_div);
var trackbacktd = new TreeDataObj(); // おまじない
ConvertTree(trackbacks_tree,trackbacks_div,trackbacktd);

var cate_div = GetPluginByTitle("カテゴリー");
var cate_tree = CreateTreeDataFromCategories(cate_div,":");
var cate_td = new TreeDataObj(); // おまじない
cate_td.LeafTS = '';
cate_td.LeafTSL = '';
cate_td.LeafTE = ' / ';
cate_td.LeafTEL = '';
ConvertTree(cate_tree,cate_div,cate_td);

// --></script>



※カスタマイズ用のオブジェクトを設定することで自由にカスタマイズする事ができます。
設定は、タグ内の「// おまじない」の下です。

var commenttd = new TreeDataObj(); // おまじない ←これの下に設定します。

commenttd.KeyAS = '<div class="sidebody">';
commenttd.KeyAE = '</div>';
commenttd.KeyTS = '<div class="key">';
commenttd.KeyTE = '</div>';
commenttd.KeyTSN = '<div class="key">';
commenttd.KeyTEN = '</div>';
commenttd.LeafAS = '<div class="leaf_area">';
commenttd.LeafAE = '</div>';
commenttd.LeafTS = '<div class="leaf">';
commenttd.LeafTSL = '<div class="leaf_last">';
commenttd.LeafTE = '</div>';
commenttd.LeafTEL = '</div>';

commenttd.OutKey = 'モダチョキ';
commenttd.LeafOut = ' さん';

コメントのツリー化設定で例えると下記のような意味合いとなります。(いろいろ組み合わせて設定されています)

Key:コメントされた記事
Leaf:書いた人の名前
A:その全体を囲む領域(Area)
T:Keyでは 記事タイトル Leafでは、名前
S:開始タグ位置
E:終了タグ位置
L:Leafの最後という意味
N:名前がない場合(サブカテゴリ用なのでコメントでは必要ない)



 ■【堀江貴文・ホリエモンもオススメ!】 パソコン教室!397時間動画パソコン教室DVD4枚組!
   ホームページ作成、オフィス(ワード、エクセル、パワーポイント、アクセス)2003/2007、Photoshop、Illustrator、Dreamweaverなど
   29ジャンルが自宅で学べます!
 ■離婚大全集〜圧倒的有利に離婚する方法〜
   離婚経験者の専門家が、27冊の書籍やテレビでは語れない裏ワザがここに。
 ■運動なし!代謝を高めて無理なくやせるDLダイエットサポート 太らない身体が目標!
 ■【15秒筋トレ】自宅でお金をかけない肉体改造! 目標はゴリマッチョ?細マッチョ?
 ■1,353人のメガネ使用者がわずか3日で視力が1.0に!!見える!驚異の視力回復法 自宅で簡単に視力アップ!
 ■【ホリエモンブログ】で紹介されました!【せどり】でリッチ☆に!最強せどりツール【せどリッチforCD】
 ■ダウンロード販売と人と人をつなぐコミュニティ・コマースのインフォカート
 ■引っ越しを考えている方必見!すごいっ!
  ・全国賃貸情報【アパマンショップ】

  ・引越し一括見積もりサイトの決定版!【引越大手比較.com】

 ■ロリポップサーバーのドメインが65種類 → 85種類に!!初心者でも安心なサービスがあります♪

 ■ ダイエット商品人気ランキング
  この夏はみんなのオススメダイエットにチャレンジ!
 ■ラブコスメティックすごいっ!
  人に言えない身体の悩みをすっきり解決しましょう♪

よろしければ人気blogランキングにご協力を!

この記事へのトラックバックURL

  迷惑トラックバック対策のため、トラックバックはこちらでチェックした後、アップさせて頂いておりますので、ご了承下さい。

この記事へのコメント
モダチョキさんのブログもつい移行されたんですね(*^^*)
私のは、全然です・・・・。
もしかして、もう移行されてるんですかね??!!
その辺がよくわからなくて、なんとも言えません( ̄∇ ̄;)

このテンプレートかわいいですね☆☆
Posted by 炭茶 at 2005年08月30日 23:28
優先移行というのを受け付けていたので、早々に申し込んでおいたんですよ。
炭茶さんのところはまだみたいですね。
リニューアル版になると、カレンダーの月の左右に矢印が出るので、すぐに分かりますよ。

褒めて頂いてうれしいです♪
テンプレートの配布もリニューアルの移行と、他に色々やりたいこともあるのとで、
暫く止まってしまいました。(^ ^;)
Posted by モダチョキ at 2005年08月31日 00:51
ついにです。今朝サイトを見たら、リンク集の文字色が2色でチグハグしててなんだろうと思ったらリニューアルされてました^^ 3カラムも崩れずに、文字色とコメントのツリーが崩れててエラー表示が出てました。ココ見てやり直そうと思ったのですが、消したらエラー表示も消えたので辞めちゃいました^^; で、、変なんです。謎なんです。もしかしたら、移行前からなのかも知れないんですが、上のメニューバーの「大家族」だけ表示すると文字色が赤になってるんです。それと、カレンダーもカテゴリー、月別それぞれで表示されてるのがあったり、表示されてなかったりで・・???
気にしないと言えば気にならないんですが、どこかに不具合があるんでしょうか??

あまり気にしてないので;;;; 本当に暇な時でいいです・・

いつもご迷惑かけてます。

今日は「血と骨」借りてきました。
Posted by 大家族ママ ruru♪ at 2005年09月02日 23:12
ついにです。今朝サイトを見たら、リンク集の文字色が2色でチグハグしててなんだろうと思ったらリニューアルされてました^^ 3カラムも崩れずに、文字色とコメントのツリーが崩れててエラー表示が出てました。ココ見てやり直そうと思ったのですが、消したらエラー表示も消えたので辞めちゃいました^^; で、、変なんです。謎なんです。もしかしたら、移行前からなのかも知れないんですが、上のメニューバーの「大家族」だけ表示すると文字色が赤になってるんです。それと、カレンダーもカテゴリー、月別それぞれで表示されてるのがあったり、表示されてなかったりで・・???
気にしないと言えば気にならないんですが、どこかに不具合があるんでしょうか??

本当に暇な時で・・・いつもご迷惑かけてます。

今日は「血と骨」借りてきました。
Posted by 大家族ママ ruru♪ at 2005年09月02日 23:14
ようやくリニューアル版に移行されたんですね。
私の場合は、トップページのツリー化以外は大丈夫だったので、
殆ど直さなかったんですよ。
他のBlogでも崩れたところがあったみたいですが。
「血と骨」、私はまだ観ていないんですよ。
マリちゃんが出ているので、一度は観たいとは思っているのですが。(笑)
Posted by モダチョキ at 2005年09月03日 00:25
モダチョキさん こんばんわ。
泣きの入っているtamiです。

というのも、データの移行が始まったのですが
もう5日も経過しているのに完了しないんですよッ

そんなことってあるんでしょうか?
サイト側に問い合わせてはみたのですがまだ返事はなくて
モダチョキさんは何日で完了しましたか?o(TωT )( TωT)o

表示には「最大48時間」って書いてあるのに・・・。
容量があるのは嬉しいのですが…
開始の連絡メールとか
経過を確認できる手段とか
作ってほしいですよねぇ
(´・ω・`)ションボリ
Posted by tami* at 2005年09月12日 02:19
> tami*さん

livedoorからデータの移行のお知らせがきたんですか?
私の場合は、自分で申請をしてから、このBlogに関しては1日で移行されましたよ。
でも、あまりにも早いのと、他の2つのBlogはもっとかかったので、単なる偶然だったのかもしれませんが。(笑)
ちなみに、他のは一つは3、4日くらい、もう一つは1週間以上かかりました。
同じ時間に申請したんですけどね。
いろいろな苦情の返答もないようですし、
私も先日、個別記事のみの再構築を入れて欲しいと問い合わせたのですが、
全く返事はないですねー。
本当に、苦情をいう場所がないのは困りますよね。
(結局、「開発日誌」にみんな書き込んでいるようですし)
早く終わるといいですね。
Posted by モダチョキ at 2005年09月12日 02:52
こんにちわ、はじめまして
dogaと申します
この度blogサポートのサイトを立上げたのですが(正確には引継いだのですが)
サイト内でカスタマイズサイト紹介としてリンクを貼らせてもらいましたので報告にきました
御迷惑でしたら一報いただければ削除致します
Posted by doga at 2005年12月02日 12:20
> dogaさん

はじめまして!
こんなBlogをリンクして頂きまして、有難うございます!
Posted by モダチョキ at 2005年12月03日 02:37
またまたU*・人・*U ゴメンネ
モダチョキさん助けて〜

右のサイドバーの一番したのフリースペースに
何度はり直してもまったくツリー化しないの(T_☆U

コメント・トラックバック・カテゴリーの
スペースを縮小できるかと思ったんですが
何がいけないのでしょう?

いっつも(≧≦U) ゴメンヨー 
Posted by ちびっこギャングの相棒 at 2006年08月15日 13:28
> ちびっこギャングの相棒さん

貼り付けている内容が分からないので何とも言えませんが、
例えば、 'モダチョキ'; のモダチョキの文字の部分を変更する時に、
'' を消してしまったりとかしていませんか?
Posted by モダチョキ at 2006年08月15日 23:48
遅くなっちゃいました!

モダチョキさんの例のやつを
そのままコピって モファチョキ⇒ちびっこギャングの相棒
と自分のに名前を変更したんですが(T_☆U

もう一度見直してやってみます!
Posted by ちびっこギャングの相棒 at 2006年08月18日 23:50
> ちびっこギャングの相棒さん

最新コメント、最新トラックバック、カテゴリーの名称も変更されましたか?
ちびっこギャングの相棒さんの場合は、

最新コメント → コメントありがと♪♪
最新トラックバック → Recent TrackBacks
カテゴリー → カテゴリーヽ(^○^)ノ

となります。
Posted by モダチョキ at 2006年08月19日 08:17
<script language="JavaScript"><!--

var commnets_div = GetPluginByTitle("コメントありがと♪♪");
〜省略〜
commenttd.OutKey = 'ちびっこギャングの相棒';
〜省略〜
var trackbacks_div = GetPluginByTitle("Recent TrackBacks");
〜省略〜
var cate_div = GetPluginByTitle("カテゴリーヽ(^○^)ノ");
〜省略〜
// --></script>

長くなってU≧_≦U ゴメンネ
コレでやってみて再構築しましたが
やっぱりダメみたい〜
私めのデザインだと無理なのかなぁ?

でもとっても感謝してます♪
今回はあきらめましょーU−−。。
Posted by ちびっこギャングの相棒 at 2006年08月27日 00:14
> ちびっこギャングの相棒さん

こちらでも試してみましたが、
リニューアル後の新しいテンプレートではダメみたいですね。
(もしかしたら、できるものもあるのかもしれませんが、
ちびっこギャングの相棒さんのテンプレはダメでした)
カスタマイズできなくて残念!
Posted by モダチョキ at 2006年08月28日 04:09
モダチョキさん わざわざ調べて下さって
ほんとに。・:*:・(*´ー`*人U。・:*:・アリガト

でもまだまだ楽しく頑張ってカスタマイズするぞ〜!!
Posted by ちびっこギャングの相棒 at 2006年08月30日 01:12
> ちびっこギャングの相棒さん

カスタマイズって、結構ハマりますよね。頑張って下さい♪
Posted by モダチョキ at 2006年08月30日 01:18
(Cookieに投稿者情報を記憶します)
 
コメントをプレビューする
ご利用のブラウザの設定ではご利用になれません。