ブロックエディタ 公開日： 最終更新日：
WordPress6.0より新登場・アバターブロックの使い方【画像付き解説】
初心者向けのブロックエディタ入門・WordPress6.0より新たに加わったアバターブロックの使い方・アバターブロックの設定方法や装飾を画像付きで解説します。
WordPress 6.0より、「アバターブロック」が追加されました。
これは、ブロックエディタから投稿者のアバターを簡単に挿入することができるブロックです。
この投稿では、アバターブロックの使い方をご紹介します。
Contents
アバターを登録しておこう
まず、このブロックを使う前に、WordPress内にご自身のアバターを登録しておくことをお勧めします。
アバターの登録ができていないと、アバターはシルエットのような画像になってしまいます。
アバター登録は、Simple Local Avatarsプラグインを使うと簡単に登録できます。
登録方法はこちら：ワードプレス内アバター写真を簡単にアップロードできるプラグイン「Simple Local Avatars」
今回は、ニワトリの写真を投稿者のアバター写真としてつかってみることにします。
アバターブロックを使ってみる
アバターを登録できたら、投稿画面でアバターブロックを使ってみたいと思います。
投稿画面でアバターブロックを探してみましょう。（WorcPressのコアがver6.0以上で使うことができます）
アバターブロックは、「テーマ」というブロックカテゴリーの中にありました。
これをクリックします。
エディタ―にシルエットのアバターブロックが入りました。
ひとまずこれで、一度プレビューを確認したいと思います。
設定してある自分のアバターが入って、プレビュー画面に反映されています。
アバターブロックの基本設定（サイドバーより）
次に、アバターブロックの基本設定を見てみましょう。まずは右側のサイドバーを確認します。
上から設定内容を説明すると
サイズ：アバター画像のサイズです。最初にプレビューを見た時、96 pxだったので大きくしてみます。150 pxに変更しました。
ユーザープロフィールへのリンク：これにチェックをすると、別にユーザープロフィールページを作っている場合、アバターをクリックするとリンクできます。
ユーザー：複数のユーザーがいて、投稿中のユーザー以外のアバターを使う場合は、ここから別のユーザーのアバターに変更できます。
何も設定しない場合は、投稿者のアバターということになります。
寸法：+ ボタンで開くと、マージンの設定ができます。
※これらの設定の項目は、お使いのテーマの設定方法によっては全てが表示されない場合があります。
枠線：アバターの装飾です、周りを枠線で囲むことができます。
枠線には色や線の太さ・スタイルを設定することができます。
角丸：アバターの画像の角の丸みの調整ができます。
アバターを装飾する
このサイドバー部分から、アバターを装飾してみます。
枠線を5 pxの太さにし、点線のスタイルを選びました。
そして、角丸を100 pxと設定しました。
エディタ―部分では、設定に応じて装飾が加わります。
プレビューを見てみましょう。
ニワトリのアバターに装飾が施されました。
アバターブロックとテキストを合わせたレイアウト
このアバターの横にテキストが表示されるよう、カラムブロックを使ってレイアウトを整えます。
2カラムにレイアウトし、アバターの隣に、見出しブロック・段落ブロックを追加しました。
アバターブロックの基本設定（ブロックツールバーより）
ここで、ブロックを選択するとすぐ上に表示される、ブロックツールバーでの設定を見てみましょう。
上の図の赤枠にある二つのアイコンが、設定アイコンです。
ブロックの水平方向の位置を整えるアイコンと、デュオトーンフィルターのアイコンが表示されています。
まず、ブロックの位置を整えます。
位置を「中央揃え」にすると、カラム内でブロックがセンタリングされます。
次にデュオトーンフィルターを使ってみます。
上の写真の赤枠内、点線で書かれた円のアイコンがデュオトーンフィルターです。
これをクリックします。
クリックすると、説明が表示されました。
このフィルターをかけると、画像に自動でツートンカラーの効果をつけることができます。
（このフィルターは、アバターブロック以外にも画像ブロック等で使うことができます。）
カラーパレットから、色を選択します。
「グレースケール」を選びます。
選択後、プレビューを確認します。
アバターの位置が調整され、アバターがモノクロ写真になりました。
完成
最後に、アバターの垂直方向の位置を調整します。
カラムブロックで両方のカラムの垂直方向位置関係を調整して、完成です。
画像ブロックでも同じような表現はできますが、ブログやアフィリエイト記事などで、執筆者のキャラクターを使った投稿をしたい時、アバターブロックを使うと便利です。
ブロックエディタ初心者の方は、今回の説明のように少しずつプレビューして投稿の見た目を確認しながら作業すると作りやすいと思います。
人気記事
