エントリー本文
新着コメントに New マークをつける
「コメント投稿後×時間以内」という指定により任意のテキストまたは画像を指定したリストに表示することができます。JavaScript で書きましたのでテンプレートにタグを追加するだけで動作します。また JavaScript OFF の場合は何も表示されないようにしています。Windows2000/XPのIE6.0・Firefox1.0・Opera8.0で動作確認しています。 動作はコメントの投稿時間をコメントタグで予め表示させておき、後から JavaScript でその投稿時間を取得し、現在時刻との差を計算して指定時間以内であればテキストまたは画像を表示するという仕組みです。 |
１．テンプレートの修正
１．１ 公開テンプレートの場合
「最近のコメント」タグに下記のように青色部分を追加します。
<!-- 最近のコメント開始 -->
<div class="sidetitle">
Recent Comments
</div>
<div class="side">
<MTEntries recently_commented_on="5">
<a href="<$MTEntryLink$>"><MTEntryTitle></a>
<br />
<MTComments lastn="5">
└ <a href="<$MTEntryLink$>#c<$MTCommentID$>" title="c<$MTCommentID$>">
<MTCommentAuthor></a> <$MTCommentDate format="%m/%d"$> <span class="new"><$MTCommentDate format="%Y:%m:%d:%H:%M:%S"$></span><br />
</MTComments>
</MTEntries>
</div>
<!-- 最近のコメント終了 -->１．２ Recents プラグインの場合
The blog of H.Fujimotoさんの最近のコメント／トラックバックをエントリーとともに表示するプラグインのサンプルリストを元に修正したものです。
<ul>
<MTCommentsRecent lastn="10" comment_sort_order="ascend">
<MTCommentsRecentIfEntry><li><a href="<$MTEntryPermalink$>"><$MTEntryTitle$></a>(<$MTEntryDate$>)</MTCommentsRecentIfEntry>
<MTCommentsRecentIfComment>
<MTCommentsRecentHeader><ul></MTCommentsRecentHeader>
<li><$MTCommentAuthorLink$>(<$MTCommentDate$>) <span class="new"><$MTCommentDate format="%Y:%m:%d:%H:%M:%S"$></span></li>
<MTCommentsRecentFooter></ul></li></MTCommentsRecentFooter>
</MTCommentsRecentIfComment>
</MTCommentsRecent>
</ul>１．３ MTCollate プラグインの場合
以下は当サイトで公開しているMTCollate を使って「最近のコメント」を表示するのサンプルを元に修正したものです。
<MTCollateCollect>
<MTComments lastn="10">
<MTCollateRecord>
<MTCollateSetField name="comment_id"><$MTCommentID$></MTCollateSetField>
<MTCollateSetField name="comment_author"><$MTCommentAuthor$></MTCollateSetField>
<MTCollateSetField name="comment_date"><$MTCommentDate format="%m/%d"$></MTCollateSetField>
<MTCollateSetField name="comment_newdate"><$MTCommentDate format="%Y:%m:%d:%H:%M:%S"$></MTCollateSetField>
<MTCommentEntry>
<MTCollateSetField name="entry_key"><MTComments lastn="1"><$MTCommentDate format="%y%m%d%H%M%S"$></MTComments></MTCollateSetField>
<MTCollateSetField name="entry_link"><$MTEntryPermalink$></MTCollateSetField>
<MTCollateSetField name="entry_title"><$MTEntryTitle$></MTCollateSetField>
</MTCommentEntry>
</MTCollateRecord>
</MTComments>
</MTCollateCollect>
<div class="sidetitle">
Recent Comments
</div>
<div class="side">
<MTCollateList sort="entry_key:#:- comment_id:#:+">
<MTCollateIfHeader name="entry_key">
<a href="<$MTCollateField name="entry_link"$>" title="<$MTCollateField name="entry_title" encode_html="1"$>"><$MTCollateField name="entry_title"$></a><br /></MTCollateIfHeader>
└ <a href="<$MTCollateField name="entry_link"$>#<$MTCollateField name="comment_id"$>" encode_html="1"><$MTCollateField name="comment_author"$></a> <$MTCollateField name="comment_date"$> <span class="new"><$MTCollateField name="comment_newdate"$></span><br />
</MTCollateList>
</div>２．スクリプトの追加
上記を設定したテンプレートの最後の方に下記のスクリプトを追加します。
<script type="text/javascript">
<!--
// passage time
var pass = 24;
// display content
var content = 'New!!';
var currentDate = new Date();
var spans = document.getElementsByTagName('span');
for (i = 0; i < spans.length; i++) {
if(spans[i].getAttribute('class') == 'new' ||
spans[i].getAttribute('className') == 'new') {
time = spans[i].childNodes[0].nodeValue.split(":");
var entryDate = new Date(time[0], time[1]-1, time[2], time[3], time[4], time[5]);
var now = (entryDate.getTime() - currentDate.getTime())/(60*60*1000);
now = Math.ceil(now);
if(-now <= pass){
spans[i].innerHTML = content;
spans[i].style.display = 'inline';
}
}
}
//-->
</script>新着表示の時間は
// passage time
var pass = 24;の赤色部分を変更します。単位は時間です（例は24時間）。
表示させる内容は
// display content
var content = 'New!!';の赤色部分を変更してください。HTMLタグも大丈夫ですので
var content = '<img src="http://～/hogehoge.gif" style="vertical-align: middle" />';とすれば画像を表示することもできます。
３．CSS設定
表示するテキストは new という class 属性つきの span タグで括られていますので、
span.new {
display: none;
color: red;
font-weight: bold;
}2006.08.15 追記
HTMLタグおよびスクリプトにコメントアウトする方式の設定が残っていましたので修正しました。
2006.08.18 追記
CSS に display プロパティがもれていたので追加しました。
≫ 新着コメントに「New」マークをつけるカスタマイズ from Project MultiBurst
新着コメントに「New」マークを付けるカスタマイズを見つけました。 いつもお世話になっている、 小粋空間さんのカスタマイズ。 関連URL 小粋空間: 新着... [続きを読む]
≫ [o.]新着コメントに更新マーク from `ohana
新着（２４時間以内）に頂いたコメントに更新マークを表示するように しました。 参... [続きを読む]
≫ 最近のコメントにＮＥＷマーク from 波乗りーまん
コンスタントにコメントをもらえるようになって嬉しい限り ブログ書いてて反響あるの... [続きを読む]
≫ New!マークの追加 from Coffee Time
ここのところ、毎日のように小粋空間さんを参考にしつつ、カスタマイズを繰り返してい... [続きを読む]
≫ NEW！マークを表示させてみる[1]♪ from ++Blog-MELL++
いつものように 小枠空間 さんの記事 「新着トラックバックに New マークをつ... [続きを読む]
≫ ブログにNEWマークつけました。 from http://www.toruses.com/blog/
このブログ、MovableTypeで作り始めて2ヶ月経過しましたが、どんなカスタ... [続きを読む]
≫ 新着コメント表示 from Y乃助
新着トラバがうまくいったところで、今度は、新着コメントをなんとかしたいところ！ ... [続きを読む]
≫ 進め！MovableType４ 新着表示 from 笑むなＡｉｋｏの『お玉杓子は飲み物です』
新着表示の「Ｎｅｗ」をリストで表現？。
[続きを読む]
≫ ブログ プチカスタマイズ from アクアリストになりたくて -アベニーパファーLOVE-
ブログのカスタマイズについて、めちゃめちゃお世話になってる 小粋空間さんのこちら... [続きを読む]
いつもすばらしいカスタマイズをありがとうございます。
早速使わせていただきました（＾＾；）
今後ともよろしくお願いいたします。
＞showBOOさん
こんばんは。
ご利用＆ご連絡ありがとうございました。
うまく設置できたようで良かったです。
ではでは！
こんばんは。
いつも拝見させて頂いております。
私のBlogは、ほぼ全てこちらのサイトを参考に作っております。
早速ですが、
この「New マーク」を付けるカスタマイズが、
最初は反映されていたのですが、
いつの間にか反映されなくなりました。
何故なのかお暇な時に教えて頂けたら幸いです。
＞thomasさん
こんにちは。
ソースを拝借して動作確認したところ正常に動作しているようです。
現在は24時間以内の投稿のみ新着にマークがつくように設定されていますので、追加したスクリプトの
var pass = 24;
を
var pass = 100;
等に変更して再構築してみてください。
以上です。
それではよろしくお願い致します。
yujiro さん
いつもテンプレートでお世話になっております。
新しいコメントが古いエントリーで表示されなくて悩んでいましたが
今回ＭＴｃｏｌｌａｔｅプラグインとｎｅｗマーク表示スクリプト使用で
新しいコメントが表示されるようになりました。
記事も分かりやすくて大変助かりました。
有り難う御座いました。
＞sumiさん
こんばんは。
こちらこそお世話になります。
カスタマイズ、うまくできたようで良かったです。
ではでは！
役に立つスクリプト＆設置方法を提供してくださって、本当に助かっています。
おかげさまで、本日は、新しいコメントに「New」を無事表示させることができました。ありがとうございました。
＞Chieさん
こんばんは。
ご利用＆ご連絡ありがとうございます。
うまくできてよかったです。
ではでは！
いつもお世話になっております。先日は有難うございました。
実は前のコメントにあるThomasさんと同じ現象が私のところでも発生しており、ちょっと困っております。
私の場合はMTCollate プラグインを使って新着コメントを出しているのですが、先週辺りから新着があってもnewの印が出なくなりました。後のコメントにある「var pass = 24;」の数値を変えたりも試してみて自分でコメントを書いたりしても見たのですがやはり表示されませんでした。
実は他にも同じＭＴで作っているブログがあるのですが、そちらでも同じMTCollate プラグインで新着に印が出るようにしているのですが、問題なく動いております。出ないものと出るものの違いといったらページのカラム数くらいで、今回表示されないのは３カラムレイアウトのものです。表示されているものは２カラムレイアウトを使用しております。
よろしくお願いいたします。
＞葛城宮雅さん
こんばんは。
ご質問の件ですが、本エントリーのタグおよびスクリプトが一部誤っておりましたので、申し訳ございませんが再度設定くださいますよう、お願い致します（エントリーリストはそのままで問題ありません）。
なおエントリーリストとコメントリストの時間を変更されているので、コメントリスト用の新着表示のスクリプトは、下記の行
var spans = document.getElementsByTagName('span');を
var spans = document.getElementByID('commentlist').getElementsByTagName('span');に変更されると良いでしょう。
それではよろしくお願い致します。
おはようございます。
何時も素早い対応ありがとうございます。
無事に新着の印がつくようになりました。
これからも色々と参考にさせていただきつつ、勉強していきたいと思います。
いつも小粋空間さんにはお世話になっています。
このエントリーを基に設定をしていたのですが、3.CSS設定で「display: none;」が抜けていませんでしょうか。
間違っていたら申し訳ありません。
＞葛城宮雅さん
こんばんは。
ご連絡ありがとうございました。
無事に直ってよかったです。
ではでは！
＞もんちさん
こんばんは。
いつもご利用ありがとうございます。
またこの度はご指摘くださり、どうもありがとうございました。
本文は先程修正致しました。
はじめまして。
どうしてもわからないことがありましたので、質問してもよろしいでしょうか？
私のサイトでは、「新着コメントリスト」欄を設けるのではなく、エントリーそのものの下に
(commnt(2)/tb(5))
のように表示させているのですが、
新しくコメントがついた時には
(commnt(3)"new"/tb(5))
という風に表示させることができたらいいのにと思っています。
このページで紹介して下さっている方法では
うまくいかなかったのですが（当然といえば当然かもしれませんが）、
上記のようにnewを表示させるのは難しいでしょうか？？
トンチンカンなことを書いていたらすみませんm(__)m
＞ちーぶーさん
はじめまして。
ご質問の件ですが実験してみたいと思います。
うまくできたらエントリー致しますので、すいませんが少々お時間ください。
アイデアありがとうございます！
yujiroさん、ありがとうございます！
できあがってエントリーされるのを楽しみに待ってます！
ちーぶー
＞ちーぶーさん
こんにちは。
「投稿者情報に New マークをつける」を投稿致しましたのでお試しください。
それではよろしくお願い致します。
yujiroさん、こんにちは。ちーぶーです。
なんて素早いアップなんでしょうか！驚
早速試してみたところ、やりたいことが実現されていました。
本当に感謝です。ありがとうございます！
＞ちーぶーさん
こんばんは。
ご連絡ありがとうございました。
うまくカスタマイズできたようでよかったです。
また何かございましたらご連絡ください。
ではでは！
Yujiroさん、
いつもお世話になります。
先日サイドメニューのツリー化を行ってから、以前表示されていた新着コメントの"NEW !"マークが表示されないようになってしまいました。
テンプレートのタグをツリー用に書き換えたので、「<」span class="new"「>」「<」$MTCommentDate format="%Y:%m:%d:%H:%M:%S"$「>」「<」/span「>」と組み込むだけではいけないのでしょうか？
スクリプトやCSSの記述には間違いはないと思うのですが。
＞kunioさん
こんばんは。
ご質問の件ですが、JavaScript エラーが発生しているようですので「JavaScript エラーを解消する」を参考に JavaScript エラーを解消してみてください。
本ご質問とは関係ありませんが、何か不具合が発生した場合は、JavaScript エラーの他、HTMLマークアップは「Another HTML-lint gateway」、CSS は「The W3C CSS Validation Service」で致命的なエラーがないか確認されると良いでしょう。
色々ご利用くださり有難いのですが、コメント稼動削減にご協力頂ければ幸いです。
それではよろしくお願い致します。
Yujiroさん、
いつもお世話になります。
上記の件ですが、1週間色々と試してみましたが解決されないので、諦めました。
色々とご迷惑をお掛けして申し訳ありませんでした。
＞kunioさん
こんばんは。
サイトを拝見させて頂きましたが、２項のスクリプトで、
spans[i].style.display = 'inline';の1行が削除されているのが表示されない原因と思います。
再度、２項のスクリプトを（修正せずに）そのままコピーしてください。また公開しているスクリプトは修正可能な部分を除いてそのままお使いください。
それではよろしくお願い致します。
Yujiroさん、
再度確認してくださって有難うございます。
確かにご指摘のラインが抜けておりました。恐らくコピペ&削除を繰り返すうちに抜けてしまったようです。
何度もご迷惑をお掛けして申し訳ありませんでした。
＞kunioさん
こんばんは。
ご連絡ありがとうございました。
無事に直ったようでよかったです。
ではでは！
こんばんは。
初めてコメントさせていただきます。
現在Serene Bachでブログを立ち上げようとチャレンジしております。
小粋空間様から以下のプラグインを使用させていただいております。
すばらしいプラグインをありがとうございます。
新着表示プラグイン（投稿者情報版） for Serene Bach
新着表示プラグイン（最新記事リスト版） for Serene Bach
新着表示プラグイン（サブカテゴリーリスト版） for Serene Bach
是非ともメニューのコメントリストにもNEW!と表示させたいのですが、このプラグインをSerene Bachで使用する方法はないでしょうか？
コメントをツリー化するプラグインを導入していますので、そちらを改造しようとしてみましたが、知識不足でうまく表示させることができませんでした。
お力をお借りできれば、幸いです。
＞ももさん
こんばんは。
プラグインご利用ありがとうございます。
ご要望のプラグインは多分作れると思いますが、すっかり忘れてしまっているので、すいませんがしばらくお時間頂けますでしょうか。
できあがり次第、別途エントリー致します（もしダメなようであれば、このエントリーにお詫びのコメント致します）。
それではよろしくお願い致します。
: June 27, 2009 2:32 AMyujiro様、
早々のレスありがとうございます。
お手数おかけしてすみませんが、よろしくお願いいたします。
