WP Plugin:: Ajax Comments-Reply

Ajax Comments-Reply V1.0 釋出

Ajax Comment Reply，是為WordPress2.x所設計的外掛，採用Ajax無刷新處理發送迴響的表單，並加上了我個人戒不掉的回覆迴響功能。

上兩篇文章曾提到，Ajax Comment Reply 使用到 moo.fx與moo.ajax，但偏偏我又改了 moo.fx.js 與 moo.ajax.js 的部份原始碼，所以就一併放在此文所附壓縮檔之內提供下載。

下載位置: Ajax Comment Reply

說明：

增加的檔案

wp-content/plugins/comment-reply.php
wp-content/(your_temeplate)/comments-ajax.php
wp-content/(your_temeplate)/jscript/prototype.lite.js
↑ 可在一般頁面使用
wp-content/(your_temeplate)/jscript/moo.fx.js
↑ 可在一般頁面使用
wp-content/(your_temeplate)/jscript/parse.js.php
↑ 可在一般頁面使用
wp-content/(your_temeplate)/jscript/moo.ajax.js
↑ 單一文章頁面才有作用
wp-content/(your_temeplate)/jscript/comment.js
↑ 單一文章頁面才有作用

會被覆蓋的檔案

wp-content/(your_temeplate)/comments.php

需要更改到的檔案

wp-admin/options-options-discussion.php
wp-content/your_theme/header.php

增加的圖片（可自行替換）

wp-content/(your_temeplate)/images/b_reRoot.gif
wp-content/(your_temeplate)/images/b_submit.gif
wp-content/(your_temeplate)/images/loading.gif

開啟 wp-admin/options-options-discussion.php
搜尋

html · [高亮] · [原始]

  1. <li>
  2. <label for="default_comment_status">
  3. <input name="default_comment_status" type="checkbox" id="default_comment_status" value="open" <?php checked(‘open’, get_settings(‘default_comment_status’)); ?> />
  4. <?php _e(‘Allow people to post comments on the article’) ?></label>
  5. </li>
<li>
<label for="default_comment_status">
<input name="default_comment_status" type="checkbox" id="default_comment_status" value="open" <?php checked(\'open\', get_settings(\'default_comment_status\')); ?> />
<?php _e(\'Allow people to post comments on the article\') ?></label>
</li>

[高亮] · [原始] · html

後面加上

html · [高亮] · [原始]

  1. <!–comment_reply_max_level–>
  2. <li>
  3.     <?php _e(‘The max level of comments reply should be’)?>
  4.     <input type="text" size="3" name="comments_reply_max_level" value="<?php echo get_settings(’comments_reply_max_level’)?>" />
  5. </li>
  6. <!–comment_reply_max_level–>
<!--comment_reply_max_level-->
<li>
	<?php _e(\'The max level of comments reply should be\')?>
	<input type="text" size="3" name="comments_reply_max_level" value="<?php echo get_settings(\'comments_reply_max_level\')?>" />
</li>
<!--comment_reply_max_level-->

[高亮] · [原始] · html

搜尋

html · [高亮] · [原始]

  1. ,comments_notify,moderation_notify,comment_moderation,require_name_email,comment_whitelist,comment_max_links,moderation_keys,blacklist_keys,open_proxy_check
,comments_notify,moderation_notify,comment_moderation,require_name_email,comment_whitelist,comment_max_links,moderation_keys,blacklist_keys,open_proxy_check

[高亮] · [原始] · html

前面加上

html · [高亮] · [原始]

  1. ,comments_reply_max_level
,comments_reply_max_level

[高亮] · [原始] · html

開啟 wp-content/your_theme/header.php
搜尋

html · [高亮] · [原始]

  1. wp_head();
wp_head();

[高亮] · [原始] · html

前面加上

html · [高亮] · [原始]

  1. <script src="<?php bloginfo(’stylesheet_directory’); ?>/jscript/parse.js.php"></script>
  2. <?php
  3.     if(is_single ()) {
  4. ?>
  5. <script><!–
  6.         Script.require(’moo.ajax’);
  7.         Script.require(’comment’);
  8. //–></script>
  9. <?php
  10.     }
  11. ?>
<script src="<?php bloginfo(\'stylesheet_directory\'); ?>/jscript/parse.js.php"></script>
<?php
	if(is_single ()) {
?>
<script><!--
		Script.require(\'moo.ajax\');
		Script.require(\'comment\');
//--></script>
<?php
	}
?>

[高亮] · [原始] · html

啟用：

一切必要修改完成之後之後，到 wp-admin 的
「外掛」-> 「啟動 Comments Reply」
「選項」->「討論」設定最大回覆層級

使用須知：

名稱不可改變的清單：
　comments-ajax.php
　comments.php 之中的….
　　　　id = "comment_reply_ID"
　　　　id = "commentlist"
　　　　id = "comment-<?php echo $c->comment_ID ?>"
　　　　id = "loading"
　　　　id = "comment"
　　　　id = "reRoot"
　　　　id = "commentform"

問題：

想知道迴響呈現的結構以及如何設定CSS樣式？

我有使用Gravatar官方所提供的WordPress Plugin
該如何在迴響中顯示Gravatar圖示？

我使用的Gravatar外掛是在Skippy下載的Gravatars
該如何將圖示顯示在迴響中？

更新紀錄：

0.2　　2006.03.16
修復回覆表單在IE無法正常顯示透明漸變效果的情況

0.3　　2006.03.17

設定發表迴響之後頁面自動滾動到所發表的迴響之父對象或該迴響所在區

0.4　　2006.03.28

修正日期顯示格式。


52 Responses to “WP Plugin:: Ajax Comments-Reply”

  1. Robbin Says:
    三月 17th, 2006 at 9:27 下午

    這篇太讚了
    拍拍手!!:愛心:

  2. Beata Says:
    三月 17th, 2006 at 10:33 下午

    好久以前看到大家都在使用AjaxComment就覺得羨慕不已
    可是用過Comments-Reply的WP玩家
    通常都無法捨棄「回覆」這功能的方便性

    現階段好像還沒看到有關回覆這方面的Ajax外掛
    就自己動手做一個囉～

  3. Robbin Says:
    三月 18th, 2006 at 1:25 上午

    Beata我不誇張
    你真的夠厲害
    這個插件是我夢寐以求的，之前K2的ajax comment跟threaded comment不能共存我總是覺得遺憾
    沒想到第一次看到有人把他做出來
    讚讚讚
    拜託你以後少去玩線上遊戲啦，哈哈

  4. Robbin Says:
    三月 18th, 2006 at 1:55 上午

    剛試做發現了一件很黯然的事情…
    我的功能都很正常，但是回應的『R』怎麼沒跑出來，是我剛在回應裡抱怨他的關係嗎:破碎的心:

  5. Robbin Says:
    三月 18th, 2006 at 2:07 上午

    自己Re一下
    好像是因為我在後台沒設回覆層級
    不過如何用框線把這些回應匡起來啊
    這可把我搞糊塗了

  6. Beata Says:
    三月 18th, 2006 at 3:40 上午

    結構是
    <ul class="commentlist" id="commentlist">
    　<li>第一層迴響

    　　<ul>
    　　　<li>第二層迴響

    　　　　<ul>
    　　　　　<li>第三層迴響
    　　　　　</li>
    　　　　</ul>

    　　　</li>
    　　</ul>

    　</li>
    　<li>第一層迴響</li>
    　<li>第一層迴響</li>
    </ul>

    於此類推，有回覆的話，回覆清單會放置於父對象的<li>標籤之內

  7. Beata Says:
    三月 18th, 2006 at 4:08 上午

    所以CSS設置如下：
    [coolcode lang="css"]#commentlist{
    　/*整個迴響區域的樣式*/
    }
    #commentlist li{
    　/*第一層每篇迴響的樣式*/
    }
    #commentlist ul{
    　/*第二層迴響區域的樣式*/
    }
    #commentlist ul li{
    　/*第二層每篇迴響的樣式*/
    }
    ———————————
    此外
    #commentlist li.trackback{
    　/*引用所使用的樣式*/
    }
    #commentlist span.author{
    　/*發言人名字*/
    }
    #commentlist div.body{
    　/*留言內容*/
    }
    #commentlist p.meta{
    　/*編輯.回覆.日期這些狀態*/
    }

    [/coolcode]

  8. meng Says:
    三月 19th, 2006 at 5:41 下午

    真是太感謝了
    無敵的plugin啊啊啊

  9. Beata Says:
    三月 19th, 2006 at 6:18 下午

    不客氣:海豹:

  10. tinn.cn Says:
    三月 20th, 2006 at 9:16 下午

    好像很有意思 2.02适用吗？

  11. Beata Says:
    三月 20th, 2006 at 9:42 下午

    你好^^
    我目前的WordPress版本就是2.02
    請安心使用吧～

  12. Robbin Says:
    三月 21st, 2006 at 1:30 上午

    剛剛發現了一個不知道算不算bug的問題
    如果我在該篇回應已經回應過了，如果原回應在回應一次好像會把已回應過的蓋掉(聽起來好像繞口令)，但是如果在最後的回應在回應的話，就不會有這個問題，話說回來這也不算什麼問題，只是我剛發現有這個情況而已:青蛙:

  13. Beata Says:
    三月 21st, 2006 at 2:03 上午

    恩，這個…是預設情況。
    新的留言會取代那一層的元素。
    不過重新整理之後就正常了，因為能正常存入資料庫。

  14. meng Says:
    三月 21st, 2006 at 10:23 上午

    請問要怎麼加Gravatar的程式碼呢?

  15. Beata Says:
    三月 21st, 2006 at 4:48 下午

    我的Gravatar是在官方下載的
    下載之後將裡面的程式碼修改兩個地方

    function gravatar($rating = false
    改成像下面插入email
    function gravatar($author_email=false, $rating = false

    下面的 global $comment; 可以刪掉

    md5($comment->comment_author_email)
    也要改成
    md5($author_email)

    這樣就可以在comments.php自由的加入不一樣參數的email了

    所以comments.php找到
    <div class="body">
    之後加上
    話說Gavatar圖片審核好久呀～
    人家也好想要有美美圖片:破碎的心:

  16. mong Says:
    三月 23rd, 2006 at 1:01 上午

    感謝啊 可是我有用local gravatar
    但是這個語法好像沒有辦法顯現耶
    我是用這裡的語法
    http://www.skippy.net/blog/2005/03/24/gravatars/

  17. Beata Says:
    三月 23rd, 2006 at 1:17 上午

    依照外掛原先的使用說明安裝，但到了
    ===PART THREE===
    修改佈景主題的comments.php這個步驟時，改為下列方法。

    將下面壓縮檔內所覆的檔案內容加在 <div class="body"> 之後

    gravatar_for_skippy

  18. mong Says:
    三月 23rd, 2006 at 11:21 上午

    真是抱歉，一直麻煩您
    可是…我出現這樣的錯誤訊息耶
    Parse error: parse error, unexpected T_STRING in /home/eyionet/public_html/wp-content/themes/ocadia/comments.php on line 38

  19. Beata Says:
    三月 23rd, 2006 at 7:16 下午

    不知道為啥，上面那段代碼的單引號會被WP置換成好大的全形單引號:orz:

    我把他存成檔案了
    放在上面那篇迴響中

  20. meng Says:
    三月 24th, 2006 at 4:42 下午

    謝謝beata，果然這樣就可以用了
    真是打擾您了

  21. Beata Says:
    三月 24th, 2006 at 7:25 下午

    不客氣^^b

  22. kevin Says:
    三月 26th, 2006 at 2:27 下午

    真的有这么好吗？

  23. kevin Says:
    三月 26th, 2006 at 2:28 下午

    真的不错
    谢谢谢谢

  24. Hanry Says:
    三月 26th, 2006 at 6:13 下午

    试试….不知道效果如何..:)

  25. kevin Says:
    三月 26th, 2006 at 6:46 下午

    你好
    我用了这个插件以后
    覆盖comments.php了
    因为我们用的插件不一样
    所以在显示的时候是一塌糊涂

    请问，如何不覆盖comments.php
    而直接在自己的comments.php文件中稍加修改呢？？

  26. fen Says:
    三月 26th, 2006 at 6:54 下午

    好像挺好啊!!

  27. kevin Says:
    三月 26th, 2006 at 7:05 下午

    请问
    如果我不用AjaxComment
    就只用Comments-Reply，那这个插件到哪里找呢？

  28. Robbin Says:
    三月 26th, 2006 at 9:43 下午

    我猜覆蓋再修改應該比較簡單一點..

  29. Robbin Says:
    三月 26th, 2006 at 9:49 下午

    亂入一下，雖然我不是版主:P
    參考看看http://meidell.dk/archives/2004/09/04/nested-comments/
    吧
    我記得當初我也看了beata的介紹用這個plugin:愛心:

  30. raenoll Says:
    三月 26th, 2006 at 11:04 下午

    你好，用了你的plugin，发现时间没有12/24的区别,好像都是12进制的？应该怎么样把它变成24进制的呢？

    谢谢。

  31. kevin Says:
    三月 27th, 2006 at 8:44 上午

    对不起你给的网页Error 404 - Not Found

  32. kevin Says:
    三月 27th, 2006 at 8:48 上午

    那个我觉得回复的版面太乱了
    还是喜欢beata这个插件

  33. Joseph Says:
    三月 27th, 2006 at 8:16 下午

    網主大人,為何我安裝了此plugin後
    留言位置沒有mail,website的欄
    也沒有像這裡一樣的icon的?
    別人的留言也沒有[R]鍵啊
    是否這些需其他plug才行?

  34. Beata Says:
    三月 28th, 2006 at 7:52 上午

    可能你是使用了管理員的身份進入WP
    所以留言位置沒有mail, website

    ICON的話你可以參考這篇文章的問題區

    「R」鍵未顯示可能你並未在後台設定回覆層級

    「外掛」-> 「啟動 Comments Reply」
    「選項」->「討論」設定最大回覆層級

  35. Beata Says:
    三月 28th, 2006 at 8:44 上午

    我也覺得覆蓋再修改會比較簡單
    因為除了表單區域之外…
    其他的部位都更改過了….

  36. Beata Says:
    三月 28th, 2006 at 8:56 上午

    抱歉當初沒注意，謝謝你的提醒
    修正此問題只需更改 comments.php 搜尋
    mysql2date(’Y.m.d h:m’, $c->comment_date)

    替換成12進制並顯示AM.PM
    mysql2date(’Y.m.d g:i A’, $c->comment_date)
    或者替換成24進制
    mysql2date(’Y.m.d H:i’, $c->comment_date)

  37. kevin Says:
    三月 28th, 2006 at 8:57 上午

    你好
    能不能把你这页的代码发给我一份
    我注意到你的li和回复的class是body
    可是我不知道怎么编写

  38. Beata Says:
    三月 28th, 2006 at 9:02 上午

    結構及CSS設置

  39. kevin Says:
    三月 28th, 2006 at 10:08 上午

    我看你的也够好像不是这样的啊
    再说
    我也只希望有一层回复就够了
    我想要你的这种效果啊

  40. Beata Says:
    三月 28th, 2006 at 10:19 上午

    如果只想要有一層回覆的話
    在後台管理介面的
    「選項」-「討論」頁其中的
    The max level of comments reply should be
    設定為1
    這樣就會只有一層回覆了

    另外，發放出去的Ajax Comments-Reply跟我目前自己在用的版本是一樣的
    差別在於我加上了留言板的分頁判斷。
    如果需要的話你可以查看這個頁面所輸出HTML碼做確認

    <li>包圍住各項內容，在結構及CSS設置有標示出CSS設置了，但結構部份為了便於觀察。

    我沒有標示得很清楚，在這裡說個明白：

    <span class="author">　發表者
    <div class="body">　內容
    <p class="meta">　日期等狀態

  41. kevin Says:
    三月 28th, 2006 at 10:55 上午

    谢谢你
    我已经调整好了

  42. OtherSide Says:
    三月 29th, 2006 at 1:35 下午

    推荐WP插件：Ajax Comments-Reply…

    从这个blog建立以来，除了写了一篇《本站使用的WordPress插件》以外，从来没有专门推荐过什么WordPress的插件。今天就 …

  43. 天方随笔 Says:
    四月 2nd, 2006 at 10:16 下午

    ajax comment reply…

    懒懒喵的plugin做的真好，但是到了我的这里似乎有些问题

    我昨天刚装wordpress，有许多不懂，今天用了懒懒喵的ajax comment reply后，真的不用跳转页面了

    但是问题也来了，就是我的页面…

  44. 天方随笔 Says:
    四月 3rd, 2006 at 9:09 下午

    谢谢懒懒喵…

    在懒懒喵的帮助下，我终于把我的comments的页面问题修正了，顺便也熟悉了一下css。

    发现css真的是个好东西，恩，以后要好好学。

    这个博客刚刚搭建起来，这是我第一次有自己的wordp…

  45. i Live ! » 集中风格比较接近的blog Says:
    十月 11th, 2006 at 10:34 上午

    [...] http://blog.nahoya.com/archives/2006_03/83 [...]

  46. Robbin.cc » 羅賓日誌 » Beata有你的-Ajax Comment的plugin Says:
    十一月 5th, 2006 at 9:10 下午

    [...] Beata的詳盡教學在此 [...]

  47. Robbin.cc » 羅賓日誌 » [plugin]wp用的Guestbook Says:
    十一月 15th, 2006 at 9:05 上午

    [...] 我的文章的一般留言是由舊到新，而留言板的排序是由新到舊，還有加上了分頁的功能，反正愛改東改西的結果，總是讓自己每次寫的版面新氣象之類的文章，都會變成舊氣象，外掛清單也會更新個沒完沒了，相信接觸wordpress的玩家不少人都可以了解我內心的吶喊 當我逛到一見鍾情的網站時，我最希望的是有幾個最基本的功能，方便的文章瀏覽，方便的搜尋，方便的留言，沒了。隨便拿方便的留言來說，在wordpress裡面就有N種作法，譬如說Ajax Comment，Threaded comment（巢狀回覆)等等方式，當然不能不提我心中的大神Beata整合ajax跟Threaded comment寫的Ajax Comment Reply。 [...]

  48. OtherSide » 推荐WP插件：Ajax Comments-Reply Says:
    二月 7th, 2007 at 3:03 下午

    [...] 从这个blog建立以来，除了写了一篇《本站使用的WordPress插件》以外，从来没有专门推荐过什么WordPress的插件。今天就破天荒地推荐一个：Ajax Comments-Reply。 [...]

  49. yo2.cn WordPress 博客服务 » 我想使用的WordPress插件和主题 Says:
    二月 22nd, 2007 at 1:04 上午

    [...] Ajax Comments-Reply：这个插件集ajax comment和Threaded Comments的优点于一体，实现了本人迫切要求的一对一留言回复功能。而且界面又这么优秀，让我如何不选它呢。（没有选择Threaded Comments就是因为我看到作者的留言回复页面过于混乱） [...]

  50. WP Plugins DB » Plugin Details » Ajax Comments-Reply Says:
    八月 5th, 2007 at 6:38 下午

    [...] Visit [...]

  51. yauidea.com » Blog Archive » 網擇 2006-04-09 Says:
    二月 18th, 2008 at 1:19 上午

    [...] 懶懶喵日記 | » WP Plugin:: Ajax Comments-Reply (tags: blog Wordpress plugins) [...]

  52. Lakers 部落手記 » Ajax Comment Reply: 神奇的留言魔法 Says:
    七月 1st, 2008 at 11:40 下午

    [...] 懶懶喵日記 » WP Plugin Ajax Comments-Reply [...]