プロフィールカードを設置すると、記事を読んだ人に「誰が書いたか」を伝えられます。
ここでは、AFFINGER7でプロフィールカードを作る手順と、名前が表示されないときの直し方を解説します。
この記事で分かること
- プロフィールカードを作る5つのステップ
- 使うウィジェットの名前と、置く場所
- 名前やプロフィール情報が出ないときの直し方
- AFFINGER6から7に上げたときに見ておく3点
プロフィールカードを設置するとE-E-A-Tの「誰が書いたか」を示せる
プロフィールカードを作ると、記事に自己紹介を表示できます。
どういう人がサイトを運営しているのか分かれば、読む側も安心できますよね。
さらにGoogleは、サイトの品質評価に「E-E-A-T」を使っています。E-E-A-Tは次の4つの頭文字です。
- Experience（経験）
- Expertise（専門性）
- Authoritativeness（権威性）
- Trustworthiness（信頼性）
この中心にあるのがTrust（信頼性）です。
残りの3つは信頼性を支える要素という扱いになっています（Google検索セントラル）。
誰が書いたか分からない記事より、書き手の背景が見える記事のほうが評価されやすい、という考え方です。
プロフィールカードは、その「誰が書いたか」を各ページで見せられる手段になります。
AFFINGER7でプロフィールカードを作る5ステップ
設定は次の順に進めます。
- カスタマイザーにアバター画像とヘッダー画像をアップロードする
- ニックネームとSNSのURLを入力する
- ウィジェットをサイドバートップに置く
順番に説明していきます。
①カスタマイザーにアバター画像とヘッダー画像をアップロードする
ここは見落としやすいので、先に済ませておきましょう。
「外観」＞「カスタマイズ」＞「オプション（その他）」＞「プロフィールカード」を開きます。
この画面でアバター画像とヘッダー画像をアップロードします。
大きい画像を使うとサイトの読み込みが遅くなるので、次のサイズを目安にしましょう。
| 画像 | 最小サイズの目安 |
|---|---|
| アバター画像 | 縦横100px以上 |
| ヘッダー画像 | 横300px × 縦150px程度 |
必要であれば「丸くする」と「影をつける」にもチェック。テキスト色と背景色も変えられます。
「ボタンURL」 には、詳しい自己紹介を書いた固定ページのURLを入れます。
入力すると、「詳しくはコチラ」と書かれたボタンが自動で付きます。
自己紹介ページがあるなら、ここで設定できます。ただし、ボタンに統一感を持たせたいなら、後述するユーザーのプロフィールから「サイト」を設定した方がいいです。
設定画面の一番下にある「旧プロフィールカードに変更」 にチェックを入れると旧バージョンが表示されます。
新プロフィールカード
旧プロフィールカード
個人的には新プロフィールカードの方がいいと思います。
②ニックネームとSNSのURLを入力する
カードに出す名前と自己紹介文を入れていきます。
ワードプレスの左メニューから「ユーザー」＞「プロフィール」を開きます。
表示したいプロフィールを選択して、ニックネーム（必須） の欄に、表示させたい名前を入力します。
画面を下にスクロールすると、X（旧Twitter）などSNSのURLを入れる欄が出てきます。
入力すると、カードにアイコンとリンクが付きます。
- サイト：自己紹介ページなど（※「ボタンURL」との重複に注意）
- feed（URL）：RSSフィード（
https://xxxxx.com/feed/） - form（URL）：お問い合わせページなど
プロフィール情報 の欄には、簡単な自己紹介文を入力します。
AFFINGER設定でhtmlタグの利用を許可（設定方法はこちら）していれば、改行タグ（<br>）が使えます。
入力したら保存します。
③ウィジェットをサイドバートップに置く
設定が終わったら、最後に表示させます。
「外観」＞「ウィジェット」をクリックします。
「11_AFFINGERプロフィールカード」 をクリックして「サイドバー（上部）」を選択しウィジェットを追加をクリック。
ページを更新して、カードが出るか確認しましょう。
名前が出ないときは「表示する管理者IDの変更」を2から順に試す
設定したのにカードが空欄のままになることがあります。
原因は、WordPressのプロフィールIDと、AFFINGER側の管理者IDが違うことが多いです。
AFFINGERは初期設定でプロフィールID「1」のプロフィールを使っています。
内容が空になる場合は、1以外の数値に変えてみましょう。
変更場所は「AFFINGER管理」＞「SEO」の構造化データ設定にある 「表示する管理者IDの変更」 です。
IDは連番になっています。どれか分からない場合は、2、3、4と順番に入れて、表示されるところを探しましょう。
【症状】IDを変えても、まだ空欄のまま
【対処】「ユーザー」＞「プロフィール」のニックネームが空になっていないか確認しましょう。
それでも直らないときは、ブラウザ再起動・キャッシュ削除を試してください。
本文の一番下に追加する「この記事を書いた人」の設定
プロフィールカードとは別に、本文の最後に「この記事を書いた人」を表示できます。
表示内容はプロフィールカードとほぼ同じ内容（表示できるリンクが異なります）です。
設定するには、「AFFINGER管理」＞「投稿・固定記事」をクリックします。
「この記事を書いた人」で、次の3つにチェックを入れて保存します。
- 「この記事を書いた人」を有効化するにチェックを入れる
- アバター画像を丸くする
- プロフィール情報にhtmlタグを許可する
下の「htmlタグを許可する」は、自己紹介文で改行を使うなら入れておくと便利です。
AFFINGER7プロフィールカードに関するよくある質問
実績がない場合、プロフィールに何を書けばいい？
大きな実績がなくても、読者よりちょっと上の経験があることを書けばOKです。
悩みを解決するための「情報を提供できる」「商品を使いこんでいる」といった内容が向いています。
「月100万円稼ぎました」より、「同じところでつまずいて、こう解決しました」のほうが読む人には近く感じられます。
プロフィールカードはどこに置くのがいい？
サイドバートップがおすすめです。
自己紹介文で改行できない原因は？
「AFFINGER管理」＞「投稿・固定記事」の 「プロフィール情報にhtmlタグを許可する」 にチェックが入っていない状態です。
チェックを入れると、プロフィール情報の欄で改行タグ（
<br>）が使えるようになります。アバター画像が四角のままになる原因は？
「外観」＞「カスタマイズ」＞「オプション（その他）」＞「プロフィールカード」で「丸くする」にチェックをいれましょう。
まとめ
AFFINGER7でプロフィールカードを作る手順を、5つのステップで解説しました。
| # | 場所 | やること |
|---|---|---|
| ① | 外観 ＞ カスタマイズ ＞ オプション（その他）＞ プロフィールカード | 画像とボタンURLを設定 |
| ② | ユーザー ＞ プロフィール | ニックネーム／SNS／自己紹介文 |
| ③ | 外観 ＞ ウィジェット | 「11_AFFINGERプロフィールカード」 を「サイドバー（上部）」に設置 |
名前が出ない場合は、「AFFINGER管理」＞「SEO」の「表示する管理者IDの変更」を2から順に試してみましょう。
記事下の「この記事を書いた人」も同じ内容でよければ、チェックを入れるだけで表示できます。
