WordPress のコメント投稿後、リロードせずにコメント欄を更新するプラグイン Quick Comments の Ver.0.5.0 をリリースしました。
ダウンロードと詳細な使用方法は WordPress Plugins/JSeries » Quick Comments よりお願いします。
今回のバージョンアップで、ログインユーザー以外でも、コメント投稿後一定時間だけ修正可能とする機能を追加しました。
デフォルトではオフになっていますので、管理画面で使用可にしてください。
大幅な機能追加を行ったため正式リリース前にyutakaさんにテストを付き合っていただきました。
yutakaさん、バグ出しや機能追加について色々とご意見いただきありがとうございました。
また、この機能を追加するに当たって、以下のプラグインを参考にさせていただきました。
Edit Comments XT Plugin
動作等確認したい方は、このエントリに対してご自由にコメントしてお試しください。
コメント投稿後、30分以内であれば修正できます。
つぶやく
リロードせずにコメント欄を更新
リロードせずにコメント欄を更新
どうやるの?
COOKIE と JavaScript が有効になっていれば、コメントフキダシの右下に「コメント編集」ってリンクが表示されるはずです。
それをクリックすると、投稿したコメントを編集できます。
#ただし、30分以内。
初めまして^^
wordpressにおけるコメント編集のプラグインを探していたところ
貴殿がリリースしているQuick Commentsの存在を知りました。
早速、導入させて頂いたのですが、どうしてもうまく作動してくれないためコメントした次第です。
wordpressのバージョンは 2.5.1です。
また拙作ながら自作テーマを使用しています。
defaultのテーマを使用すればしっかりと動作するため
自作テーマに問題があることは明らかなのですが、、、
PHPを始めプログラミングに関してまったくの素人のため、何をどうしてよいのかわかりません。
解決方法をご教授頂けないでしょうか。よろしくお願い致します。
上記の続きです。
以下にcomments.phpの中でQuick Commentsに関わってくるだろうと思われる箇所のコードを記します。
<?php if ($comments) : ?>
<ol class="commentlist">
<?php foreach ($comments as $comment) : ?>
<div class="commentBox">
<div class="commentMain">
<?php comment_text() ?>
</div>
<ul>
<li class="user">posted by <?php comment_author_link() ?><?php if ( $user_ID ) : ?></li><li><?php edit_comment_link(’edit’, ’’ ,’’); ?><?php endif; ?></li><li><?php comment_date(’Y.m.j’) ?> <?php comment_time() ?></li><li class="gotop"><a href="#top"><img src="http://cherrrrry.com/blog/wp-content/themes/cherrrrry/images/gotop.gif" width="35" height="25" alt="" /></a></li>
</ul>
</div>
<?php endforeach; ?>
</ol>
<?php endif; ?>
<div class="postSection">
<h2>Poat a Comment</h2>
<fieldset>
<legend accesskey="c">Post a Comment</legend>
<form action="<?php echo get_option(’siteurl’); ?>/wp-comments-post.php" method="post" id="commentform">
<dl>
<dt>
<label for="author">Name</label>
</dt>
<dd>
<input type="text" name="author" id="author" value="<?php echo $comment_author; ?>" size="40" tabindex="1"/>
</dd>
<dt>
<label for="email">E-mail</label>
</dt>
<dd>
<input type="text" name="email" id="email" value="<?php echo $comment_author_email; ?>" size="40" tabindex="2"/>
</dd>
<dt>
<label for="url">Website</label>
</dt>
<dd>
<input type="text" name="url" id="url" value="<?php echo $comment_author_url; ?>" size="40" tabindex="3"/>
</dd>
<dt>
<label for="comment">Comment</label>
</dt>
<dd>
<textarea name="comment" id="comment" cols="45" rows="10" tabindex="4"></textarea>
</dd>
</dl>
<?php show_subscription_checkbox(); ?>
<input name="submit" type="submit" id="submit" tabindex="5" value="Submit"/>
<input type="hidden" name="comment_post_ID" value="<?php echo $id; ?>" />
</form>
</fieldset>
</div>
説明不足かもしれませんが、よろしくお願い致します。
追伸:コメントの残り時間が詳しくわかるように、タイマーのように少しずつ減っていくような表示方法は可能でしょうか?
また、Edit Comments XTのように、「コメント送信」ボタンが、編集の際には「編集」ボタンへと、といったように変化させることは可能でしょうか?
cherrrrry さん、はじめまして。
Quick Comments は、お使いのテーマによって設定値を変更する必要があります。
設定値の変更は、管理画面の「設定」-「Quick Comments」を選択して行うことができます。
で、cherrrrry さんの提示されたテーマに併せると設定値を以下のように変更すれば上手くいくはず。
コメントフォームの CSS パス →
form#commentformコメントリストの CSS パス →
ol.commentlist:first編集後戻る位置 →
#comment-%ID%ただし、提示された comments.php では、各コメントごとに ID を設定していないようなので、このままではコメント編集後に戻る位置が見つけられません。
4行目を以下のように修正してください。
<div class="commentBox" id="comment-<?php comment_ID(); ?>">どうしても上手く動作しない場合は、利用サイトの URL を教えていただければ、なにかアドバイスできるかもしれません。
現状ではできませんが、中々便利そうな機能ですね。
次のバージョンアップの際に検討してみます。
すばやいお返事ありがとうございます^^
コメントして頂いたように試してみましたが
やはり無理なようでした。。。
利用サイトは以下になります。
お手数をお掛けして申し訳ありません。
よろしくお願いいたします。
http://toya-kanazawa.com/blog/
追伸:
Quick Commentsのプラグインはオンになっています。
コメントは削除しますのでテストで一度コメントしてみて下さい。
何卒よろしくお願い申し上げます。
cherrrrry さん、どもです。
Quick COmments プラグインは有効になっていますか?
JavaScript の読み込みが行われていないようです。
これは、たぶんお使いのテーマに問題がありますね。
以下の2箇所を、ご確認ください。
ヘッダー(header.php)
<head> 〜 </head> の間に
<?php wp_head(); ?>と言う記述があること。無ければ、</head> の直前に
<?php wp_head(); ?>と言う行を追加してください。フッター (footer.php)
</body> の前に
<?php wp_footer(); ?>と言う記述があること。無ければ、</body> の直前に
<?php wp_footer(); ?>と言う行を追加してください。この修正を行うとどうでしょうか?
あと、もうひとつ気になった点。
wp-cache プラグインのような、キャッシュを作成するプラグインを使用しておられるでしょうか?
であれば、一度すべてのキャッシュを消去しないと、動作しないと思われます。
お返事ありがとうございます♪
早速取り掛かってみたいと思います。
取り急ぎ連絡まで
をかもと様にご指摘された点を書き加えてみたのですが
残念なことに変化がありませんでした;;
動作状況としては、
◎コメントはできるがQuick Commentsの「コメント送信中…」のメッセージが出ない。
◎「コメント編集」のリンクは出るけれども、クリックするとURLの末尾に#が追加されてコメントページが再読み込みされるだけ。
◎コメントページのJavaScript が実行されない。
Quick Commentsのプラグインを有効にすると
なぜか現状ではコメントのページだけで、動作に不具合が起きるようです。
そのかわり、いくつか書き換えたおかげで、以前は作動しなかったWP Ajax Edit Commentsのプラグインが、正常に作動しました。<でもポップアップウィンドウが出るタイプ;;
また、Edit Comments XTも試してみたのですが、こちらは、コメントの訂正はできるけれども、訂正したはずのコメントが新規コメントとして投稿されてしまいます。
私としてはQuick Commentsプラグインのリロードしないシンプルさと、あのかっこいい動きを何としてでも導入したいと思っています。
もう少し自分でも頑張ってみます。
色々と本当にありがとうございます。
cherrrrry さん、どもです。
サイト確認しました。
ヘッダー(header.php)の修正はうまく行っているようですが、フッター (footer.php)の修正がうまくないようですね。
次はテーマの single.php を確認してみてください。
単一記事の投稿(single.php)
最後の行に
<?php get_footer(); ?>と言う記述があること。無いようなら、最後の行に
<?php get_footer(); ?>を追加してください。(このテンプレートタグを書き込んだ所に フッター (footer.php) の内容が読み込まれます。)ただし、single.php が
</body> </html>で終了している場合は、</body>の直前に<?php wp_footer(); ?>と言う行を追加してください。これでどうでしょうか?
おっしゃる通りです。
single.phpに
<?php get_footer(); ?>を書き込むのを忘れていました^^;フッター (footer.php)はヘッダー(header.php)、サイドバー (sidebar.php)のすぐあとにおいているので
</body>の直前に<?php wp_footer(); ?>と言う行を追加しました。その上でQuick Commentsプラグインを実行したところ
◎コメントはできて、Quick Commentsの「コメント送信中…」のメッセージもでましたが、その後、警告のようなポップアップウィンドウが表示されました。↓
http://f.hatena.ne.jp/images/fotolife/t/talion/20081021/20081021224918.png
◎「コメント編集」のリンクは出るけれども、クリックするとURLの末尾に#が追加されてコメントページが再読み込みされるだけ。
◎コメントページのJavaScript が実行されない。
本当に親切にして頂いてありがとうございます♪
どもです。
そちらのサイトにもコメントさせていただいたのですが、以前提示されたコメント部分のコードから若干修正されたようですね。
今の状態だと <ol class="commentlist"> 要素が無くなっているので、正常に動作しません。
設定画面で、
コメントリストの CSS パス → div.commentSection:first
に変更してください。
あと、
<div class="commentBox" id="comment-<?php comment_ID(); ?>">の修正が無くなっているようです。テーマの該当個所を修正してください。
↑すみません、先ほど色々とプラグインを換えていた時に
最初に書き換えたコメント(comments.php)を誤って元に戻していました。。。
cherrrrry さん、どもです。
そちらのサイトで確認させてもらいました。
正常に動作しているみたいですね。
あとは、コメント送信中メッセージのスタイルを微調整してやってください。
Firefox3だと、なんかずれて表示されてるみたいなので。
とりあえず、動作するようになってよかったです :P
できました!!

無事に動作しました♪
本当にありがとうございます^^
ただやはり
◎Quick Commentsプラグインをオンにすると、コメント(comments.php)の含まれるページ(single.php)だけ動作が不安定なようです。
■具体的には、サイドバーのArchiveとCategoryのリストがプルダウンしない。
■ページトップにあるアンカー(#top)へのリンク(上矢印の小さなボタン)をクリックしたときの動作が滑らかに動かずいきなりアンカー(#top)へ飛ぶ。<safari
です。
でも、ここまでできただけでも、ほんとに感激です^3^v
cherrrrry さん、どもです。
mootools ライブラリを使用されているようですが、Quick Comments で使用している jQuery と mootools ライブラリは、そのままではコンフリクトを起こして正常に使用できないようです。
(参考:jQueryとmootoolsを同時に使う方法 | THE HAM MEDIA)
そちらのサイトでは具体的には、ヘッダー(header.php)の
<?php wp_head(); ?>を以下の位置に移動して、その直後に太字で書いた3行を追加すれば、うまくいきそうです。<head>〜
<?php wp_head(); ?>
<script type="text/javascript">//<![CDATA[
jQuery.noConflict();
//]]></script>
<script type="text/javascript" src="http://toya-kanazawa.com/blog/wp-content/themes/toya/js/mootools.js"></script>
〜
</head>
うう〜

ついにできました♪
言われた通りに書き足してみたら
しっかりと動作しました^w^/
繰り返し何回もいっている気がしますが。。。ほんとうにほんとうにありがとうございます!!
あとはCSSの設定を少し変更して
うまく合うように調節します。
本日は長い間お付き合い頂きありがとうございましたv
次のバージョンも楽しみにしています♪
(それまでにもう少し私も勉強しておきたいと思います。)
それでは、おやすみなさいzzz
ありがとうございました^^
cherrrrry さん、どもです。
一つだけ、訂正して欲しい所があります。
単一記事の投稿以外のページでエラーが発生してしまっているので、追加した3行を以下の用に書き換えてください。
<script type="text/javascript">//<![CDATA[if (typeof jQuery !== "undefined") jQuery.noConflict();
//]]></script>
これで完璧。
おはようございます :D
早速、実装してみました。
ありがとうございます♪
その後、色々と試している中で(上記訂正実装後)
いくつか気付いた点を述べます。
◎IE6(win)でコメントの投稿&編集のテストを行なったところ、編集の際に、画面が編集位置へと自動で遷移しない。
◎Quick Commentsの設定で「コメント送信中メッセージに適用するスタイル」
&「コメント送信中メッセージの背景に適用するスタイル」を変更すると、
コメントの投稿&編集の際に正しく動作(リンク)しなくなる場合がある。
cherrrrry さん、どもです。
これは、IE6のバグに起因するものです。
IE6 では
<!DOCTYPE 〜>宣言の前に何か文字があると「後方互換モード」で画面をレンダリングします。これは、
<?xml version="1.0" encoding="UTF-8"?>と言う XML 宣言も例外ではありません。なので、ヘッダー(header.php) の1行目で XML 宣言をしているところを以下のように修正して、IE6 の場合は XML 宣言を出力しないように修正する必要があります。
<?php$ua = $_SERVER['HTTP_USER_AGENT'];
if ( !(ereg("Windows",$ua) > 0 && ereg("MSIE 6.",$ua) > 0) ) {
echo '<?xml version="1.0" encoding="'. get_bloginfo('charset') . '" ?>';
}
?>
とりあえず、以上の修正で直ると思います。
# 「後方互換モード」で表示している際も正常に動作するように修正すればいいのですが、そこは今後の課題と言うことで
こちらは、原因が分からないですね。あとで時間のあるときに調べておきます。
IE6のバグ確かに直りました
二つ目の問題は、以前出た症状と同じ感じで、
◎コメントはできるがQuick Commentsの「コメント送信中…」のメッセージが出ない。
◎「コメント編集」のリンクは出るけれども、クリックするとURLの末尾に#が追加されてコメントページが再読み込みされるだけ。
です。
ただし、症状が出るときと出ないときがあります^^;
cherrrrry さん、どもです。
ひょっとして、「コメント送信中メッセージに適用するスタイル」&「コメント送信中メッセージの背景に適用するスタイル」の中で、シングルクォーテーション (') を使用してます?
そうすると、上手く動作しないかも。
# Quick Comments のバグです。あとで修正します。
とりあえず、回避策としてはシングルクォーテーションでは無くダブルクォーテーション (") で指定してください。
これなら、多分上手くいくはず。
ご返信ありがとうございます^^
色々と試してみたいと思います。
また報告致します。
連絡までに :P
cherrrrry さん、どもです。
今回のコメントのやり取りを FAQ としてまとめさせていただきました。
Quick Comments FAQ
一応、報告まで。
最初から、この手の情報をまとめておけば良いのですが、利用者の方がどこでつまずくか分からないのが現状です。
色々と質問していただけると、こちらも助かります。
いくつかcssの設定を試してみたのですが、
シングルクォーテーション (’)だけでなく、使用できないcssがいくつかありました。
どうも私がもともと定義しているcss(<input>や<textarea>などで)が「コメント送信中メッセージに適用するスタイル」にも影響を及ぼしているようです。
そのため、例えば「コメント送信中メッセージに適用するスタイル」の設定で、borderの定義を消しても、
<input>や<textarea>で(border: 1px solid #666666;)の定義をしているため、
「コメント送信中メッセージ」にも、無条件で(border: 1px solid #666666;)が適用されます。
結果的に設定したのは以下の通りです。
「コメント送信中メッセージに適用するスタイル」を(border:1px solid #fff; font:normal 12px Arial; width:195px; height:inherit;)
「コメント送信中メッセージの背景に適用するスタイル」を(backgroundColor:#fff; opacity:0.6; top:-2px;)
その後、IE6(win)で見てみたところ、
投稿&編集においてバグが起きました。
(なぜか…/plugin/quick-comments/quick-comments.phpにページが飛び、くずれる)
そこで、「コメント送信中メッセージに適用するスタイル」を(border:1px solid #fff; font:normal 12px Arial; width:0px; height:0px;)
にしたところ収まりました。
今日は、とりあえずここまでにします。
おやすみなさいzzz
cherrrrry さん、どもです。
色々と試していただき、ありがとうございます。m(_ _)m
いただいた不具合報告を元に次回バージョンアップの時に改修したいと思います。
一人で開発しているとテストがおろそかになってしまう傾向にあるので、利用者の方からの不具合報告は非常に助かります。
今後ともよろしくお願いします。
お世話になります。
一応、形にはなったので今後もありがたく使用していきたいと思っています
今後バージョンアップされる時に
もしできるならばという要望をいくつか挙げておきますね^^
◎コメントの残り時間が詳しくわかるように、カウントダウンタイマーが表示される。(分表示or分秒表示or非表示、選択制)
◎コメントの編集だけでなく、名前&E-mail&URLの編集もできる。(選択制)
◎コメント編集中は「コメントの編集」リンクが「現在編集中」になりリンクが外れる状態になる。
◎コメントの編集がされると、記事投稿者(あるいは管理者)にE-mailで通知される。(選択制)
◎現在は管理者(投稿者)がwordpressにログインしていると常に「コメントの編集」リンクが表示されるが、権限によって表示、非表示を切り替えられる。
◎「コメント送信」ボタンが、編集の際には「編集」ボタンへと変化する。(テーマに直接書き換えが必要?)
◎現在は<?php comment_author_link() ?>の前?に「コメントの編集」リンクが表示されるが、自由な位置に設定できる。(テーマに直接書き換えが必要?)
↑Edit Comments XTとWP Ajax Edit Commentsを参考に考えました。
現在は、設定パネルでほとんど設定可能ですが、詳細設定の場合はテーマに直接書き加えるような指示があってもよいと思います。
今回は本当に色々とありがとうございました♪
cherrrrry さん、どもです。
色々と要望ありがとうございます。
次回以降のバージョンアップの際に参考にさせていただきたいと思います。