くぅたん日誌はこうして作られました。 くぅたん日誌のカスタマイズ全タグ紹介!
移転します!
リンクしてくださっている方には申し訳ありませんが、 本ブログは、 こちら に移転します。徐々に引っ越されていきます。
しばらくは、質問はこちらでOKですが、移転された項目については、移転先で質問してください。
(。-_-)ノ☆・゜::゜ヨロシク♪

(注1)初心者ヤプログ・ユーザのみ対応です。初めてカスタマイズする方は「1.」から順に読んでください。
(注2)素人なので難しい質問には答えられません。
(注3)あくまでもくぅたん日誌のカスタマイズ方法であって、これが全てではありません。
応用がんばってくださいね!
免責!!カスタマイズは自己責任です。いかなる場合でも当方では責任は負いかねますのでご了承の上、カスタマイズしてください。

スポンサーサイト

上記の広告は1ヶ月以上更新のないブログに表示されています。
新しい記事を書く事で広告が消せます。
  1. --/--/--(--) --:--:--|
  2. スポンサー広告|
  3. トラックバック(-)|
  4. コメント(-)

32.最新コメント欄をツリー化しよう!

o(~o~;):ハァハァ・・!!
ここまできちゃいましたか。。

初心者なのに皆さんすごいですねぇぇぇぇ
(*・・)"ヾ('▽'*)良い子♪良い子♪

ここでも、コピーすりゃできちゃうツリー化方法を説明しますですねぇぇぇぇ
エイエイ (ι´Д`)ノ オー!!

なお、この説明は、

ここ

を参考にして書かれています。
自分で作成したわけではないので、
もしかすると、第三者配布禁止されるかもしれないので、
その場合、以下の説明は突然削除されますので、
参照先のリンクをたどってがんばってくださいねぇぇ。。

じゃ、本題にはいりまっしょぃ!



まずは、サイドバーの機能追加・編集で、
「27.」で作成した「JAVA」を選択して、編集画面にしてください。

んで、次の文を追加してください。

追記20050423

申し訳ありません。以下のタグを修正しました。
ツリー化できないじゃん!って思われた方、
ほんとにごめんちゃいm( __ __ )m


<!-- ツリー化スクリプト:始 -->
<script type="text/javascript"><!--
function makeTreeElements (idName,objList) {
if (!objList.innerHTML) return;
var objLink = objList.getElementsByTagName('a')[0];
var linkUrl = objLink.getAttribute('href');
if (idName.indexOf('comment') > -1 ) {
var tmpText = objList.innerHTML.split("⇒");
tmpText[0] = tmpText[0].slice(0,tmpText[0].search(/<BR/i));
this.base = tmpText[0];
this.elem = tmpText[1];
} else if (idName.indexOf('entry') > -1) {
var tmpText = objList.innerHTML;
tmpText.match(/\((\d\d\/\d\d)\)/);
this.base = RegExp.$1;
this.elem = Array('<a href="',linkUrl,'">',objLink.innerHTML,'</a>').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 (i=0;i<objLists.length;i++) {
var chckFlag = true;
var elemText = new makeTreeElements(idName,objLists[i]);
if (!elemText.base || !elemText.elem) return;
for (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 (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 (j=0;j<linkList[i].length;j++) {
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('');
}
}
}
var gTreeOption = new Array;
gTreeOption['sort'] = false; /* ツリー内の表示順 true:並び替える false:そのまま */
gTreeOption['list'] = ' '; /* ツリー用マーク(通常) */
gTreeOption['end'] = ' '; /* ツリー用マーク(末端) */
gTreeOption['leef'] = '<br />\n'; /* 各枝の末尾 */
gTreeOption['top'] = '<br />\n'; /* ツリー本体の最初 */
gTreeOption['btm'] = ''; /* ツリー本体の最後 */
createTreeList('newentrylist',gTreeOption); // 最新エントリリストのツリー化
createTreeList('entrylist',gTreeOption); // エントリリストのツリー化
createTreeList('commentlist',gTreeOption); // 最新コメントリストのツリー化
createTreeList('tblist',gTreeOption); // 最新トラックバックリストのツリー化
// -->
</script>
<!-- ツリー化スクリプト:終 -->

赤字部分は、好きなように変えてくださいねぇぇ!

んで、さらに、「30.」で作成した次の文を、

<div class="side_title">最新コメント</div>
<div class="side_text">

次のように桃字部分を追加してください。

<div class="side_title" id=commentname>最新コメント</div>
<div class="side_text" id=commentlist>

以上で、ツリー化できてるはずですよん。。
どうですか???
ヽ(=´▽`=)ノ

スポンサーサイト
  1. 2005/04/18(月) 15:03:35|
  2. カスタマイズ|
  3. トラックバック:0|
  4. コメント:11
<<31.最新トラックバック欄を自作してみよう! | ホーム | 33.更新マークをつけよう!>>

コメント

ありがとうございます!!

無事左に寄りました。
お手数かけてすみません。
そしてご丁寧にありがとうございました!!
  1. 2005/09/19(月) 21:51:53 |
  2. URL |
  3. Hatch #aXfvgWeY
  4. [ 編集]

Hatchさんへ2

えと、
スタイルシートに次の文を追加してみてください。

ul
{
margin:0px;
padding: 0px 0px 0px 20px;
list-style: circle URL(http://yaplog.jp/blog/template/29/img/icon.gif);
}
li
{
 margin: 0px 0px;
   line-height: 140%;
}

ちなみに、URLの部分は好きなマークに変えてください。

URL(http://yaplog.jp/blog/template/29/img/icon.gif)

を削除でもよいです。
  1. 2005/09/19(月) 21:03:41 |
  2. URL |
  3. あにぃ #RRPcnItQ
  4. [ 編集]

度々すみません。
<div class="side_text"> を消しても左に寄りません。
何度も申し訳ないのですが、お願いします。
  1. 2005/09/19(月) 18:35:28 |
  2. URL |
  3. Hatch #aXfvgWeY
  4. [ 編集]

Hatchさんへ

えと、とりあえず、

<div class="side" style="margin-bottom:10px;">
<div class="side_title" id=commentname>最新コメント</div>
<div class="side_text" id=commentlist>
<div class="side_text">

ってサイドバーの文から、

<div class="side_text">

が余分なので、削除してください。。
だめだったら、
また連絡くださいませませ。。
(*- -)(*_ _)ペコリ

  1. 2005/09/18(日) 23:15:58 |
  2. URL |
  3. あにぃ #RRPcnItQ
  4. [ 編集]

初めまして

友達のブログを見てこちらにたどり着きました。
いきなり質問で申し訳ないのですが、
コメントのツリー化には成功したのですが、
ツリーを左寄せにするにはどうしたらいいのでしょうか??
今は真ん中に表示されているのですが、
どうしても左に寄らないので、質問しました。
  1. 2005/09/18(日) 16:22:14 |
  2. URL |
  3. Hatch #aXfvgWeY
  4. [ 編集]

(@'ω'@)ん?

ブログリストのスクロールバーはできたんだよね??
???r(・x・。)アレ???
ツリー化の画像は、前の質問にもあったから
そっちにレスしたですよん。
m(。_。;))m ペコペコ…
  1. 2005/05/19(木) 20:35:35 |
  2. URL |
  3. あにぃ #RRPcnItQ
  4. [ 編集]

お手数かけてすみません。

他はだいたいわかったのですが、
ブログリストのスクロールバーとツリー式の最新コメントの画像が出ないのがわかりません。
どうぞよろしくおねがいします。
  1. 2005/05/19(木) 11:14:33 |
  2. URL |
  3. #-
  4. [ 編集]

(´▽`) ホッ

無事できてよかったです!
【☆;:*:;☆オツカレサマ☆;:*:;☆ 】>c=( *^▽^)ゝ
  1. 2005/04/23(土) 23:06:25 |
  2. URL |
  3. あにぃ #RRPcnItQ
  4. [ 編集]

助かりました☆

あにぃさん、こんばんわ☆無事にコメントのツリー化できました☆本当に感謝です!
あたしだけだったらこんな知識ないのでカスタマイズもできなかったと思うので、本当に助かりました(≧▽≦)
  1. 2005/04/23(土) 21:49:05 |
  2. URL |
  3. けい #-
  4. [ 編集]

Σ(゜∇゜|||)はぁうっ!

ド━━━(゜ロ゜;)━━ン!!

ごめんちゃいm( __ __ )m
タグを間違ってました。。。
m(。_。;))m ペコペコ…

大変申し訳ないのですが、
貼りかえてくださいませませませませ~
(シ_ _)シ  ハハァーー
  1. 2005/04/23(土) 14:03:37 |
  2. URL |
  3. あにぃ #RRPcnItQ
  4. [ 編集]

あにぃさん、こんにちわ☆この前はとてもお世話になりました☆
またまた早速わからないところがでてきてしまったのですが、コメントをツリーかしたいんですが、うまくできないんです・・。お時間あるときにもしよろしければどうしたらよいか教えて下さいませ☆☆

ではでは♪
  1. 2005/04/23(土) 11:53:18 |
  2. URL |
  3. けい #-
  4. [ 編集]

コメントの投稿

管理者にだけ表示を許可する

トラックバック

トラックバックURLはこちら
http://10166.blog8.fc2.com/tb.php/33-e6778642
上記広告は1ヶ月以上更新のないブログに表示されています。新しい記事を書くことで広告を消せます。