会員制のサイトを作成する時に便利な「WP-Members」ですが、WP-Membersで作成した登録フォームには、「*必須項目」という注意書きが表示されます。
デフォルトでは、「*必須項目」はフォームの下(登録ボタンの下)に表示されます。ですが、表示位置を別の場所に移動したいというケースもあるかと思います。実際にフォームの上に表示位置を移動してほしいという要望をいただいたこともあります。
そんなわけで、今回は「*必須項目」の表示位置をフォームの上部に変更する方法を紹介したいと思います。
WP-Membersの登録フォームに表示される「*必須項目」の位置を変更する方法
適用しているテーマのfunctions.phpに以下を追記することで、「*必須項目」の表示位置を上部に移動できます。
function my_register_form_args( $args ) {
$args = array(
'req_label' => '',
'heading_after' => '</legend>
<div class="req-text"><span class="req">*</span>必須項目</div>',
);
return $args;
}
add_filter('wpmem_register_form_args', 'my_register_form_args', 10, 1);まず、「’req_label’ => ”」で必須項目の表示を消して、heading_afterに必須項目のHTMLを入れることで表示位置を変更しています。この場合、フォームタイトルのすぐ下に「*必須項目」が表示されます。
なお、heading_afterの部分を変えると、挿入位置も変わります。
$args = array(
'heading_before' => 'heading_before<legend>',
'heading_after' => '</legend>heading_after',
'fieldset_before' => 'fieldset_before <fieldset>',
'fieldset_after' => '</fieldset>fieldset_after',
'main_div_before' => 'main_div_before<div id="wpmem_reg">',
'main_div_after' => '</div>main_div_after',
'txt_before' => 'txt_before',
'txt_after' => 'txt_after',
'row_before' => 'row_before',
'row_after' => 'row_after',
'buttons_before' => 'buttons_before<div class="button_div">',
'buttons_after' => '</div>buttons_after',
);挿入位置によっては、値に開始タグや閉じタグを入れる必要があります。今回は、フォームタイトルの下であるheading_afterに挿入したので、最初にlegendの閉じタグを入れています。
各種挿入される位置は以下の通りです。
| heading_before | フォームタイトルの前 |
| heading_after | フォームタイトルの後 |
| fieldset_before | fieldsetタグの前 |
| fieldset_after | fieldsetタグの後 |
| main_div_before | フォーム全体を包括しているdivタグの前 |
| main_div_after | フォーム全体を包括しているdivタグの後 |
| txt_before | フォーム全体の前 |
| txt_after | フォーム全体の後 |
| row_before | 各フォーム項目の前 |
| row_after | 各フォーム項目の後 |
| buttons_before | 登録ボタンの前 |
| buttons_after | 登録ボタンの後 |
あとがき
すごくニッチな話でしたが、「*必須項目」の表示位置を変更したい時は参考にしていただければと思います。