あなたのサイトの投稿者について話しましょう。彼らはページ上の単なる名前ではありません。彼らは専門家であり、ストーリーテラーであり、あなたのブランドを支える声なのです!
彼らの経験や専門知識を紹介することで、読者との強いつながりを築き、サイトの検索順位を上げることもできる。
問題は、多くのWordPressテーマが基本的な投稿者情報ページしか提供しておらず、少々退屈に見えることだ。これではチャンスを逃してしまいます。
実際にインパクトを与えるような、より魅力的で有益な投稿者プロフィールページを作成する方法について、よく質問を受けます。
この投稿では、WordPressでサイト訪問者の印象に残るカスタム投稿者プロフィールページを作成する方法をご紹介します。投稿者プロフィールを輝かせましょう!

ここでは3つの方法を取り上げる。以下のリンクから興味のあるセクションにジャンプしてください:
方法1:SeedProdを使ってWordPressにカスタム投稿者プロフィールページを作成する(推奨)
WordPressでカスタマイザープロフィールページを作成する最良の方法は、SeedProdプラグインを使用することです。
SeedProdはWordPressのための最高のドラッグアンドドロップページビルダーです。あなたのサイトのすべてのライターのための美しい著者ページを含む、カスタマイザーWordPressテーマとページレイアウトを簡単に作成することができます。
あらかじめ用意されたテーマのライブラリが付属しており、あなたのページを即座にプロフェッショナルな外観に仕上げることができます。さらに、ページブロックを使って、画像、ソーシャルプロフィール、最近の投稿などで著者プロフィールページをフルカスタムできます。
開始するには、SeedProdプラグインをインストールして有効化する必要があります。ステップバイステップの手順については、WordPressプラグインのインストール方法のチュートリアルをご覧ください。
注: SeedProdには無料版があります。しかし、カスタムオーサーページテンプレートを使用するには、Proバージョンが必要です。
プラグインを有効化したら、WordPressダッシュボードからSeedProd ” Theme Builderに行き、’Theme Templates Kit’ボタンをクリックします。

SeedProdの既成サイトキットのライブラリに移動します。
サイトテーマを選ぶには、気に入ったデザインにマウスオーバーし、チェックマークアイコンをクリックするだけです。

選択後、SeedProdはサイトキットをインポートし、テーマビルダーのダッシュボードにテンプレートパーツのリストが表示されます。
ホームページ、ブログページ、お問い合わせページなど、サイト開設に必要なテンプレートパーツがすべて揃っています。
どのテンプレートでも「デザインの編集」リンクをクリックすると、ドラッグ&ドロップのテーマビルダーを使ってカスタマイザーにカスタマイズすることができます。

ステップバイステップの手順については、カスタマイザーWordPressテーマの作成方法をご覧ください。
カスタム投稿者ページテンプレートの作成
サイトテーマのカスタマイザーが終わったら、次は投稿者プロフィールページを作成しましょう。
そのためには、SeedProd ” Theme Builderに移動し、’Add New Theme Template’ボタンをクリックします。

新規テーマテンプレートポップアップが開きます。
次に、「タイプ」ドロップダウンメニューで、「投稿者ページ」オプションを選択します。

すべての投稿者に同じ投稿者ページレイアウトを適用したい場合は、「投稿者条件」セクションの下に表示される空欄を無視することができます。
ただし、投稿者ごとに固有の投稿者ページを作成したい場合は、このフィールドに特定の投稿者のユーザーIDを入力する必要があります。例えば、ユーザーIDが2の場合、空欄に入力してください。

WordPressでユーザーIDを探すのに助けが必要な場合は、こちらのガイドを参照してください。
次に、「保存」ボタンをクリックして続けます。
投稿者プロフィールページのカスタマイズ
投稿者ページテンプレートの設定が完了したら、その下にある「デザインを編集する」リンクをクリックしてカスタマイザーを始めることができます。

これでSeedProdのページビルダーでテンプレートが開きます。
左側には、ページに追加できるブロックとセクションが表示されます。右側にはページのプレビューが表示され、まだコンテンツが追加されていないので空白になっています。

これでコンテンツを追加し始めることができる。
カラムの追加」アイコンをクリックして、ページレイアウトを設定します。

次に、カラムレイアウトの選択が表示されます。
投稿者ページに必要なカラムレイアウトのタイプを選択してください。

これでSeedProdの既製ブロックをページに追加できます。
例えば、「見出し」ブロックをページにドラッグして、投稿者の見出しを追加することができる。

見出しをカスタマイズするには、それをクリックするだけです。
投稿者名を入力したり、サイズや配置などを調整できるパネルが開きます。

次に、「投稿者プロフィール」ブロックをページにドラッグして、投稿者に関する情報を表示することができます。
このブロックは、投稿者のWordPressユーザープロフィールから自動的にコンテンツを取得します。

投稿者の最近の投稿を紹介できるようになりました。
投稿」ブロックをページにドラッグするだけです。

投稿ブロックを追加したら、それをクリックして「クエリータイプ」をカスタマイザーに設定する。
次に、「投稿者別クエリー」トグルを有効化し、ドロップダウンリストから特定の投稿者を選択する。

これで、その投稿者の投稿のみが投稿者ページに表示されるようになります。
投稿者ページのカスタマイザーはさらに続けることができます。例えば、「テキスト」や「Image」ブロックを追加して、投稿者に関する追加情報を含めることができます。また、ソーシャルプロフィール、ソーシャルシェア、推薦文などのブロックを追加することもできます。

投稿者ページの外観に満足したら、画面上部の「保存」ボタンをクリックし、ページビルダーを終了します。
カスタマイザーの投稿者プロフィールページを公開する
サイト上で投稿者ページを有効化するには、カスタマイザーのテーマを有効化する必要があります。
これを行うには、SeedProd ” Theme Builderにアクセスしてください。そこから’SeedProdテーマを有効化’トグルを見つけて’はい’の位置に切り替えてください。

SeedProdはあなたのカスタムWordPressテーマを公開します。
あなたのサイトにアクセスして、新しい投稿者プロフィールページを実際にご覧ください。

方法2:WP User Managerを使ってWordPressにカスタム投稿者プロフィールページを追加する。
この方法は設定が簡単だが、SeedProdほどデザインやカスタマイザーのオプションは多くない。
最初に必要なことは、WP User Managerプラグインをインストールして有効化することです。詳しくは、WordPressプラグインのインストール方法のステップバイステップガイドをご覧ください。
有効化した後、ユーザー ” 設定ページでプラグイン設定を行う必要があります。

このプラグインは、カスタムログイン、カスタムユーザー登録、パスワード忘れ、アカウント、プロフィールページとして使用するさまざまなページを自動的に作成します。
WP User Managerはあなたの投稿者プロフィールページに様々なオプションを提供します。それらを注意深く確認し、使いたくない機能をオフにする必要があります。
次に、’Profiles’タブをクリックして、ユーザープロフィール設定を行う必要があります。

ここでは、ゲストのプロフィールページオプションを有効化することができ、誰でもユーザーのプロフィールを表示できるようになります。また、メンバー同士のプロフィール表示を許可することもできます。このオプションをオフにすると、ユーザーは自分のプロフィールページしか表示できなくなります。
また、ユーザーがカスタマイザーのプロフィール写真をアップロードしたり、最近の投稿やコメントをプロフィールページに表示することもできます。
変更を保存」ボタンをクリックして、設定を保存することを忘れないでください。
次に、投稿者プロフィールページのSEOフレンドリーなURLまたはパーマリンクを選択する必要があります。これを行うには、設定 ” パーマリンクのページにアクセスし、’ユーザープロファイルパーマリンクベース’セクションまでスクロールダウンします。

このプラグインでは、URLにユーザーID、ユーザー名、ニックネームを使用することができます。ニックネームとユーザー名はユーザーIDよりもSEOに優しいオプションです。クリックしてどちらかを選択し、変更を保存ボタンをクリックしてパーマリンクの設定を保存してください。
カスタマイザーの投稿者プロフィールページはほぼ完成しました。あとは、ユーザーがWordPressサイトで簡単にプロフィールページを見つけられるようにするだけです。
外観 ” ウィジェットページに移動し、ログインフォームウィジェットをサイドバーに追加します。

投稿者のプロフィールページが実際に表示されているのを、あなたのサイトで確認できるようになりました。
ログイン中のユーザーは、サイドバーウィジェットに自分のアカウント情報が表示されます。ユーザー名をクリックすると、投稿者のプロフィールページに移動します。

サイドバーウィジェットは、ログアウト中のユーザーにログインフォームを表示します。ユーザーがサイトに登録することを許可している場合、フォームには登録へのリンクも含まれます。
また、このプラグインはサイト上の投稿者リンクを変更し、初期設定の投稿者アーカイブページの代わりに投稿者プロフィールページを表示します。
投稿者プロフィールページの外観変更
色や枠線を変えたいだけなら、カスタムCSSを追加すれば可能だ。
しかし、レイアウトや順序を変更したい場合は、プラグインのテンプレートファイルを編集する必要があります。WP User Managerはカスタマイザーテンプレートをサポートしており、プラグインが使用する独自のテンプレートを現在のテーマ内で作成することができます。
まず、FTPクライアントを使用してサイトに接続し、/wp-content/plugins/wp-user-manager/templates/フォルダに移動する必要があります。そこにあるファイルをすべてコンピューターにダウンロードしてください。
次に、現在のテーマフォルダーに移動し、その中に「wpum」という新しいフォルダーを作成する必要があります。先ほどダウンロードしたファイルをwpumフォルダーにアップロードします。
これらのファイルを編集して、必要に応じてプロフィールページの外観をカスタマイズすることができます。
方法3:テーマにカスタム投稿者プロフィールページを手動で作成する(コード)
この方法では、WordPressテーマまたは子テーマファイルを編集する必要があります。WordPressでコードをコピー&ペーストする方法をご覧ください。
まず、FTPクライアントを使用してサイトに接続し、/wp-content/themes/your-current-theme/フォルダに移動する必要があります。
現在のテーマのフォルダー内に、author.phpファイルを作成する必要があります。その後、archive.phpファイルのコンテンツをコピー&ペーストし、新しいauthor.phpテンプレート内に貼り付けます。
あなたのテーマにすでにauthor.phpファイルがある場合は、それを編集することもできます。
ここでの目標は、投稿者のプロフィール情報を取得し、それを表示することです。どこから編集を始めるかを決める必要があります。通常は、get_header();とget_sidebar()の行の間であれば何でも編集できます:
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 26 27 28 29 30 31 32 33 34 | <?php // Set the Current Author Variable $curauth $curauth = (isset( $_GET [ 'author_name' ])) ? get_user_by( 'slug' , $author_name ) : get_userdata( intval ( $author )); ?> <div class = "author-profile-card" > <h2>About: <?php echo $curauth ->nickname; ?></h2> <div class = "author-photo" > <?php echo get_avatar( $curauth ->user_email , '90 ' ); ?> </div> <p><strong>Website:</strong> <a href= "<?php echo $curauth->user_url; ?>" ><?php echo $curauth ->user_url; ?></a><br /> <strong>Bio:</strong> <?php echo $curauth ->user_description; ?></p> </div> <h2>Posts by <?php echo $curauth ->nickname; ?>:</h2> <?php if ( have_posts() ) : while ( have_posts() ) : the_post(); ?> <h3> <a href= "<?php the_permalink() ?>" rel= "bookmark" title= "Permanent Link: <?php the_title(); ?>" > <?php the_title(); ?></a> </h3> <p class = "posted-on" >Posted on: <?php the_time( 'd M Y' ); ?></p> <?php the_excerpt(); ?> <?php endwhile ; // Previous/next page navigation. the_posts_pagination(); else : ?> <p><?php _e( 'No posts by this author.' ); ?></p> <?php endif ; ?> |
このコードでは、ページ上部に投稿者プロフィールカードを追加し、その投稿者の最近の投稿を表示するだけである。
このコードは必要なだけ自由にカスタマイズしてください。サイトにユーザープロファイルフィールドを追加したり、投稿者のTwitterやFacebookのプロフィールリンクを追加したり、投稿におすすめ画像を表示したり、などなど。
投稿者プロフィールカードを見やすくするためのサンプルCSSです。テーマにカスタムCSSとして追加するか、WPCodeのようなコードスニペットプラグインを使用してください。

また、テーマの色に一致するようにコードをカスタマイズすることもできる:
1 2 3 4 5 6 7 8 9 10 11 | .author-profile-card { background : #eee ; border : 1px solid #ccc ; padding : 20px ; margin-bottom : 20px ; } .author-photo { float : left ; text-align : left ; padding : 5px ; } |
これで、あなたのサイトにアクセスして、カスタマイザーのプロフィールページを実際に見ることができます。
これがデモサイトでの様子です:

この投稿が、WordPressサイトにカスタマイザープロフィールページを追加する方法を学ぶのにお役に立てば幸いです。また、初心者のための究極のWordPress SEOガイド、または専門家が選ぶWordPressサイトの優れた例もご覧ください。
If you liked this article, then please subscribe to our YouTube Channel for WordPress video tutorials. You can also find us on Twitter and Facebook.
Benky
Do you know how I can add Phone number fields to the author pages?
WPBeginner Support
If you are using the plugin then you would need to use their method for adding custom fields
Admin
Subodh Gupta
The username is showing in the author archive URL.
How can I easily change it to display name or nickname for admin and all authors?
WPBeginner Support
If you are using the method from this article then you should be able to update that under Settings > Permalinks
Admin
Ben Osborne
I was hoping to make the author pages editable in the WordPress dashboard, is this possible?
WPBeginner Support
Should we find a method we would recommend, we will look into updating this article.
Admin
Ben Osborne
I know this maybe isn’t something you can recommend…. but I used advanced custom fields to create a wysiwyg editor right in the edit user screen, then call that custom field in the customised author.php. Works pretty good.
Nomi
wpbeginner is top. Always comes up with the best solutions. When I see on serp wpbeginneer, I just click it
WPBeginner Support
Thank you, glad you like our content
Admin
Rouni Haddad
Hello, I am trying to add the login page to the top of my website in the menu area but when I add it, it doesn’t show on the website, anyway I can fix this.
Annapurna Agrawal
Hi guys,
I am really stuck with this. My author template is not working. As in, I am getting 404 error for the author archive page.
I have no spaces in the author nice_name, i have deactivated all plugins to check for conflicts. I couldn’t find any solution to this. Can you help me out please?
WPBeginner Support
Hi Annapurna,
Try updating your permalink structure. Simply visit Settings » Permalinks and then click on the save changes button without changing anything.
Admin
grab
in wordpress job site how put each company description permanently ,i don’t want to add everytime each job descriptions and keywords
Sharif Mustajib
On my website, there are writers who send through e-mail. If they don’t create any profile, how can I add their profile? Please..
Naa
how do i remove the author profile page if i don’t want to use it anymore?
William
THank you for this tutorial. However I can’t seem to find an author.php or archive.php in my theme. I am using Customizr Pro. Any ideas would be greatly appreciated. I love the look in your demo image!
WPBeginner Support
Hi William,
If you don’t have an author.php file, then you can create one. If you don’t have archive.php, then you can copy the contents of index.php, category.php, or any other archive template in your theme. Please contact your theme’s support and they will be able to guide you better.
Admin
Ifeanyi
Hello
Please, is there a way I can add a radio button field to the registration page?
WPBeginner Support
Hi,
You can do so by creating a custom registration form with WPForms.
Admin
Adel
i’m looking desperatly for a way to make child pages in author’s page..
a menubar or tabs to display categories seperatly…
thanks in advance
Gatera
Thanks for this article. I used Method 2.
I would like to display the current author’s woocommerce products under their bio. Do you know how I can achieve this?
Thanks,
Muhammad Ibrahim
Really helpful article specially for beginners like me. a video tutorial could be a great way to know more about it. but still it is enough to know how to setup custom author profile page.
i always use to visit this site whenever i need to learn anything about WordPress.
thanks a lot dear Syed Balkhi to create such an amazing wordpress resource site.