今回の動機はすごく単純です。
このサイトにコメントをしてくれた方の表示が「〜から」となっているを「〜さんから」に変えたいなと思ったのです。
変えたいのは記事下のコメント一覧部分とサイドバーに入れているコメントウィジェットの部分です。
まずは、どのファイルを編集していけばいいところから調べていきましょう。
どこをいじればいいの？
管理画面で「外観」→「テーマ編集（テーマエディター）」へ行きます。
ここでどのテンプレートファイルをいじればいいのか探します。
まずコメント表示がされているのが個別投稿記事なので該当するテンプレートsingle.phpを見てみます。
該当する場所ではcomments_template()が呼び出されていますね。
調べてみるとcomments_template()という関数はコメント用のテンプレートを呼び出す関数でした。
また「外観」→「テーマ編集（テーマエディター）」でテンプレートファイルを探します。
該当するのはcomments.phpです。中身をみてみます。
wp_list_comments()とcomment_form()という関数を呼び出していますね。
調べてみるとwp_list_comments()はコメントされた内容を表示するもの。
comment_form()はコメントフォームを表示するものでした。
いじりたいのはコメントされた内容ですからwp_list_comments()を編集したいわけです。
wp_list_comments()関数を調べます。
wp_list_comments()の引数の設定で出力するコメントリストのHTMLを設定出来るということです。
参考にさせてもらったのはこちら「WordPress 私的マニュアル」さん
この記事をずっと見ていくと一番下に
ソースファイル
/wp-includes/comment-template.php
とありました。
wp_list_comments()関数のスクリプトが書かれているファイルの場所です。
今回は直接このファイルをいじるわけではないのですが参考までに見てみます。
ワードプレスがインストールされたベースディレクトリの「wp-includes」ディレクトリ内にあるということです。
つまり管理画面の「外観」→「テーマ編集（テーマエディター）」では見る事は出来ません。
FTPソフトを使ってサーバーにアクセスします。
ワードプレスがインストールされたベースディレクトリに行き「wp-includes」へ入ります。
comment-template.php
comment.php
が見つかりました。
wp_list_comments()関数の引数の設定で出力するHTMLを変更する
wp_list_comments()関数の引数の設定で出力するHTMLを変更することが出来ます。
テンプレートファイルcomments.php内のwp_list_comments()を見てみると
wp_list_comments(‘avatar_size=55’);
avatar_sizeという引数が設定されていました。
コメントする人のアバター画像のサイズ設定です。
この引数に出力するHTMLを変更する設定をします。
wp_list_comments(array(
‘avatar_size’=>48,
‘callback’=>’mytheme_comments’
));
配列で設定します。
callbackという引数で関数を呼びだせます。
ここで呼び出す’mytheme_comments’という関数を作ってコメントリストのHTMLを出力させます。
関数’mytheme_comments’をfunctions.phpに書き足します。
関数の内容についてはここを参考にさせていただきました。
$GLOBALS[‘comment’] = $comment; ?>
<li <?php comment_class(); ?> id=”li-comment-<?php comment_ID() ?>”>
<div id=”comment-<?php comment_ID(); ?>” class=”comments-wrapper”>
<div class=”comments-meta”>
<?php echo get_avatar( $comment, $args[‘avatar_size’]) ?>
<ul class=”comments-meta-list”>
<li class=”comments-author-name”>
<?php printf(‘<cite class=”fn”>%s</cite>’, get_comment_author_link()) ?>
</li>
<li class=”comments-title”>
<?php
$commentID_parent = $comment->comment_parent;
if( $commentID_parent != 0 ):
?>
<a href=”<?php echo htmlspecialchars( get_comment_link( $commentID_parent ) ) ?>”><?php echo get_comment_author($commentID_parent); ?>さんへの返信</a>
<?php else: ?>
<a href=”#top”>「<?php the_title(); ?>」へのコメント</a>
<?php endif; ?>
<?php
if ($comment->comment_approved == ‘0’) {
echo ‘<span class=”comments-approval”>このコメントは承認待ちです。</span>’;
}
?>
</li>
<li class=”comments-date”>
<a href=”<?php echo htmlspecialchars( get_comment_link( $comment->comment_ID ) ) ?>”>
<?php printf(__(‘%1$s at %2$s’), get_comment_date(), get_comment_time()) ?></a>
<span><?php edit_comment_link(‘（編集する）’,”,”) ?></span>
</li>
</ul>
</div>
<!– comment-meta –>
<div class=”comments-content”>
<?php comment_text() ?>
</div>
<div class=”comments-reply”>
<?php comment_reply_link(array_merge( $args, array(
‘reply_text’=>’返信する’,
‘add_below’ =>$add_below,
‘depth’ =>$depth,
‘max_depth’ =>$args[‘max_depth’])))
?>
</div>
</div>
<!– comment-comment_ID –>
<?php
}
これをfunctions.phpに書き足して、テンプレートファイルcomments.php内のwp_list_comments()を
↑これから
‘avatar_size’=>48,
‘callback’=>’mytheme_comments’
));
↑こちらへ書き換えます。
なんとかうまく行きました。
表示される細かいところはmytheme_comments関数で出力されるHTMLをいじれば変更出来ます。
コメントウィジェットカスタマイズ
サイドバーなどに置くコメントウイジェットもいじりたいです。
ワードプレスの仕組みを確認するためにデフォルトで入っている「最近のコメント」ウイジェットのファイルがどこにあるか調べてみました。
デフォルトで入っている「最近のコメント」ウイジェットのファイルの場所
管理画面からではアクセス出来ないのでFTPソフトを使います。
ワードプレスのルートディレクトリから辿っていって
wp-includes/widgets/class-wp-widget-recent-comments.php
ここにありました。
見てもらうとわかると思うのですが、出力HTMLはすごくシンプルに作ってあります。
これをいじるよりあたらしいウイジェットを作った方が早そうです。
自作のコメントウイジェットを作る
こちらを参考にさせていただきました。
functions.phpに自作のウイジェットを追記します。
管理画面/外観/ウイジェット/
設定画面に自作のウイジェットが追加されているので、それを設置します。
細かい調整はfunctions.phpに追記したウイジェットのHTMLを出力する部分を編集しましょう。
感謝
これでなんとか記事下のコメント一覧、サイドバーのコメントウイジェット、これらがカスタマイズ出来ました。
参考させてもらった方々ありがとうございました。
以上「ワードプレスのコメント表示を変えたい」という記事でした。
気に入ってもらえたらシェアしてくれると嬉しいです。