--年--月--日

スポンサーサイト

上記の広告は1ヶ月以上更新のないブログに表示されています。
新しい記事を書く事で広告が消せます。
2006年05月29日

右サイドバーのメニューのツリー化する。(2)

「Recent Comments」(最近のコメント)、「Monthly Archives」(最近のトラックバック)を記事別にツリー化します。


このカスタマイズは、小粋空間yujiroさんの記事コメントリストを記事別にまとめて表示する for FC2 ブログを参考にさせていただきました。yujiroさん、どうもありがとうございました m(_ _)m

  1. FC2ブログにログインして、管理者ページの左サイドの「環境設定」の項目[テンプレートの設定]をクリックします。
  2. 「現在設定されているスタイル」の表の「編集」の欄の[ 修正 ]をクリックします。
  3. 「テンプレートの編集」にある、「HTMLの編集[テンプレート名]を編集しています。」の欄の中でクリックします。(この中であればカーソルはどこでも構いません。)
  4. [Ctrl]+[F]([Ctrl]キーを押しながら[F]キーを押す意味です。)で、検索ダイアログが開きますから、これにRecent Commentsと入力して、検索してください。
  5. <!-- 最近のコメント開始 -->から続く下のコードの赤字のコードを追加します。
    • 必ずバックアップしましょう!

     いつも書いてますが、編集する前に、必ずHTMLのコードをコピーして、「html_bk.txt」(例)のようにバックアップファイルを作成しておきましょう。間違って失敗しても、「html_bk.txt」の内容をコピペすれば、元に戻すことができますよ♪


    <!-- 最近のコメント開始 -->
    <div class="sidetitle">
    Recent Comments
    </div>
    <div class="side" id="commentlist">
    <!--rcomment-->
    <span><a href="<%rcomment_link>"><%rcomment_etitle></a></span><ul><li><a href="<%rcomment_link>#c<%rcomment_no>" title="<%rcomment_body>"><%rcomment_name></a> <%rcomment_month>/<%rcomment_day></li></ul>
    <!--/rcomment-->
    </div>
    <!-- 最近のコメント終了 -->
    <!-- 最近のトラックバック開始 -->
    <div class="sidetitle">
    Recent Trackbacks
    </div>
    <div class="side" id="trackbacklist">
    <!--rtrackback-->
    <span><a href="<%rtrackback_link>"><%rtrackback_etitle></a></span><ul><li><a href="<%rtrackback_link>#c<%rtrackback_no>" title="<%rtrackback_excerpt>"><%rtrackback_title></a><br /><%rtrackback_blog_name> <%rtrackback_month>/<%rtrackback_day></li></ul>
    <!--/rtrackback-->
    </div>
    <!-- 最近のトラックバック終了 -->
  6. この「テンプレートの編集」画面はそのまま残しておいて、yujiroさんの記事コメントリストを記事別にまとめて表示する for FC2 ブログを別ウィンドウ開いて、「2.」のスクリプトをコピーします。
  7. [Ctrl]+[F]([Ctrl]キーを押しながら[F]キーを押す意味です。)で、検索ダイアログが開きますから、これに/boxと入力して、検索してください。
  8. <!-- /box -->の下にスクリプトを貼り付けます。

    <br class="clear" />


    <div id="footer">Copyright ©2005-2006 yozoの気が向いたと記2.0 by FC2 BLOG All Rights Reserved.</div>
    </div><!-- /box -->
    <script type="text/javascript">
    function deleteTextNode(node) {
    if(node.parentNode != undefined){
    // node.parentNode.removeChild(node);
    }
    }
    function collateData(id) {
    var data = '';
    var counter = 0;
    var ul = new Array('');
    var li = new Array('');
    var flag;
    var elements = document.getElementById(id).getElementsByTagName('span');
    for (i = 0; i < elements.length; i++) {
    flag = false;
    for (j = 0; j < ul.length; j++) {
    if (ul[j] == elements[i].innerHTML) {
    flag = true;
    deleteTextNode(elements[i].nextSibling);
    li[j] += elements[i].nextSibling.innerHTML + '\n';
    }
    }
    if (!flag) {
    ul[counter] = elements[i].innerHTML;
    deleteTextNode(elements[i].nextSibling);
    if(li[counter] == undefined){
    li[counter] = elements[i].nextSibling.innerHTML + '\n';
    } else {
    li[counter] += elements[i].nextSibling.innerHTML + '\n';
    }
    counter++;
    }
    }
    for (i = 0; i < counter; i++) {
    data += '<span>'+ul[i]+'</span>';
    data += '<ul>'+li[i]+'</ul>';
    }
    document.getElementById(id).innerHTML = data;
    }
    collateData('commentlist');
    generateNormalTree("commentlist");
    collateData('trackbacklist');
    generateNormalTree("trackbacklist");

    </script>

    <script type="text/javascript">
    <!--
    var elements = document.getElementsByTagName('h2');

    ?省略?


    </script>

    </body>
    </html>


    collateData('commentlist');の下に、この3行を追加してください。
    collateData('commentlist');
    generateNormalTree("commentlist");
    collateData('trackbacklist');
    generateNormalTree("trackbacklist");

  9. [プレビュー]で確認して、[更新]をクリックしましょう。

  • yozoからのお願い
 この記事のやり方は、yozoが実際にやってみたことを書いているだけです。この記事のやり方だけしかないというものではありませんし、もっと簡単で、すばらしい方法もあると思います。この点をあらかじめご了承ください。
 また、言うまでもないことですが、この記事を参考にされるのでしたら、「テンプレート改造」は自己責任で行ってください。そして、必ずバックアップを取るようにしてくださいね♪
 この記事を参考にされた場合は、結果や感想を、CommentやTrackbackしていただけたら、うれしいです。もちろん、「これではおかしいのでは?」とか「こうしたほうが良い。」というご指摘やご指導もありがたく頂戴したいと思っています。よろしくご協力ください。 m(_ _)m

なお、このテンプレートは、小粋空間yujiroさん作成のFC2ブログテンプレートからお借りしたものです。

↓ ぽちっと応援お願いします♪ m(_ _)m
人気blogランキング

スポンサーサイト

スレッドテーマ:テンプレート:ブログ

メイン

≪New ニワトリが先か、卵が先か…? | Top | カラーパレット♪ Old≫

トラックバックURL


コメント

出来ない、出来ないと言っていたコメントのツリー化が出来たような気がする。
実はツリーになるにはきっと新記事へのコメントが必要かと思うので、次に新しい記事を書いたら確認しよう!(爆)
こちらでは随分とお世話になりました。ありがとう。>ってまだ未確認(^^;

コメント

ととろさん、こんにちはー♪
ツリー化できてましたね。オメデト(*^ー^*)∠※Pan!!。・:*:・
カレンダー部分もとてもきれいになっているし・・・CSSカスタマイズの腕を上げたのですね♪d(゚-^*) ナイス♪
yozoはぼちぼち・・・というか、コメント欄のURLがずれてますね。今から直しまーす(苦笑)

コメントする

お楽しみ:
サイト管理者にのみ通知する

チェックするとコメントプレビューがオンになります。

ご利用のブラウザ、設定ではご利用になれません。


上記広告は1ヶ月以上更新のないブログに表示されています。新しい記事を書くことで広告を消せます。