wordpressでオリジナルアバターを実現

スポンサーリンク

wordpressを使用していてシングルユーザー(自分だけのブログ)で運営している人はさほど気にならない事かもしれませんが、マルチユー ザー(会員制ブログ)などで運営されている方は一度は考えたことがあると思いますが、ユーザー登録してくれた人がオリジナルのアバターが設定できないモノ かと。。

作者も当サイトではマルチユーザー化していないため、作者ブログの方で登録制にしたのですが、オリジナルアバターに関しては久々に手こずりました。

wordpress2.5以降からGravatarというサービスと連携し、Gravatarでメールアドレスを登録しオリジナルのアバターを登録しておくと他のブログで登録アドレスを入力したときにアバターが表示されるというモノが導入されたのですが、外部サービスなので新規登録者には浸透しづらいモノがあると思いました。

色々調べてprofile picと いうプラグインにたどり着いたのですが、モノストックのwordpressをインストールした階層がhttps://mono-stock.com /blogという階層のせいか表示されるアバターのパスとアップロードされるアバターのパスが一致しないため、しばらくカスタマイズして断念しました。

他にその手のプラグインはないかと色々検索して、Add Local Avatarというプラグインを発見しました。これが思ってた以上に使いやすく、導入も簡単だったのでご紹介したいと思います。

今回導入した際のwordpressバージョンは2.8.5になります。

まずは下記のURLよりプラグインをダウンロード・もしくは管理画面≫プラグイン≫新規追加より【Add Local Avatar】を検索しインストール。
≫http://wordpress.org/extend/plugins/add-local-avatar/
プラグイン画面で有効化します。

管理画面≫ユーザー≫avatarsの項目が追加されているのでクリックすると以下のような画面になります。
wordpressオリジナルアバタープラグイン
wordpressオリジナルアバタープラグイン

上の方にあるのは現在の登録ユーザー名とメールアドレスになります、アドレス右隣にある空白は、アバター画像までのパスになります。作者の場合は wordpressインストール領域の1階層上にアップロードフォルダを作成しました。(http://moon-stock.com/アップロードフォ ルダ)
下の方の各種設定はおわかりになるかと思いますが、
Avatar rating:アバターの表示制限(G・PG・R・X)
Size:アバターの表示サイズの設定
Gravatar default:Gravatarでのデフォルト画像

Default image:Gravatar以外でのデフォルト画像パス
Use Snapshots:snapshotsというサービスを使用するか
Avatars in posts:記事内でアバター画像を使用できるようにするか
User uploads:アバター画像をアップロードするパス(/●●●●)
Resize uploads:アップロード時に画像をリサイズするか
Resize uploads size:リサイズするサイズ

この辺までの各種設定(画像パスの設定以外はほぼデフォルト)が出来たら、Update Avatar Optionsをクリックして更新。あとはコメント欄がスレッド形式になっていれば、コメント時にオリジナルアバターも一緒に表示されます。
wordpressのコメント欄スレッド化については以下のサイト様をご参考までに。

参考1≫WordPress コメントをスレッド対応にする
参考2≫WordPress コメントをスレッド対応にする

あとはサイドバーなどにログイン状態を表示してくれる【Sidebar login】などにも対応されているので、一緒に組み合わせて使っても良さそうです。

Gravatarで登録されている人はGravatarのアバターが優先されるので、非常に融通のきくプラグインです。もちろんユーザー登録されるプロフィールの設定画面にもアバター登録の欄が追加されているので、登録時も迷わずスムーズにアップロードできそうですね。設定画面がそこだけ英語になっているのを直したい方は、プラグインの【add-local-avatar】フォルダの中にある、avatars.phpファイルを編集すれば、日本語化になります。(602行〜620行あたり)
是非、wordpressでオリジナルのプロフィール画像を実現してみたい方ご参考下さい。

※記載されている画像は、作者の作成された画像を使用させていただいている場合がございます。
タイトルとURLをコピーしました