会員制サイトの構築に便利なTheme My Loginをカスタムするコツ（応用編）

先日の記事「会員制サイトの構築に便利なTheme My Loginをカスタムするコツ（設定編）」の続きです。本日は登録フォームのカスタマイズ方法など細かな設定を行なっていきます。会員制サイトとなるとカスタムしたくなる部分が意外と多いですがすべて行うと膨大な費用がかかるので本記事ではさくっと進めましょう。

＜カスタムする部分＞
・ユーザー登録専用の入力フォーム
・登録フォームの文言を変更
・ユーザー登録時の自動配信メール

＜本来するべき部分＞
・外部ライターさんが記事の投稿に迷わないように投稿画面で不要なメニューを非表示にする
・投稿画面で外部ライターさんがつまづきそうなわかりづらい文言を適切に変更する
・管理画面内で優先度が低めのコンテンツや外部ライターさんが使っていない機能は削除
・他のライターさんが投稿した記事やアップロードした画像を見えなくする処理
・各ライターさんのがログインした際に限り新規記事作成画面に自動で転送（管理者ではしない）
・記事作成時に参考にした文献などをメモとして書き留められる機能を実装しておく

Theme My Loginで会員制サイトを作成するコツ（設定編）

なお、今回の記事では「テーマ」を変更いたしました。前回まではTwenty Twentyでしたが「Twenty Fifteen」に切り替えています。ちなみにTheme My Loginはどんなテーマにでも導入可能なので参考用です。

では今回は登録フォームに独自の項目を追加していきましょう。カスタマイズは導入中のテーマのフォルダ内にある「functions.php」へ追記すればOKです。ただ、テーマによっては定期的なアップデート（更新）が入るのでかならず「子テーマ化」して「子テーマのなかにあるfunctions.php」を編集してください。

子テーマの導入後は下記のフォルダ構成になります。もし「Twenty Fifteen」の子テーマが必要であればこちらからダウンロードしてください。ZIP圧縮ファイルなので管理画面からでもアップロード可能です。

登録フォームに項目を追加する方法

登録フォームへの追加は以下の命令文で行います。

//登録フォームのカスタマイズ
function add_tml_registration_form_fields() {
	tml_add_form_field( 'register', 'my_full_name', array(
		'type'     => 'text',
		'label'    => '名前（必須）',
		'value'    => tml_get_request_value( 'my_full_name', 'post' ),
		'id'       => 'my_full_name',
		'priority' => 5,
	) );
}
add_action( 'init', 'add_tml_registration_form_fields' );

実際に書き込んだ状態が下記です。

すると登録フォームに追加されます。表示されるフォームの順番はpriorityの値で管理されています。

エラーメッセージの設定

ただ、この状態ではエラーメッセージが出力されません。元々のフォーム「ユーザー名」と「メールアドレス」には表示されますが追加したフォームに対してのメッセージは個別で設定が必要です。

- 新コースでワードプレスを学ぶ【AD】-

メッセージの設定は以下で行います。

function validate_tml_registration_form_fields( $errors ) {
	if ( empty( $_POST['my_full_name'] ) ) {
		$errors->add( 'empty_my_full_name', '<strong>エラー</strong>: 名前（必須）を入力してください。' );
	}
	return $errors;
}
add_filter( 'registration_errors', 'validate_tml_registration_form_fields' );

追加設定をするとエラーメッセージが表示されます。必須のみ設定すればOKです。

データの保存を設定する

次に登録フォームで送信した内容を保存するための設定を行います。

//データを保存する
	function save_tml_registration_form_fields( $user_id ) {
		if ( isset( $_POST['my_full_name'] ) ) {
			update_user_meta( $user_id, 'my_full_name', sanitize_text_field( $_POST['my_full_name'] ) );
		}
	}
	add_action( 'user_register', 'save_tml_registration_form_fields' );

以上で「入力された登録データの保存まで」が無事完了となります。手順を少し省略していても複雑ですね。やはり「会員登録ができる会員制サイト」は意外と処理が多いので複雑なカスタマイズになります。

ユーザー登録をテストする

登録フォームを少し微調整しました。都道府県のセレクトボックス化に対応すればプルダウンで47候補から選べるようになるのでより使いやすくなるはずです。今回はセレクトボックス化は省略いたします。

各フォーム直下の補足文字は'description' => '補足文字',として追加すれば使用可。本手順ではユーザー名とメールを「ユーザー名（必須）」と「メールアドレス（必須）」にしたので設定を上書き済みです。

登録が完了すると以下の画面に切り替わります。

メール内の「パスワード設定用リンク」を開くとパスワードを設定できます。

パスーワードの設定はリセット画面で下記で行います。

リセット後にログインすればOKです。

なお、「パスワード設定」をユーザー登録時に行うことも可能です。

ユーザー登録時にパスワードを設定する方がスムーズかもしれません。項目数が増えるので好みでOKです。

登録フォームのカスタマイズは以上です。

まとめ

前回の記事が基本的な設定、そして今回の記事が詳細の設定を行う応用編となります。記事の通り実装を行えば外部ライターさんが自らユーザー登録のフォーム画面から参加する流れまでが完成いたします。

文言調整など最終的な微調整は別の記事で作成するので次回の記事もぜひご参照くださいませ。