WordPress 部落格從 2.7 版本就自帶了“ 巢狀回覆” 功能,但是很多主題都沒有新增該效果,大部分博主也用部落格外掛來實現該功能,可部落格外掛的巢狀回覆的內容樣式與父評論不能保持一致,而使用自帶的巢狀功能卻可以和父評論的內容樣式一樣。部落格吧轉載了零號相簿的 WordPress 部落格自帶巢狀回覆教程。

自帶巢狀功能工作原理:

WordPress 巢狀回覆的工作原理是 WP 的資料庫裡有個 wp_comments 的表中有一欄 comment_parent ,即可以對 comment 指定父級,達到巢狀的目的。

非外掛巢狀回覆教程:

1. 在部落格後臺的已安裝外掛列表中停用 WordPress Thread Comment 外掛。並在部落格後臺點選“ 設定” 選項卡中的“ 討論” 選項進入配置頁面,開啟“ 允許巢狀 X 層評論” 。

2. 登陸部落格後臺,點選“ 外觀” 選項卡下的“ 編輯” 選項進入主題編輯頁面,選擇主題 (這裡以 WP 自帶 classic 主題為例),編輯頭部檔案 header.php,在 WP 函式

<?php wp_head(); ?>

之前添上程式碼

<?php if ( is_singular() ) wp_enqueue_script( 'comment-reply' ); ?>

該程式碼在文章/頁面呼叫巢狀回覆的 Javascript 檔案

3. 開啟主題的 comments.php 評論模板。原有的模板程式碼大概是如下:

<?php if ( $comments ) : ?>
<ol id="commentlist">
<?php foreach ($comments as $comment) : ?>
<li>
...
<?php comment_text() ?>
...
</li>
<?php endforeach; ?>
</ol>
<?php else : // If there are no comments yet ?>
<p><?php _e('No comments yet.'); ?></p>
<?php endif; ?>

如今有了 WP 自帶的 wp_list_comments(); 函式,即可輕鬆完成這些工作,把上面程式碼替換為:

<?php if ( $comments ) : ?>
<ol class="commentlist">
<?php wp_list_comments();?>
</ol>
<?php else : // If there are no comments yet ?>
<p><?php _e('No comments yet.'); ?></p>
<?php endif; ?>

說明一下,原有的判斷有留言、取出、並顯示的部分用一個 wp_list_comments(); 即可取代。原來的 ol(有序列表) 的 id="commentlist" 改為 class="commentlist",這是因為到後面定義 CSS 的時候可能會與其他產生衝突。

4. 在評論模板 comments.php 中找到一個 textarea,name=”comment”,就是訪客輸入留言的文字域,看看這個 textarea 中是否有個 id=”comment”,如果有,把 id=”comment” 去掉 (不是去掉 textarea,而是去掉定義的 ID) 。

5. 在評論模板 comments.php 中找到程式碼:

<input type="hidden" name="comment_post_ID" value="<?php echo $id; ?>" />

將程式碼替換為:

<?php comment_id_fields(); ?>

這是對回覆框進行定義,以便支援巢狀回覆。

6. 在評論模板 comments.php 中找到程式碼:

<h2 id="postcomment"><?php _e('Leave a comment'); ?></h2>

<?php endif; // If registration required and not logged in ?>

的外部用一個 id 為”respond” 的 div 包裹

<div id="respond">
……
</div>

這樣是為了在巢狀回覆時,點選留言者旁邊的“ 回覆”,即可把評論框整體移至該評論附近。

7. 在評論模板 comments.php 中的“Leave a Reply” 下面增加程式碼:

<div id="cancel-comment-reply">
<small><?php cancel_comment_reply_link() ?></small>
</div>

這是一個取消評論的連結。一般情況下,該連結不顯示,只有要針對某人進行評論,而不想評論時可以點選這個連結把評論框復位。