注目タグ

テンプレート・プラグイン

トピック詳細

コメントのツリー化

旧フォーラムの記事です http://blog.fc2.com/forum/viewtopic.php?f=3& t=10542
bazagoza 2006-05-26 23:15:48
件名 :コメントのツリー化

OS:WinXP
ブラウザ環境: Internet Explorer
使用テンプレート名: arrow_o (公式テンプレートを3カラム化してカスタマイズ)
ブログURL: http://bazago za.blog50.fc2.com/
アダルトか否か:一般

こちらの質問掲示板でお世話になりながらブログカスタマイズをしているものです。

以前にもコメントのツリー化スクリプトで洵さんの修正スクリプト

[リンク:http://webbingstudio.blog10.fc2.com/blog-entry-277.ht ml]http://webbingstudio.blog10.fc2.com/blog-entry-277.html[/ リンク]

をお借りしてつくることコメントをツリー化したのですが、今回コメントのツリー元の親記事部分だけでなく、枝であるひとつひ とつのコメントにもリンクして見れるようにしたいなと考えています。どのようにすればできるのでしょうか?

またコメントのツリー元の親記事部分の最初が空白で一文字分くらい空いてるのですが左詰めにしてそろえるにはどうしたらよい でしょうか?

コメント部分HTML

<div id="commentlist">


<%rcomment_etitle><br><a href="<%rco mment_link>#comment"><%rcomment_name>: < %rcomment_title> (<%rcomment_month>/<%rcomment_d ay>)</a>


</div>



コメント部分CSS

#commentlist {
font-size: 85%;
margin: 0 0 0 -5px;
padding: 0.7em;
}

#commentlist li {
list-style-type: none;
}


わかる方いらっさいましたら教えてください。よろしくお願いします。

2006年05月26日 23:15  by FC2スタッフ

コメント一覧 10件中、1~10件表示

  • 旧フォーラムの記事です
    Anonymous 2006-05-31 19:40:03
    件名 :

    うわー、ありがとうございます! きれいに文字のバランスもなおり、「→」もなくなり感謝感激です(;つД`)
    chakoさん、sugarさん、未登録ユーザーさんご親切にアドバイスいただき、本当にありがとうございます

    2006年05月31日 19:40 by FC2スタッフ

  • 旧フォーラムの記事です
    Anonymous 2006-05-31 17:48:50
    件名 :

    CSSの末尾に以下の記述を。

    #commentlist ul li, #trackbacklist ul li &#123;
    background: none;
    padding-left: .5em;
    &#125;
    #navi ul ul &#123;
    font-size: 100%;
    &#125;

    padding-left はお好みで。

    2006年05月31日 17:48 by FC2スタッフ

  • 旧フォーラムの記事です
    Anonymous 2006-05-31 16:49:23
    件名 :

    Sugarさんのアドバイスに従い、公式テンプレートの「skin14」や「cfdn_13」、「hananeko」などを ダウンロードしてみてCSSの* Make Tree List Plug-Inの部分を参考にして格闘してました。

    自分の考えてるようなツリー化のかたちみたいなものはできたのですが、CSS部分の書き方がよくわからないため、文字の大き さのバランスをどうやって直したらいいのかがわかりません。

    またコメントの親記事部分の頭につく「→」もとりはらいたいのですが、これもとる方法がわかりません。

    このような何度も拙い質問で申し訳ないのですが、よろしかったら直し方について教えてくださいませ(;つД`)

    /* サイドメニュー内のツリー化 */
    #commentlist ul, #trackbacklist ul {
    margin : 0;
    padding : 0;
    list-style-type : none;
    }
    #commentlist ul.list-tree, #trackbacklist ul.list-tree {
    margin : 1em 0;
    }
    #commentlist ul li ul li, #trackbacklist ul li ul li {
    margin : 0;
    padding-left : 20px;
    background : transparent url("http://blog50.fc2.com/b /bazagoza/file/tree_lst_dotted.gif") top left no-repeat ;
    }
    #commentlist ul li ul li.lastchild, #trackbacklist ul li ul li.lastchild {
    background : transparent url("http://blog50.fc2.com/b /bazagoza/file/tree_end_dotted.gif") top left no-repeat ;
    }



    /* コメントリストの設定 */
    h3#commenthead, h3#trackbackhead {
    font-size: 12px;
    line-height: 1;
    font-weight: bold;
    color: #FFF;
    text-transform: uppercase;
    margin: 5px 0;
    padding: 6px 0 6px 25px;
    background: url(<a class="postlink" href=&quo t;http://blog1.fc2.com/template/arrow_o/image/commenthead.jp g">http://blog1.fc2.com/template/arrow_o/i ... nthea d.jpg</a>) no-repeat;
    border-width: 0;
    }

    #commentlist {
    margin: 0 0 0 -5px;
    padding: 0.7em;
    }


    以上のへんが該当部分にあたるとおもうのですが、宜しくお願いします(;つД`)

    2006年05月31日 16:49 by FC2スタッフ

  • 旧フォーラムの記事です
    sugar 2006-05-29 22:11:56
    件名 :

    公式テンプレートの「skin14」や「cfdn_13」などの【萌え系イラストシリーズ】にも、
    このスクリプトが導入されていますので参考にされるとよいと思います。
    (左詰めなども...)


    Chakoさんの示してくださったテンプレートはご覧になりましたか?
    どちらも白なので、ここでは公式hananekoでつかわれているgifを出しますが


    こういう画像をつかっています。

    CSSの* Make Tree List Plug-Inの部分を参考にしてみてください。

    2006年05月29日 22:11 by sugar & FC2blog beauties

  • 旧フォーラムの記事です
    Anonymous 2006-05-29 21:48:38
    件名 :

    sugarさんコメントありがとうございます。文字が小さくなってるのはバグかとおもってました。。。

    自分の考えてたツリー化は、

    http://uzuran.name/

    のようなツリー元の親記事も枝のコメントもリンクがあって、かつツリーのかたちが線で表記されている、このようなものをイメ ージしておりました。

    このようにするにはどうしたらよいでしょうか?

    2006年05月29日 21:48 by FC2スタッフ

  • 旧フォーラムの記事です
    sugar 2006-05-29 08:35:17
    件名 :

    こんにちは。

    どうにもバグってしまってます。
    どう不具合がありますか?

    私の環境(Mac Safari/Firefox)では問題なく、親記事にもコメントにも指定の場所にリンクできているよう ですが……

    ※質問には関係ないですが、「最近のコメント」の各コメントの表示部分の文字が豆文字になっていて非常に見辛いです。もう少 し大きくするか、この大きさなら、ゴシック体を指定した方がまだ見やすいかも……
    (MacSafari、Firefoxで文字の大きさは明朝体系のデフォルト16ptです)
    デフォルトフォントを明朝体にしているひとは少ないかもしれませんが……

    2006年05月29日 08:35 by sugar & FC2blog beauties

  • 旧フォーラムの記事です
    Anonymous 2006-05-29 08:25:42
    件名 :

    Chakoさんご丁寧な回答ありがとうございます。

    さっそくおっしゃるように説明をみながらツリー化のスクリプトをそっくり入れ替えてみたのですが・・・・

    どうにもバグってしまってます。どのようにしたら改善できるのかがわかりません。よろしかったら教えていただけませんか?( 'A`)

    2006年05月29日 08:25 by FC2スタッフ

  • 旧フォーラムの記事です
    Chako 2006-05-27 19:11:35
    件名 :

    自分の改良したいのはツリー元の親記事も、枝のコメント両方にリンクがつくようにしたいのです。

    スクリプトを修正すればできるのでしょうけど、ちょっとわかりません。

    でも、ワタシも使用させて頂いている「春木屋さん[/リン ク]」のスクリプトなら、ご希望どおりの表示になりますよ。
    [リンク:http://sug.blog2.fc2.com/blog-entry-272.html]http://s ug.blog2.fc2.com/blog-entry-272.html


    こちらに変更されるというのはどうでしょうか?

    クラス名などが変わってきますので、スタイルシートの記述も変更して下さいね。

    公式テンプレートの「skin14」や「cfdn_13」などの【萌え系イラストシリーズ】にも、
    このスクリプトが導入されていますので参考にされるとよいと思います。
    (左詰めなども...)


    ※新着マークの件は、過去ログにもいくつかありますので、検索されてそのトピックへの返信(または別トピック)でお願いでき ますか?

    2006年05月27日 19:11 by FC2スタッフ

  • 旧フォーラムの記事です
    Anonymous 2006-05-27 08:02:35
    件名 :

    chakoさんコメントありがとうございます。

    chakoさんのおっしゃるトピックを参考に全く同じようにスクリプトを変更してみたところ
    ツリー元の親記事のリンクがなくなったかわりに、枝のコメントにリンクがいくようになりました。

    自分の改良したいのはツリー元の親記事も、枝のコメント両方にリンクがつくようにしたいのです。

    またあれからコメントにNew!の新着マークもつけたくて

    http:/ /pcafe.blog3.fc2.com/blog-entry-120.html

    も参考にして

    head領域に

    <script type="text/javascript">New< /span>')}
    }
    --></script>


    CSSに

    .new {color:red; font-weight:bolder;}


    を書き加えたあと、


    <div id="commentlist">


    <%rcomment_etitle><br><a href="<%rco mment_link>#comment<%rcomment_no>" t itle="<%rcomment_body>"><%rcomment _name>: <%rcomment_title> (<%rcomment_month>/ <%rcomment_day>)</a>
    <script type="text/javascript">
    nw(<%rcomment_year>,<%rcomment_month>,<%rcom ment_day>,<%rcomment_hour>)
    </script>





    のように変更しましたが、新着マークもでてきませぬ('A`)

    よろしかったら左詰めの件もあわせておしえてくださいませ。

    2006年05月27日 08:02 by FC2スタッフ

  • 旧フォーラムの記事です
    Chako 2006-05-26 23:25:06
    件名 :

    ツリー表示後 のカスタマイズに付いて
    こちらのトピックを参考に、スクリプトを変更してみて下さい。

    2006年05月26日 23:25 by FC2スタッフ