| 2025.09.06 | 「プロフィールブロックを利用する」を追加。 |
ブログを開設したら、アナタがどんな人かをわかってもらうために、プロフィールの作成をおすすめします。
プロフィールをチェックする人って意外といるんですよ。
プロフィールウィジェットを作ると、ページのサイドバーやメインカラムの好きな位置にプロフィールを配置できるので、なかなか便利ですよ！
この記事では、Cocoonの独自ウィジェットの「プロフィールウィジェット」を使ったプロフィールの作り方を詳しく解説していいきます。
今からプロフィールを作成しようと考えている人は、ぜひ参考にしてください！
プロフィール画像を準備する
プロフィール作成の前に、まずはプロフィール用のイラスト画像や写真を準備してください。
画像形式は、JPG、PNG、GIFなどでよいです。
プロフィールの画像のサイズ
プロフィールの画像サイズは、Cocoonの場合は縦240px、横240pxが推奨となっています。（pxはピクセル）
画像サイズは、縦240px、横240pxより大きいサイズでも構いませんが、必ず正方形にしてください。
ちなみに、以下の画像（縦256px、横256px）をサンプルとして用意しました。（実際に使っている画像です）
プロフィールウィジェットを作成する
画像が準備できたところで、プロフィールウィジェットを作成します。
今回は、冒頭の画像にあったように、サイドバーとメインエリア（記事本文下）にプロフィールウィジェットを配置します。
プロフィールウィジェットでは、固定ページで作成したプロフィール記事へのリンクを追加します。
まだ、固定ページでプロフィールを作成していない場合は、以下の記事を参考に作成してください。
プロフィール情報を入力する
まず、プロフィールウィジェットの作成に必要なプロフィール情報を入力します。
WordPress管理メニューの「ユーザー」→「プロフィール」とクリック。
「プロフィール情報」に、簡単なプロフィールを入力。
※できるだけ簡潔でわかりやすいプロフィールにした方がいいでしょう。
プロフィール画像をアップロードする
プロフィールの画像をドラッグ＆ドロップでアップロードします。
準備した「プロフィール画像」をアップロードするので、「選択」をクリック。
用意していたプロフィール画像をドラッグ＆ドロップしてアップロードしたら、下の方にある「画像を選択」ボタンをクリックします。
プロフィールページのURLを入力する
あらかじめ、詳細なプロフィールを書いたページ（固定）を別途用意してください。
※プロフィールは、投稿ページではなく固定ページに書きます。
プロフィールの固定ページは、必ず作成しましょう！
簡単なプロフィールでもいいんです。
どんな人かわかるようなものを書きましょう！
■参考（僕のプロフィールです） プロフィール
経験するとわかりますが、サイト（ブログ）へのアクセスが増えていくと「プロフィール」を確認する人が必ず出てきます。
アナタがどんな人かをわかってもらうためにも、プロフィールのページは必須です。
まだプロフィールのページを作っていない場合は、URLは未入力のままにしましょう。
※未入力の場合は、自動的に記事のアーカイブ（一覧）ページのURLが埋め込まれます。
プロフィールのページを作成している場合は、以下の手順です。
プロフィールページのURLを入力し、「プロフィールを更新」を押してプロフィール情報を保存します。
SNSアカウントのURLを入力する
X（旧ツイッター）、Facebook、インスタグラム、YoutubeなどのSNSアカウントを持っていて、公表しても構わない場合は、公表しましょう。
対象のSNSアカウントのページ（URL）を入力すれば、SNSのアイコンがプロフィールの下に表示されるます。
下の画像はURLを全て入力した場合のSNSアイコンです。
プロフィールウィジェットを配置する
プロフィールの情報はすべて入力できたので、プロフィールウィジェットを追加配置していきます。
ここで配置するのは、サイドバーと記事本文下です。
プロフィールはこの2つの配置が定番です！
WordPress管理メニューの「外観」→「ウィジェット」とクリック。
サイドバーの中に配置
まずは、サイドバーの中にプロフィールウィジェットを配置します。
ウィジェット画面左側の「利用できるウィジェット」の中に【[C]プロフィール】というウィジェットがあります。
- 【[C]プロフィール】の▲（①）をクリック。
- 「サイドバー」にチェック
- 「ウィジェットを追加」をクリック。
これで、サイドバーの中に配置されるので、続けて以下を入力。
- 「タイトル」を入力。（プロフィールでいいでしょう）
- 「肩書ラベル」を入力。（ブロガーなどでもいいです）
- 「画像を円形にする」にチェック（チェックつけない場合は四角です）
- 「保存」をクリック。
ひとまず、サイドバーへのプロフィールウィジェットの配置はこれで完了です。
続けて、記事本文下に配置します。
記事本文下に配置
2つ目のプロフィールウィジェットを記事の本文下に配置します。
ウィジェット画面左側の「利用できるウィジェット」の中に【[C]プロフィール】というウィジェットがあります。
- 【[C]プロフィール】の▲（①）をクリック。
- 「記事本文下」にチェック
- 「ウィジェットを追加」をクリック。
これで、記事本文下に配置されるので、続けて以下を入力。（サイドバーの時と同じ）
- 「タイトル」を入力。（プロフィールでいいでしょう）
- 「肩書ラベル」を入力。（ブロガーなどでもいいです）
- 「画像を円形にする」にチェック（チェックつけない場合は四角です）
- 「保存」をクリック。
以上で、サイドバーと記事本文下にプロフィールウィジェットを追加配置できました。
ページを見ると以下のように、記事本文下とサイドバーにプロフィールウィジェットが配置されているのがわかります。
プロフィールブロックを利用する
ウィジェットは便利なんですが配置できる位置が限定されているので、好きな位置に表示できないのがネックなんですよね。
そんな時には、Cocoonのプロフィールブロックを使いましょう。
投稿画面を開いたら、プロフィールを表示させたい位置にカーソルを置いて、「/pro」と入力（①）し、「プロフィール」を選択（②）
スラッシュ「/」で、ブロック名検索ができますよ！
スラッシュによる検索が使えない場合は、以下の手順でもプロフィールブロックを挿入できます。
左上にある「＋」ボタンをクリック。
ブロック一覧の「COCOONブロック」にある「プロフィール」をクリック。
プロフィールブロックが挿入されるので、ユーザーの矢印アイコン（①）をクリックし、自分のプロフィールを選択（②）
実際のページには以下のように表示されます。
プロフィールブロックとプロフィールウィジェットの違い
プロフィールブロックはプロフィールウィジェットと同じように見えますが、微妙に違いがあります。
プロフィールウィジェットでは、「プロフィール」や「この記事を書いている人」を入力しているので、このあたりは違いが出てますね。
ちょっとわかりづらいですが、プロフィール画像はブロックの方だと四角になる（変更できない）ことに注意してください。
以上、プロフィール作成について解説しました。
プロフィールが気になる人は必ずいるので、プロフィールはなるべく作成しましょう！
コメント