【WordPress】記事下に「書いてる人」欄を追加できる「Simple Author Box」導入!【Plugin】

🌟2020.06 Updated

テーマをCocoonに更新したらプラグイン不要になりました!最近のテーマの多くで「書いてる人」ボックスはデフォルトで実装されていますね!

先日導入した「この記事が気にいったら、いいね!しよう」を追加できるプラグイン、「VA Social Buzz」はまさに今のトレンド的ブログパーツですが、同じ様に「このブログを書いてる人」という筆者欄を追加するのはもう少し前から多くのブログで見られたパーツだと思います。

log-161130wpdesign10b

このブログでは右側にこんな(↑)プロフィール欄を設けてサイドバーの一番上に置いていたので、記事の下にはいらないかなーとも思ったのですが、「いいね」「フォロー」欄を作ったら合わせて記事下に、

「こいつが書いてる人やで、興味があったらこいつをフォローするんやで」

というボックスを設置する方がしっくりくるな、と思ったのです。

「Simple Author Box」と「Fancier Author Box」

プロフィールボックスを導入する方法をググったら、プラグインで簡単にできるという記事がたくさん出てきました。

なんとなくの印象では、「Fancier Author Box」というプラグインを利用している方が多いかな?という感じだったのですが、ボクはデザイン的に「Simple Author Box」というプラグインを導入することにしました。

log-161130wpdesign112

これが「Fancier Author Box」で設置できる著者情報欄のイメージですが、上にタブがあって、最新記事とタブ分けされている感じが何かイマイチでした。CSSとかで弄れる人にはそうでもないのかも知れませんが、とにかくボクは、「Simple Author Box」でいきます!

「Simple Author Box」をインストール

log-161130wpdesign11

ということで早速インストール。

ウェブに詳しい友人は常日頃から「プラグインは少なく保つ方がいい」と言ってくれますが、CSSなどでいじるのが得意じゃない身分ではプラグインに頼らざるを得ない部分も多く、こういう便利なプラグインはどんどん入れてしまいます(汗)。

「Simple Anther Box」で検索するとすぐ出てくるので、インストール→有効化します。

「Simple Author Box」の設定

このプラグインも設定はシンプル。

「設定」の中に設定ページがあるので入っていじります。

log-161130wpdesign13b

なんとなくこんな感じの設定画面です。英語ですが、Wordpressをいじるくらいの方なら英語が得意じゃなくてもだいたいわかると思います。

log-161130wpdesign14b

設定の中で一番大事かも知れないのが、この一番上にある項目で、任意の場所に著者情報ボックスを設置するという場合はこれを「Yes」にしなくてはいけません。逆に、これを設定しないと自動的に記事の一番最後に表示されます。

<?php if ( function_exists( ‘wpsabox_author_box’ ) ) echo wpsabox_author_box(); ?>

「Yes」にすると出てきますが、この1文を入れた場所にボックスが表示されます。

<H5>書いてる人</H5>
<?php if ( function_exists( ‘wpsabox_author_box’ ) ) echo wpsabox_author_box(); ?>

ボクはこんな感じで、ボックスの上にHタグで見出しをつけて、記事の後、コメントと来た一番最後に設置しました。

設置完了!

log-161130wpdesign15

こんな感じです!

この記事の下にも存在するはずですが、このボックス下にあるソーシャルボタンのカスタマイズが結構色々できるので後々少し変えるかも知れません。

log-161130wpdesign16 log-161130wpdesign17

公式サンプルがこんな感じで多数あげられていて組み合わせで色々なカスタマイズが可能なのがわかります。特にフォントが無数にあるのでしっくりくるやつを見つけるまで変え続けるかも…?

モバイルでの見え方もしっかり

log-161130wpdesign19b

モバイルでの見え方はこんな感じ。

「縦に場所を取りすぎ」、という声もあるみたいですが、ちゃんとモバイル用にセンター寄せになっているし、何も文句ありません。

人によってはソーシャルボタンがもっと設置されて、2列まで行くとちょっとごちゃごちゃ感が出るのかも知れませんが、ボクは5つなんでいい感じだと思います。

⚠️プロフィール画像は別で設定しなきゃいけません!

と、簡単に設定できる著者情報ボックスですが、ひとつ注意があって、Wordpressを入れたままの状態ではプロフィール写真が出て来ません!

log-161130wpdesign18

ボクは「Avatar Manager」というプラグインを入れて(また増やして友達に怒られる!!)対応しましたが、Wordpress外サービスである「Gravatar」で画像を設定していない限りこうしたプラグインでプロフィール画像を設定しておかないと、著者情報ボックスにプロフィール画像は表示されないので”一手間”追加での完成となります。

総括

「この記事が気にいったら、いいね!しよう」ボックス同様とても簡単にそれっぽいボックスが追加できる簡単プラグインでまたまた”オサレ感”を増すことができたと勝手に思っていますが、一点だけどうにかしたいけどできそうにないのが、名前にリンクが付いていて、Wordpressのプロフィールページに紐付けされている点でしょうか。

これだけはいらないかなーっていう。

でも他は簡単シンプルに導入できる、素敵なプラグインだと思いました!

シアトル生まれ、大阪育ち。6年前に独立・起業しましたが、コロナ禍で事業が大ダメージを受け、人生の方向転換に悪戦苦闘の日々です!とにかく、「ワクワク」に満ちた毎日を目指してできることから地道に頑張っています〜!