WordpressでAuthor一覧をTumblrのフォロワーみたいにサムネ画像付きで表示させてみました。
色々とハマったのでメモメモ。
User Photoプラグインをインストール
■ User Photoプラグインのサイト
Wordpressの管理画面からプラグイン > 新規追加ボタンを押し、
キーワードに『User Photo』として検索インストール・有効化して下さい。
インストールするとユーザーの編集の一番下に画像をupload出来る様になっているので、すきな画像をupします。
User Photoプラグインをカスタマイズ
User Photoプラグインはデフォルトでuserphoto(user_id)を呼ぶと、自動的にimgタグをechoしてくれます。
しかし、imgタグにupした際のwidthとheightが指定されているし、echoで表示せずに変数に入れたい事も出てくるので、画像のパスを返す(return)するfunctionを作ってしまします。
プラグインの編集からuser-photo.phpを開きます。
301行目くらいに有るデフォルのfunction userphoto()を参考に作って行きます。
テンプレートから呼び出すuserphoto_path(user_id)関数を作成
user-photo.phpに次の関数を書き足します。
//user-photo.php
function userphoto_path($user, $echo=0) {
if(is_numeric($user)) {
$userid = intval($user);
} else if(is_object($user) && @$user->ID) {
$userid = $user->ID;
} else if(is_string($user)){
$user = get_userdatabylogin($user);
if(!$user)
return;
$userid = $user->ID;
} else {
return;
}
if($echo) {
echo userphoto__get_path($userid, USERPHOTO_FULL_SIZE);
} else {
return userphoto__get_path($userid, USERPHOTO_FULL_SIZE);
}
}
関数にuser_idが渡された場合はuserphoto__get_path()を呼び出して、その返り値を返します。
userphoto_path()を呼び出す際に、弟2引数を1にすると、パスをそのまま表示(echo)するようにしました。
サムネ画像のパスを返すuserphoto__get_path()関数を作成
そのまま次の関数も書き加えます。
//user-photo.php
function userphoto__get_path($user_id, $photoSize) {
global $userphoto_prevent_override_avatar;
if($user_id && ($userdata = get_userdata($user_id))){
if(($userdata->userphoto_approvalstatus == USERPHOTO_APPROVED) &&
$image_file = ($photoSize == USERPHOTO_FULL_SIZE ? $userdata->userphoto_image_file : $userdata->userphoto_thumb_file)) {
$upload_dir = wp_upload_dir();
if(!empty($upload_dir['error'])) {
return "Error: " . $upload_dir['error'];
}
$src = trailingslashit($upload_dir['baseurl']) . 'userphoto/' . $image_file;
return $src;
};
};
return;
}
これで、テンプレートからuserphoto_path(user_id)を呼ぶとユーザーのサムネ画像のパスが得られる様になりました。
テンプレートでユーザー(投稿者)一覧を表示する
一覧を表示したいテンプレートに記述して行きます。使い回すならfunction化してfunctions.phpに書いてしまっても良いかも知れません。
Wordpress関数のget_users_of_blog()でユーザーのデータが配列に入った物が取得出来るので、コレを利用します。
<?php
$users = get_users_of_blog();
foreach ( $users as $user ){
//デフォルトの管理者adminは表示しない。
if(!($user->ID == 1 && get_the_author_meta('user_level',$user->ID) == 10)) {
//User Photo を設定している場合
if(userphoto_exists($user)){
$iconalt = get_the_author_meta('nickname', $user->user_id);
//投稿者別アーカイブのパス
$link = get_author_posts_url($user->user_id);
//width,height 50pxで表示
$img = '<img src="'.userphoto_path($user->ID).'" width="50" height="50" alt="'.$iconalt.'" />';
echo '<a href="'.$link.'">'.$img.'</a>';
}
}
}
?>
コノ記述はサムネの大きさを指定せずにCSSで設定するとか、
User Photoを設定してない場合や表示せずにreturnするなど、利用方法に合わせて変更して下さい。
とりあえず、私はこれで出来ました。ってのをメモとして書いていますので、
何かしら不具や間違い等があるかもしれませんので、ご了承下さい。
