1. ホーム
  2. WordPress

【WordPress】ユーザープロフィールページに独自の設定項目を追加する（プラグインなし）

Share

WordPressでサイトを運営していると、「執筆者のSNSリンクを増やしたい」「役職や資格を表示したい」といった要望が出てきます。

プラグインを使わず、functions.phpにコードを数行追加するだけで、管理画面のプロフィール欄を自由にカスタマイズ可能です。

今回は、WordPressのユーザープロフィールページに、テーマ独自の設定項目を追加する方法を紹介します。

なぜプロフィール項目の拡張が必要なのか？

現在のSEOにおいて、「誰が書いたか（E-E-A-T：専門性・権威性・信頼性）」は極めて重要です。

標準のWordPressプロフィール項目（サイト、メールアドレス等）だけでは、専門家のバックグラウンドを十分に伝えられません。

  • SNSリンクの拡充: X（Twitter）やLinkedInなどのリンクを追加。
  • 資格・実績: 「〇〇認定資格保持」などの項目を追加。
  • 権威性の向上: 構造化データ（JSON-LD）として出力するためのフックにする。

以上の情報を掲載することで、著者の詳細を明らかにして信頼性を高めることができます。

ユーザープロフィールページに設定項目を追加する方法（type=”text”の場合）

<input type="text">での設定項目を追加したい場合は、追加方法はシンプルです。

functions.php
function my_theme_user_contactmethods($wb) {
    //項目の追加
    $wb['instagram'] = 'instagramのURL';

    return $wb;
}
add_filter( 'user_contactmethods', 'my_theme_user_contactmethods', 10, 1 );

多言語化している場合は、以下のようにします。

functions.php
function my_theme_user_contactmethods($wb) {

    $wb['instagram'] = __( 'instagramのURL', 'my-theme' );

    return $wb;
}
add_filter( 'user_contactmethods', 'my_theme_user_contactmethods', 10, 1 );

オリジナルのフォームを追加する方法

type=”text”のフォームを追加するのは上記の方法で可能ですが、より拡張性が高いカスタマイズ方法も紹介します。

プロフィール項目の表示と保存の仕組み

WordPressのプロフィール画面を拡張するには、主に2つのアクションフックを使用します。

フック名役割
show_user_profile自分のプロフィール画面に項目を表示する
edit_user_profile他のユーザーのプロフィール編集画面に項目を表示する
personal_options_update自分のプロフィール保存時にデータを更新する
edit_user_profile_update他のユーザーのプロフィール保存時にデータを更新する

実装コード（functions.php）

以下のコードを、お使いのテーマの functions.php に追記してください。今回は例として「X（Twitter）のユーザー名」と「役職」を追加します。

項目の表示

まずは管理画面にフォームを表示させるコードです。

PHP
/**
 * プロフィールにカスタム項目を追加
 */
function my_custom_user_profile_fields( $user ) {
    ?>
    <h3>追加情報（SNS・役職）</h3>
    <table class="form-table">
        <tr>
            <th><label for="user_x_id">X (Twitter) ID</label></th>
            <td>
                <input type="text" name="user_x_id" id="user_x_id" value="<?php echo esc_attr( get_the_author_meta( 'user_x_id', $user->ID ) ); ?>" class="regular-text" /><br />
                <span class="description">@を除いたユーザー名を入力してください。</span>
            </td>
        </tr>
        <tr>
            <th><label for="user_job_title">役職・肩書き</label></th>
            <td>
                <input type="text" name="user_job_title" id="user_job_title" value="<?php echo esc_attr( get_the_author_meta( 'user_job_title', $user->ID ) ); ?>" class="regular-text" />
            </td>
        </tr>
    </table>
    <?php
}
add_action( 'show_user_profile', 'my_custom_user_profile_fields' );
add_action( 'edit_user_profile', 'my_custom_user_profile_fields' );

データの保存

入力された値をデータベース（wp_usermeta）に保存するための処理です。

PHP
/**
 * カスタム項目の保存処理
 */
function save_my_custom_user_profile_fields( $user_id ) {
    // 権限チェック
    if ( ! current_user_can( 'edit_user', $user_id ) ) {
        return false;
    }

    // データの更新（サニタイズを忘れずに）
    update_user_meta( $user_id, 'user_x_id', sanitize_text_field( $_POST['user_x_id'] ) );
    update_user_meta( $user_id, 'user_job_title', sanitize_text_field( $_POST['user_job_title'] ) );
}
add_action( 'personal_options_update', 'save_my_custom_user_profile_fields' );
add_action( 'edit_user_profile_update', 'save_my_custom_user_profile_fields' );

フロントエンド（テーマ内）での表示方法

保存したデータを取り出すには、get_the_author_meta() を使用します。

PHP
// 記事ページ（single.php）などで執筆者の情報を表示する場合
$x_id = get_the_author_meta( 'user_x_id' );
$job_title = get_the_author_meta( 'user_job_title' );

if ( $x_id ) {
    echo '<a href="https://x.com/' . esc_attr( $x_id ) . '">X（旧Twitter）はこちら</a>';
}

SEOを意識した工夫

単に表示するだけでなく、エンジニアであれば以下の点も考慮しましょう。

  1. サニタイズとエスケープの徹底:sanitize_text_field() で保存し、esc_attr() や esc_html() で出力するのは鉄則です。
  2. 構造化データ（Author）への統合:ここで取得した情報を、wp_head 内で出力するJSON-LDの author プロパティに紐づけることで、検索エンジンに対して執筆者の専門性をより明確に伝えることができます。
  3. ACF（Advanced Custom Fields）との使い分け:項目が膨大な場合や、画像（プロフィール写真以外の画像など）を扱う場合は、メンテナンス性を考えてACFを使うのも一つの手ですが、数個のテキスト項目であれば今回の自作コードの方が軽量です。

まとめ

WordPressのユーザープロフィール拡張は、テーマ開発において非常に頻出するカスタマイズです。

自作してプラグインを減らすことは、サイトの表示速度高速化やセキュリティリスクの低減にも直結します。

ぜひ、あなたのサイトでも「執筆者の信頼性」を高めるための項目を追加してみてください。

参考サイト