WordPressのスレッドコメントを理解する。親コメントと返信を結ぶ仕組み

2026年10月7日

CODE

コメントへの返信を作るとき、見た目を少し右へずらすだけでは親子関係は残りません。どのコメントに対する返信なのかをデータとして結び、その関係に沿って表示する必要があります。

社内ポータルでは、WordPressのコメント機能を土台に、返信を元のコメントの下へ階層表示しました。この記事では、実装を通して理解した親コメントと返信の関係を、WordPressの標準仕様に沿って整理します。

コメントを平らに並べると会話の流れが消える

コメントが少ないうちは、投稿された順に並べるだけでも読めます。しかし、複数の話題が同時に進むと、「この返信はどのコメントに向けたものか」が分かりにくくなります。

コメントA
コメントB
Aへの返信
Bへの返信

この並びでは、時刻を追わないと関係を判断できません。そこで社内ポータルでは、返信を元のコメントの内側へ置く形にしました。

コメントA
└ Aへの返信

コメントB
└ Bへの返信

表示位置だけでなく、背景色も返信の深さに合わせて変えています。誰が書いたか、いつ書いたか、どんな操作ができるかを残しながら、会話のまとまりを視覚的に追えるようにしました。

WordPressの各コメントには固有のcomment_IDがあります。返信側のcomment_parentへ親コメントのIDを保存すると、二つのコメントを結べます。

コメント	comment_ID	comment_parent	意味
最初のコメント	120	0	親を持たない
120への返信	121	120	コメント120の子
121への返信	122	121	コメント121の子

親を持たないコメントではcomment_parentは0です。返信では、親にしたいコメントのIDが入ります。この関係があるため、投稿時刻が前後しても、返信先を失わずに扱えます。

WordPress公式のwp_insert_comment()資料でも、comment_parentは親コメントのIDとして定義され、既定値は0とされています。

社内ポータルでは、コメント一覧と投稿フォームをcomments.phpで扱い、一件ごとの表示や操作をfunctions.php側で組み立てました。返信の親子関係にはWordPressが持つコメントデータを使っています。

WordPress標準のwp_list_comments()は、コメント一覧を表示する関数です。内部で使われるWalker_Commentは、親をcomment_parent、自身のIDをcomment_IDとして扱い、階層をたどります。

comment_ID: 120
└ comment_parent: 120 のコメント
   └ そのコメントを親に持つ返信

一覧表示には、階層の最大深度を決めるmax_depthもあります。返信を何段でも深くすればよいとは限りません。スマートフォンでは横幅が限られるため、会話を追える深さと読みやすさの両方を見て決める必要があります。

仕様の詳細は、wp_list_comments()とWalker_Commentの公式資料で確認できます。

返信操作では、利用者が親コメントのIDを意識する必要はありません。各コメントの「返信」から入力フォームへ進み、その対象を引き継いで送信できる形にします。

WordPressには返信リンクを出力するcomment_reply_link()があります。社内ポータルでも、編集・削除と並ぶ操作として返信を置き、どのコメントから操作を始めたかが分かる位置にまとめました。

この三つがつながって、初めてスレッドとして機能します。見た目の字下げだけを作っても、親子データがなければ並び替えや再表示で関係を保てません。

確認では、階層らしく見えるかだけでなく、返信先が正しく保存されているかも分けて見ます。

社内ポータルでは、返信が元のコメントの下へ表示され、深さに応じた背景の違いも確認しました。親子関係というデータと、階層を伝える見た目の両方がそろっているかを確認しています。

スレッドコメントの中心は、字下げのCSSではありません。親コメントのIDを返信へ保存し、その関係を表示側でたどることです。

この仕組みを使うことで、コメントは投稿順の記録だけでなく、話題ごとに追える会話になりました。

社内ポータルで投稿とコメントの役割を決め、返信・編集・削除を一つの操作体系へまとめた過程は、PROJECT 002 STEP 06「社内ポータルに投稿とコメントを作る」で記録しています。コメントを消す処理の考え方は、CODE 06「WordPressのコメントを完全削除せずゴミ箱へ送る」に分けました。