この記事は最後に更新してから1年以上経過しています。

5.5の機能強化:コメントフォームのちょっとした改良

説明

来月にリリースされるWordPress 5.5に向けてBeta 1、2、3と公開が続いている。「WordPress 5.5 Beta 3(以降Beta 3)」のソースコードを見ていくと、コメントフォームを表示する comment_form関数が機能拡張されていた。

はじめに、この記事は公開された5.5 Beta 3をもとにしており、正式リリースの際に変更される可能性があることを予めお断りする。

comment_form関数のパラメータ

comment_form関数はテーマにおいてリクエスト時の状況に応じたコメントフォームを表示する関数であり、例えば標準テーマ「Twenty Twenty」では次のようなパラメータが指定されている。

comment_form(
	array(
		'class_form'         => 'section-inner thin max-percentage',
		'title_reply_before' => '<h2 id="reply-title" class="comment-reply-title">',
		'title_reply_after'  => '</h2>',
	)
);

投稿ページにアクセスして実際に出力されたHTMLコードの冒頭部分(一部整形)は次の通り。comment_form関数のパラメータで指定された内容が出力されていることがわかる。

<div id="respond" class="comment-respond">
	<h2 id="reply-title" class="comment-reply-title">コメントを残す <small><a rel="nofollow" id="cancel-comment-reply-link" href="/2020/07/08/column0001/#respond">コメントをキャンセル</a></small></h2>
	<form action="http://localhost/wp-comments-post.php" method="post" id="commentform" class="section-inner thin max-percentage" novalidate="">
	:
	:

5.5の改良点

今回変更されたところは、コメントフォームのコンテナであるdiv要素のクラス属性である。5.5ではパラメータとなる連想配列に'class_container'キーが追加され、このクラス属性を任意の内容が指定可能になっている。このキーの指定を省略した場合は、'comment-respond'が適用されるようになっており、互換性は維持されている。

次のコードでは'class_container'キーの値に'comment-respond comment-container'を指定してみた。このように、スペースで区切ることで複数のクラスを指定可能である。

comment_form(
	array(
		'class_container'    => 'comment-respond comment-container',
		'class_form'         => 'section-inner thin max-percentage',
		'title_reply_before' => '<h2 id="reply-title" class="comment-reply-title">',
		'title_reply_after'  => '</h2>',
	)
);

出力されたdiv要素は次の通りで、上記で指定した内容がクラス属性として適用されていることがわかる。

<div id="respond" class="comment-respond comment-container">

この改良点はとてもWordPressっぽい感じがする。CSSやJavaScriptを使ったカスタマイズがやりやすくなるのかな。


最終更新 : 2020年08月12日 08:26


お勧め

wp_authenticate(2022年1月31日 更新)

WP_User | WP_Error wp_authenticate( string $username, string $password )
ユーザー認証を行う。

wp_send_json_success(2020年12月10日 更新)

void wp_send_json_success( [ mixed $response = null [ , int $status_code = null [ , int $options = 0 ] ] ] )
AJAXリクエストの成功レスポンスとしてJSON情報を返す。

wp_oembed_get(2014年11月16日 更新)

mixed wp_oembed_get( string $url [ , mixed $args = '' ] )
oEmbedに対応したページの埋め込み用コンテンツを取得する。

setup_postdata(2014年11月16日 更新)

bool setup_postdata( stdClass $post )
投稿記事に関連するグローバル変数を設定する。

the_permalink(2018年5月27日 更新)

void the_permalink( [ mixed $post = 0 ] )
現在の投稿データのパーマリンクを表示する。