WordPressで会員制サイトを構築してみよう（ユーザー項目の変更 その2）

前回までで、ログイン/会員登録の機能が作れました。
今回は、プロフィールページの変更を行います。

関連記事一覧

• WordPressで会員制サイトを構築してみよう（事前準備）
• WordPressで会員制サイトを構築してみよう（ユーザー項目の変更 その1）
• 【→】Wordpressで会員制サイトを構築してみよう（ユーザー項目の変更 その2）
• WordPressで会員制サイトを構築してみよう（エラーテキスト、バリデーションの変更）
• WordPressで会員制サイトを構築してみよう（プロフィール更新時にメール通知）
• WordPressで会員制サイトを構築してみよう（Contact Form 7との連携）
• WordPressで会員制サイトを構築してみよう（GianismでSNSログイン）
• WordPressで会員制サイトを構築してみよう（Theme My Loginの新機能）
• WordPressで会員制サイトを構築してみよう（Theme My Login 6.4.3の仕様変更対応）
• WordPressで会員制サイトを構築してみよう（ユーザープロフィールをAjaxで更新させる）

ユーザー項目の確認

プロフィールページで変更させたい項目は下記です。

• 苗字（last_name）
• 名前（first_name）
• 郵便番号（user_zip）
• 都道府県（user_prefecture）
• 番地（user_address）
• プロフィール（user_text）
• メールアドレス（user_email）
• パスワード
• パスワード確認

プロフィールページ用テンプレートの変更

デフォルトの状態ですと、下記のようにいろいろ項目が設定されています。
これをいろいろと変更していきます。

ユーザー名（user_login）項目の変更

今回、ユーザー名の項目は利用する必要がありませんので非表示にします。
この項目は消すことは出来ないため、hiddenの項目にします。

<tr>
<th><label for="user_login"><?php _e( 'Username' ); ?></label></th>
<td><input type="text" name="user_login" id="user_login" value="<?php echo esc_attr( $profileuser->user_login ); ?>" disabled="disabled" class="regular-text" /> <span class="description"><?php _e( 'Your username cannot be changed.', 'theme-my-login' ); ?></span></td>
</tr>

↓

<input type="hidden" name="user_login" id="user_login" value="<?php echo esc_attr( $profileuser->user_login ); ?>" disabled="disabled" class="regular-text" />

不要な項目を削除

例えば、ニックネームの部分が必要ない場合は、下記の箇所を削除します。

/* profile-form.php */
<tr>
	<th><label for="nickname"><?php _e( 'Nickname' ); ?> <span class="description"><?php _e( '(required)' ); ?></span></label></th>
	<td><input type="text" name="nickname" id="nickname" value="<?php echo esc_attr( $profileuser->nickname ); ?>" class="regular-text" /></td>
</tr>

その他も同様に削りましょう。
そうすると、下記画像の項目だけが残ると思います。

テンプレートで消せない項目がある場合

ユーザープロフィールに、「AIM」「Yahoo IM」「Jabber」が表示されている場合、フィルタを利用して削除します。
（WordPressのバージョンによっては、この項目は最初から無い可能性があります）

/* functions.php */
/* user_contactmethods 変更 */
function my_user_meta($contacts) {
	unset($contacts['aim']);
	unset($contacts['yim']);
	unset($contacts['jabber']);
	return $contacts;
}
add_filter('user_contactmethods', 'my_user_meta', 10, 1);

オリジナルの項目を追加

下記のように、項目に合わせてprofile-form.phpを変更していきます。
「xxxxxxxxxx」の部分を、各項目のパラメータに置き換えればOKです。

テキストボックスの場合

/* profile-form.php */
<label for="xxxxxxxxxx">ラベル名</label>
<input type="text" name="xxxxxxxxxx" id="xxxxxxxxxx" value="<?php echo esc_attr( $profileuser->xxxxxxxxxx ); ?>" class="regular-text" />

セレクトボックスの場合

/* profile-form.php */
<label for="xxxxxxxxxx">ラベル名</label>
<select name="xxxxxxxxxx" id="xxxxxxxxxx">
<option value="">【選択してください】</option>
<?php
	$val_pref = !empty($profileuser->xxxxxxxxxx) ? $profileuser->xxxxxxxxxx : '';
	$val_list = array("選択肢1", "選択肢2", "選択肢3");
	foreach($val_list as $list){
		$selected = $val_pref == $list ? 'selected="selected"' : '';
		echo '<option value="' . $list . '" ' . $selected  .  '>' . $list . '</option>';
	}
?>
</select>

テキストエリアの場合

/* profile-form.php */
<label for="xxxxxxxxxx">ラベル名</label>
<textarea name="xxxxxxxxxx" id="xxxxxxxxxx"><?php echo esc_attr( $profileuser->xxxxxxxxxx ); ?></textarea>

ラジオボタン

/* profile-form.php */
// デフォルトで「選択肢1」を選択

<label for="xxxxxxxxxx_1">
	<input type="radio" name="xxxxxxxxxx" id="xxxxxxxxxx_1" class="input" value="選択肢1"<?php if (!empty($profileuser->xxxxxxxxxx) && $profileuser->xxxxxxxxxx == '選択肢1' ) { echo ' checked="checked"'; } elseif (empty($profileuser->xxxxxxxxxx)) { echo ' checked="checked"'; } ?> /><span>選択肢1</span>
</label>
<label for="xxxxxxxxxx_2">
	<input type="radio" name="xxxxxxxxxx" id="xxxxxxxxxx_2" class="input" value="選択肢2"<?php if (!empty($profileuser->xxxxxxxxxx) && $profileuser->xxxxxxxxxx == '選択肢2' ) echo ' checked="checked"'; ?> /><span>選択肢1</span>
</label>

チェックボックス

/* profile-form.php */
<input type="checkbox" name="xxxxxxxxxx" id="xxxxxxxxxx_1" class="input" value="選択肢1" <?php if (!empty($profileuser->xxxxxxxxxx) && $profileuser->xxxxxxxxxx == '選択肢1' ) echo ' checked="checked"'; ?> />

これでテンプレートの変更は完了です。

プロフィール更新処理の追加

この状態でプロフィールを更新しても、追加した項目はDBに記録されません。
その処理をfunctions.phpに追加する必要があります。

/* functions.php */
function user_profile_update($user_id, $old_user_data) {
	// 追加した項目を追加
	update_user_meta( $user_id, 'first_name',$_POST['first_name']);
	update_user_meta( $user_id, 'last_name',$_POST['last_name']);
	update_user_meta( $user_id, 'user_zip',$_POST['user_zip']);
	update_user_meta( $user_id, 'user_prefecture',$_POST['user_prefecture']);
	update_user_meta( $user_id, 'user_address',$_POST['user_address']);
	update_user_meta( $user_id, 'user_text',$_POST['user_text']);
}
add_action( 'profile_update', 'user_profile_update', 10, 2 );

フック profile_update を利用して、オリジナルの項目を追加しています。

またこの時独自の処理を追加することも出来ます。
例えば、プロフィールを更新した日時を追加する場合は下記のような処理を追加すれば良いと思います。

/* functions.php */
function user_profile_update($user_id, $old_user_data) {
	・・・
	・・・
	/* 更新日時 */
	update_user_meta( $user_id, 'user_update_date',date_i18n("Y年n月j日"));
}

これで、プロフィールを変更することが出来るようになりました。
次回は、バリデーションなどの処理について書いてみます。

参考

下記サイト様を参考にさせていただきました。

• つながるねっとさん

関連記事一覧

• WordPressで会員制サイトを構築してみよう（事前準備）
• WordPressで会員制サイトを構築してみよう（ユーザー項目の変更 その1）
• 【→】Wordpressで会員制サイトを構築してみよう（ユーザー項目の変更 その2）
• WordPressで会員制サイトを構築してみよう（エラーテキスト、バリデーションの変更）
• WordPressで会員制サイトを構築してみよう（プロフィール更新時にメール通知）
• WordPressで会員制サイトを構築してみよう（Contact Form 7との連携）
• WordPressで会員制サイトを構築してみよう（GianismでSNSログイン）
• WordPressで会員制サイトを構築してみよう（Theme My Loginの新機能）
• WordPressで会員制サイトを構築してみよう（Theme My Login 6.4.3の仕様変更対応）
• WordPressで会員制サイトを構築してみよう（ユーザープロフィールをAjaxで更新させる）