2013-3-8の勉強会で、ランサーしょうじさんへお伝えしようとした内容を、改めて整理して実装してみました。
まず、ユーザー一覧ページを作る条件は以下の通りでした。
- 登録されたユーザーのアバターやプロフィール情報を自動取得して表示したい
- テーマはTwenty Twelveのクローン。テンプレートファイルの編集はアリとする。
- ページ自体は固定ページで作成
- 他の固定ページには影響を与えないこと
やり方は色々とあると思いますが、以下の考え方で実装しました。
- ユーザー一覧用に、固定ページを作成し、本文には「以下が現在のメンバー一覧です」までを書く
- 作成した固定ページのIDを調べる
- テンプレートファイル「page.php」内で if( is_page(ID) ) :で分岐させ、endif;までの間に処理を書く
- get_users()でユーザー情報を取得し、変数に格納しておいて、foreachで処理。
具体的には、ループの内部にある、get_template_part( ‘content’, ‘page’ ); と、comments_template( ”, true ); の間に処理を入れて、以下のようになります。
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 |
$users =get_users( array('orderby'=>ID,'order'=>ASC,) ); echo '<ul class="users">'; foreach($users as $user): $uid = $user->ID; $userData = get_userdata($uid); echo '<li class="author-info">'; echo '<div class="author-avatar">'; echo get_avatar( $uid ,100 ); echo '</div>'; echo '<div class="author-description">'; echo '<h2><span class="uid">'.$user->ID.'</span>'; echo '<span class="nickname">'.$user->display_name.'</span></h2>'; echo '<p>'.$userData->user_description.'</p>'; echo '<div class="author-link">'; if( count_user_posts($uid) > 0 ): echo '<a class="userposts" href="'.get_bloginfo(url).'/?author='.$uid.'">'.$user->display_name.'の全ての投稿を見る</a>'; else : echo '<span class="userposts noposts">'.$user->display_name.'の投稿は、まだありません。</span>'; endif; echo '</div>'; echo '</div>'; echo '</li>'; endforeach; echo '</ul>'; |
htmlとして出力したら、cssで整えて完成です。
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 |
/*ユーザー一覧用の装飾*/ .users .author-info { padding: 1em; border-radius: 1em; background-color:#ffe; } .users .author-info:nth-child(even) { background-color:#eee; } .users p { line-height:1.5; margin: 1em 0; } .users .avatar { border-radius: 50%; box-shadow: 0 0 0.1em #333; } .users .uid, .users .nickname { display:inline-block; background:rgba(0,0,0,0.5); color:#fff; padding:0.2em; margin-right:0.3em; } |
ありがとうございます。こういうことがしたかったのです。
PHPの記述のところが今一つ理解できませんが、これから順を追って精読してみます。
CSSの方は、背景色とAvatar画像のborderを変えてみました。
ピンバック: 2013-3-15勉強会 | パソコン倶楽部りんご
初めまして、WordPress勉強中のyuumaと申します。
まさにやりたいとしていた事がこちらで見つかりました。本当に感謝いたします。
今ユーザー一覧ページを作っていまして、こちらで書かれている事を参考に何とか設置できました。
しかし、ユーザーが今30人ほどいて、一覧表示すると重たく長すぎるので、5人ほどでページ送りしたいと思っています。
何か良い方法がないかと考えていたのですが、どうしても答えが出なくて、、、コメントした次第です。
アドバイスいただけないでしょうか?
それと、パソコン倶楽部りんご様のサイトを僕のサイトでリンク紹介してよろしいでしょうか?
http://yuuma7.com/
見ず知らずのものがいきなり質問してしまい申し訳ございません・・・
yuumaさんコメントありがとうございます。
固定ページをページ送りしたいのですよね?
TAKAHASHI先生のアドバイスで、検索してみました。
検索→ ワードプレス 固定ページ ページ送り
こちらのサイトがでてきました。
http://kachibito.net/wordpress/stacking-posts-in-a-grid.html
固定ページのテンプレートでもページ送りができるように改造すればできるはずです。
なので、こちらを見て下さい!
参考サイト
yuumaさん
はじめまして。
僕もバッグひとつもってNew Zealandに1年、アメリカに数ヶ月いたこととがあります。昨年はサーフボードをもってバリ島にいってきました。バンドをやってフリーでwebデザイナーしてサーフィンして、回りからは自由人といわれています。自分でもそう思います。
yuumaさん一家の生き方、とても素敵だと思います。なんだか気が合いそうなきがします。
機会があったら会ってみたいですねー。
のぶ
のぶ ブログhttp://blog.livedoor.jp/happygolucky1969/
>それと、パソコン倶楽部りんご様のサイトを僕のサイトでリンク紹介してよろしいでしょうか?
もちろん!よろしくお願いします。
タカハシです。ユーザー一覧ページにページ送りを付ける方法の記事を書きましたので、ご参考にしていただければ幸いです。
WordPressのユーザー一覧ページ用のテンプレート
ピンバック: WordPressのユーザー一覧ページ用のテンプレート | パソコン倶楽部りんご