勉強したことのメモ

Webエンジニア / プログラマが勉強したことのメモ。

WordPressのユーザー画像とプロフィールの登録及び表示方法

   2024/02/22  WordPress

WordPressでユーザー毎に画像とプロフィール部分にHTMLタグを登録したかった。また、登録したものを特定のページに表示させたかった。以下に方法をメモ。

 

画像の登録はプラグインを使う

画像の登録は以下プラグインを使う。インストールして有効化するだけで、ユーザー編集ページに画像登録部分が表示される。

Simple Local Avatars

https://tzm.wordpress.org/plugins/simple-local-avatars/

 

画像の出力とプロフィールのHTML入力

以下をテーマフォルダのfunctions.phpに追記する。

//ユーザーアバター取得
function get_user_avatar_img($userid){
    $tmp_img = get_avatar($userid);
    $search = '/<img.*?src=(["\'])(.+?)\1.*?>/i';
    if(preg_match($search, $tmp_img, $url)){
        $author_img = $url[2];
        $author_img = str_replace('-96x96.png', '.png', $author_img);
        $author_img = '<img src="'.$author_img.'">';
    }else{
        $author_img = get_avatar($userid);
    }
    return $author_img;
}


//ユーザープロフィールにHTML挿入
remove_filter('pre_user_description', 'wp_filter_kses');
add_filter('pre_user_description', 'wp_filter_post_kses');

画像の方はget_avatar関数で出力できるが、この関数を使うとwidthとか色々追記されてしまう。それでも良い場合はget_avatar関数を使えば良いが、まずい場合はget_user_avatar_img関数で画像のurlのみ取得する。

 

出力方法

<?php
$users = get_users( array('orderby' => ID, 'order' => ASC) );
foreach($users as $user){
    $uid = $user->ID;
    $user_data = get_userdata($uid);
    $author_img = get_user_avatar_img($uid);
?>
    画像:<?php echo $author_img;?><br>
    名前:<?php echo $user->display_name;?><br>
    プロフィール:<?php echo $user_data->user_description;?>
<?php } ?>

上記のような形で出力できる。

 - WordPress

  関連記事

WordPressの自動更新(アップデート)を無効化する方法
WordPressの自動更新(アップデート)を無効化する方法

あるサーバで通常はロードアベレージが1未満だけど10以上に上がりサーバに接続しづ ...

WordPress Popular Postsのサムネイルが表示されない
WordPress Popular Postsのサムネイルが表示されない

WordPressの人気記事を表示させるWordPress Popular Po ...

WordPressのContact Form 7プラグインで入力内容確認及び送信完了ページを実装する方法
WordPressのContact Form 7プラグインで入力内容確認及び送信完了ページを実装する方法

WordPressのContact Form 7プラグインで実装されたお問い合わ ...

WordPressでデータベース接続確立エラー発生時の対応方法
WordPressでデータベース接続確立エラー発生時の対応方法

WordPressで「データベース接続確立エラー」というエラー表示がされた。大抵 ...

Advanced Custom Fieldsで設定した項目を条件に記事一覧を取得する方法
Advanced Custom Fieldsで設定した項目を条件に記事一覧を取得する方法

WordPressでAdvanced Custom Fieldsにて設定した項目 ...