Cara Merubah Template comment_form() WordPress

comment_form() adalah fungsi yang baru diperkenalkan WordPress versi ke 3.0 pada 2013 silam. Tujuan dihadirkannya fungsi ini adalah untuk memudahkan filter pada tiap bagian yang berbeda dari form komentar default WordPress dalam hal memudahkan kustomisasi tampilan, termasuk menambahkan sesuatu bagian tertentu secara spesifik, seperti placeholder.

Melihat banyaknya pertanyaan terkait hal ini, sepertinya penjelasan pada halaman codex comment_form(); dinilai tidak cukup mampu memandu pengguna WordPress untuk memanfaatkan fungsi ini. Melanjutkan itu, berikut ini tutorial cara merubah/menambah bagian tertentu pada template html comment_form(); WordPress

Memperbarui Bidang (nama, email, url) Komentar Default

Sebelumnya, pastikan bahwa di folder theme anda terdapat file comments.php dan memiliki atau memanggil fungsi comment_form();. Baris perintah filter dibawah ini akan bekerja pada output dari fungsi tersebut.

Tambahkan fungsi berikut ini dalam file functions.php anda

function my_update_comment_fields( $fields ) {

	$commenter = wp_get_current_commenter();
	$req       = get_option( 'require_name_email' );
	$label     = $req ? '*' : ' ' . __( '(optional)', 'text-domain' );
	$aria_req  = $req ? "aria-required='true'" : '';

	$fields['author'] =
		'<p class="comment-form-author">
			<label for="author">' . __( "Name", "text-domain" ) . $label . '</label>
			<input id="author" name="author" type="text" placeholder="' . esc_attr__( "Jane Doe", "text-domain" ) . '" value="' . esc_attr( $commenter['comment_author'] ) .
		'" size="30" ' . $aria_req . ' />
		</p>';

	$fields['email'] =
		'<p class="comment-form-email">
			<label for="email">' . __( "Email", "text-domain" ) . $label . '</label>
			<input id="email" name="email" type="email" placeholder="' . esc_attr__( "name@email.com", "text-domain" ) . '" value="' . esc_attr( $commenter['comment_author_email'] ) .
		'" size="30" ' . $aria_req . ' />
		</p>';

	$fields['url'] =
		'<p class="comment-form-url">
			<label for="url">' . __( "Website", "text-domain" ) . '</label>
			<input id="url" name="url" type="url"  placeholder="' . esc_attr__( "http://google.com", "text-domain" ) . '" value="' . esc_attr( $commenter['comment_author_url'] ) .
		'" size="30" />
			</p>';

	return $fields;
}
add_filter( 'comment_form_default_fields', 'my_update_comment_fields' );

Fungsi di atas akan terhubung ke filter comment_form_default_fields yang dijalankan sebelum WordPress menampilkan bidang (nama, email, url) form komentar default.

Fungsi my_update_comment_fields akan mengakses array $fields dan mengubah input penulis, email, dan url lalu mengembalikannya untuk di tayangkan.

Fungsi diatas menambahkan beberapa pembaruan pada form komentar berikut, anda dapat langsung menggunakannya atau merubahnya sesuai kebutuhan:

1. Input email dan situs web menggunakan HTML5. Dengan begitu, penggunaan type="email" dapat meningkatkan pengalaman pengguna khususnya mobile/seluler lebih baik.
2. Panjang min & maks bidang input name (dapat dimodifikasi atau dihapus dengan mudah).
3. Penambahan placeholder, silahkan atur teks tertentu yang tayang sebelum bidang input diisi.

Sementara itu, berikut ini juga bagian lain dari bidang comment_form() yang dapat dimodifikasi. Textarea atau bidang isi komentar, anda dapat menggunakan baris perintah ini untuk memodifikasinya sesuai keinginan:

function my_update_comment_field( $comment_field ) {
  $comment_field =
    '<p class="comment-form-comment">
            <label for="comment">' . __( "Comment", "text-domain" ) . '</label>
            <textarea required id="comment" name="comment" placeholder="' . esc_attr__( "Enter comment here...", "text-domain" ) . '" cols="45" rows="8" aria-required="true"></textarea>
        </p>';
  return $comment_field;
}
add_filter( 'comment_form_field_comment', 'my_update_comment_field' );

Demikian panduan merubah template comment_form() di WordPress, gunakan perintah-perintah diatas tanpa perlu ragu untuk memberi perubahan sesuai dengan kebutuhan website kesayangan anda.