WordPressのコメント欄にある一般的な「謎の人物」のアバターは、あなたのサイトのためになりません。何百ものWordPressサイトをビルトインしてきた私たちは、パーソナライズされたコメント欄があなたのサイトをより魅力的でプロフェッショナルなものにすることを知っています。
ブランドのロゴを使いたい、カスタマイザーのデザインを使いたい、あるいは初期設定のグレーのシルエットよりも魅力的なものを使いたいなど、初期設定のグラビアを変更することは、サイトの外観を向上させる簡単な方法です。一番の利点は?この変更を行うのに技術専門家である必要はありません。
このガイドでは、WordPressで初期設定のgravatarを置き換えるいくつかの方法を紹介します。
初期設定のGravatarとは何か、なぜ変更するのか?
Gravatarとは、Globally Recognized Avatarの略。プロフィールを作成し、アバター画像とメールアドレスを関連付けることができるウェブサービスだ。
WordPressサイトはすべてビルトインでグラビアをサポートしており、複数著者のWordPressブログでユーザーが投稿日: を書いたり、コメントを残したりすると、自動的にユーザーのアバターが表示されます。
ユーザーがグラビアを持っていない場合、WordPressは代わりに初期設定のグラビアを表示します。ほとんどのWordPressサイトでは、これは灰色の謎の人物です。
この初期設定のグラビアは、あなたが選んだ他の画像に変更することができます。例えば、サイトのロゴなど、あなたの会社を象徴する画像を使用することもできます。これにより、ブランディングを強化することができます。
私たちの場合、グラビアはコメントを残したいユーザーにとって不必要な余分なステップを生み出すと判断し、完全に無効化することにしました。
それでは、WordPressで初期設定のグラビア画像を変更する方法を見ていきましょう。クイックリンクを使えば、使いたい方法にすぐにジャンプできます:
方法1:初期設定のWordPress Gravatarを変更する(素早く簡単)
WordPressには、使用できる数種類の初期設定のグラバターが用意されています。初期設定を使用することは、謎の人物のグラビアを変更する最も簡単な方法ですが、これらの画像はあなたのWordPressサイトやブランド独自のものではありません。
初期設定のグラビアを見るには、WordPressの管理エリアから設定 ” ディスカッションに移動する必要があります。
初期設定アバター」の下には、その人のメール・アドレスにリンクされたグラバターがない場合にWordPressが使用できる、さまざまなユーザー・アバター画像がすべて表示されます。
WordPressは初期設定として謎の人物を使用していますが、このセクションには他の画像を使用することができます。
WordPressブログで使用したい画像の横にあるラジオボタンをクリックするだけです。
その後、画面を一番下までスクロールし、「変更を保存」をクリックします。
方法2:Thrive Commentsを使ってカスタムグラビアターをアップロードする(プラグインによる方法)
WordPressの初期設定のプロフィール写真が気に入らない場合は、代わりにカスタマイザーをアップロードすることができます。これは、コメント欄をあなたのブランドに合わせてパーソナライズする最良の方法です。
この方法では、Thrive Commentsを使用します。これはコメントプラグインで、ユーザーにブログ投稿にコメントしてもらい、サイトのエンゲージメントを高めるように設計されている。
カスタマイザー機能の他に、Thrive Commentsにはコメント欄をより楽しくエキサイティングなものにするツールが付属しています。例えば、ソーシャルメディアサイトのように「好き嫌い」を有効化することができます。
Thrive Commentsをプラグイン単体で購入することもできますし、Thrive Themes Suiteを購入することもできます。Thrive OvationsのようなThrive製品もすべて含まれており、コメントした内容をテスティモニアルに変えることができます。
その後、プラグインZIPパッケージをダウンロードしてWordPressサイトにインストールすることができます。詳しくは、WordPressプラグインのインストール方法の完全ガイドをお読みください。
プラグインをインストールして有効化した状態で、WordPress管理エリアからThriveダッシュボード “ Thrive Commentsに 移動します。そして、「スタイルのカスタマイズ」タブを開きます。
このタブで、「アバターを表示する」設定がオンになっていることを確認してください。完了したら、『画像を選択』をクリックするだけです。
この時点で、WordPressメディアライブラリから既存の画像を選択するか、独自の画像をアップロードしてGravatar初期設定画像として使用することができます。
ストックフォトを使ったり、カスタムロゴを作ったり、Canvaなどのウェブデザインソフトを使って新規グラビア画像を作成することもできます。この画像は250×250ピクセルの正方形でなければなりません。
画像を選んだら、「選択」をクリックします。
それで終わりだ!
これで、プレビューとライブコメントセクションに新しい初期設定のグラビアプロフィール画像が表示されるはずです。
Thrive Commentsのクールなところは、簡単にグラビアを遅延ロードできることです。
つまり、サイト訪問者が特定のコメントまでスクロールダウンするまで、WordPressはコメントした人のグラビアを表示しないということです。
この機能を有効化したい場合は、Thriveダッシュボード “ Thrive Commentsに行き、’高度な設定’タブを開きます。そして、’コメントがビューポートに入ったときにアバター画像を読み込む’というボックスにチェックを入れてください。
その他の遅延ロード機能にもチェックを入れることができる。
Thrive Commentsを使用するためのヒントやトリックについては、以下のガイドをご覧ください:
方法3:カスタム・グラバターを使用するためにコード・スニペットを挿入する(コード・メソッド)
Thrive Commentsを使用する以外に、コードを使用してカスタムグラビアターをアップロードすることもできます。WordPress ディスカッションページのグラバターリストに新しい画像を追加したい場合は、この方法をお勧めします。
2つ目の方法と同様に、グラビアとして使いたい画像が必要です。
その後、メディア ” 新規追加でWordPressサイトに画像をアップロードできます。ここでは、WordPressメディアライブラリから画像を選択するか、コンピューターから新しいファイルをアップロードすることができます。
画像を選んだら、その横にある「編集」リンクをクリックしてください。
WordPressが編集用のファイルを開きます。この画面で、「ファイルのURL」セクションまでスクロールしてください。
次のステップで必要になるので、このURLをメモしておくこと。
この段階では、WordPressサイトにコードを追加する必要があります。チュートリアルでは、テーマのfunctions.phpファイルにカスタマイザーを追加するよう指示されることがよくあります。
しかし、コードの小さなミスでもWordPressの一般的なエラーを引き起こしたり、サイトを完全に壊してしまう可能性があるため、この方法はお勧めしません。
そのため、WPCodeの使用をお勧めします。WordPressのコアファイルを編集することなく、WordPressにカスタムコードを追加する最も簡単で安全な方法です。
最初に行う必要があるのは、無料のWPCodeプラグインをインストールして有効化することです。詳しくは、WordPressプラグインのインストール方法のステップバイステップガイドをご覧ください。
有効化したら、WordPressダッシュボードのCode Snippets “ Add Snippetにアクセスしてください。
ここでは、WordPressサイトに追加できるさまざまなスニペットをすべて見ることができます。WordPressのコメントを完全に無効化したり、SVGファイルをサイトにアップロードしたりするスニペットなどがあります。
デフォルトのアバターにカスタム画像を使うこともできます。ライブラリで’Custom Default Avatar’スニペットを検索してください。
見つけたらマウスオーバーし、「スニペットを使用」ボタンをクリックします。
その後、WPCodeは自動的に正しいコードを追加します。
URLをWordPressの初期設定として使用したい画像へのリンクに置き換えることをお忘れなく。
コードボックスの下に、いくつかの挿入オプションが表示されます。まだ選択されていない場合は、「自動挿入」を選択すると、スニペットが自動的に挿入され、サイト全体で実行されます。
その後、『場所』のドロップダウンを開き、『どこでも実行』をクリックする。
そうしたら、画面を一番上までスクロールし、「Inactive(有効化しない)」のトグルをクリックして、「Active(有効化する)」に変更します。
最後に、「更新」をクリックして、グラビア・スニペットをライブにします。
このグラビアの使用を開始するには、設定 ” ディスカッションページに移動します。
デフォルトアバター」セクションで、新規の「カスタムアバター」オプションを選択します。
その後、「変更を保存」をクリックして設定を保存してください。
これで、あなたのサイトにアクセスすると、新しい初期設定のグラビア画像が表示されます。
以上です!WordPressのグラビアについてさらに詳しく知りたい方は、以下のガイドをご覧ください:
- WordPressでユーザーメールからGravatarを表示する方法
- WordPressでグラビアを無効化する方法(ステップバイステップ)
- WordPressでGravatarの画像サイズを変更する方法
この投稿がWordPressで初期設定のグラビアを変更する方法を学ぶのにお役に立てば幸いです。WordPressでコメントをモデレートする方法と、WordPressのベストコメントプラグインのリストもご覧ください。
If you liked this article, then please subscribe to our YouTube Channel for WordPress video tutorials. You can also find us on Twitter and Facebook.
anna
Thanks for the nice explanation, Now I’m clear about setting up my gravatar in WordPress site.
rashmi
this is very useful
Pat
Thank you, thank you, thank you! I’ve looked everywhere on how to change the default avatar and you were the only ones who simple explained it and displayed how! Sometimes finding the answer in the haystack of information can be just mind blowing. You rock!
manoj rai
how set when user comment your post show him/her original profile. please help me. thanks
Joy
Hello, I’ve tried this in my child’s theme function and it just will not work. The image in the discussion settings and on the front-end appear broken. When I right click to view the path it displays:
It affixes the i1.wp.com before the link. Even when I tried to connect directly to the child theme stylesheet directory and pickup from the folder, ‘images/chicken_avatar.png’, it still affixed the i1.wp.com
Any ideas how to fix this? Thank you.
WPBeginner Support
Hey Joy,
We tested it again with a child theme and it worked as expected. We are not sure what may be causing the issue. You can follow the instructions again. Make sure you add the full image URL in the code.
Admin
Joy
Hmm, not sure what I was doing wrong. I just gave it another go and it works. Thank you!
Andrew
Joy: Mine Via Another WordPress Script, is Going to (i0.wp.com/MySite…). Very Strange. :–)
Andrew
It Still Shows i0.wp.com/MySite Whwn Going to the Image Location, but I Changed the URL Code to (‘/custom-gravatar/mh-profile-photo-default.png’), Instead of ‘example.com/wp-content/uploads/2017/09/mh-profile-photo-default.png’). In Settings > Discussion It Shows My Admin Photo as the Default User Gravatar, but On User Profiles, It Views Properly! :–)
Mayaprakash Pant
Hello.
The code worked perfectly fine for me. But this arises another problem:
Same gravatar appears when everyone else including visitor comments on my blog.
How to solve this?
Gabrielle
Hi, i added and sucesfully saved input(type = url) for each user profile, on ly localhost installation.
I’m trying to change original code from WP Codex wesbsite:
From:
add_filter( ‘avatar_defaults’, ‘new_default_avatar’ );
function new_default_avatar ( $avatar_defaults ) {
//Set the URL where the image file for your avatar is located
$new_avatar_url = get_bloginfo( ‘template_directory’ ) . ‘/images/new_default_avatar.png’;
//Set the text that will appear to the right of your avatar in Settings>>Discussion
$avatar_defaults[$new_avatar_url] = ‘Your New Default Avatar’;
return $avatar_defaults;
}
To something that will replace default avatar url foreach user with value from custom input field(if its not empty), any help?
I know there are plugins that allows subsciribers to upload gravatar images, but i don’t want to allow them doing that, i want to give them a chance to put url to their own images
Manish B
I am not able to show avatars next to comments. I am using Hitchcock WordPress Theme.
Claire Benneth
THANK YOU!
Actually I’ve been looking for this solution for my blog for 3 months!
Thanks again!
Claire xo
Jen Hardy
I have the Gravatar set up in WordPress, but when the e-mail goes out to my followers for my blog, the mystery man is there. Looks really bad at the top of my e-mail. Any suggestions?
Thanks!
Syed Hamza
Here are two folders of images in Cpanel.
1. /public_html/wp-includes/images
2. /public_html/wp-content/themes/divi/images
In which folder where I upload the image.
Manoj
I can’t see my avatar even after setting in comment box but i see it about me.
Manish B
I am facing the same issue.
Michael
I’m looking for a plugin, or SIMPLE code solution that will allow me to create a number of ‘default’ gravatar/avatar images that are color coded based on the member’s gender/orientation. Obvious ones like blue for male, pink for female, but I’ll likely add lavender for transgender and possibly others. Basically, the decision about the ‘default’ avatar that appears for the member (until they upload an image) would at least let people browsing the site know if the person they see posting (or online) is male / female / transgender / etc.. Any ideas?
Me
Is there code to force the default avatar to be blank? I have it set to blank in the WP settings, but it’s still showing up as mystery man. Is there code to either delete mystery man entirely so it’s not even an option. Or to make sure it’s blank and not mystery man? Thanks!
WPBeginner Support
See our guide how to disable gravatars in WordPress.
Admin
Me
Thanks! I tried that already. When I do that, the avatars also disappear from the author box (I’m using Starbox). I’m at a loss. I’ve even checked my WP tables, and it shows the default avatar is set to blank. I can’t figure out how to get rid of mystery man…
Michael
How would one go about rotating a set of images in that Gravatar thumbnail spot? Meaning: if I had 5 different images, to have them randomly appear for users without Gravatars, so there was a variation of the 5?
Angelica Costa
If anyone is facing issues with child themes, just use:
$myavatar = get_stylesheet_directory_uri().’/img/favicon.png’;
It works.
Mark
This was a life saver!
Julia
Great, thanks!
Gina Smith
Thanks for the information!
Keely
Wow – found this post 2 years after my first post and got it working this time
Thanks WP Beginner
Caroline
Thanks!
chris007
okay i get the whole idea but how you put your personal pciture of you into the gravatar that what i’m trying to figure out..
Thomas
Goto Gravatar website and sign in with WordPress. Then you can upload your avatar and tie it to one or more of your emails.
Alex
Thank you!
Karan Rawat
It works. Thanks Bookmarked your blog!
Chuks Emmanuel
Thank you Syed Balkhi. it really worked for me. just keep the good work going.
Adrian O'Farrell
Hi, just checking what happens next
Simen Eggen
Thank you so much it’s working
Sadia
Thank you so much for these instructions. For some reason, things were wonky when I used a .png file, but a gif worked easy peasy!
Katelyn
I am having the same issue as Keely. I am using a child theme so get_bloginfo does not work. When I check the URL of the broken image it displays the path to the parent theme. Is there a way to get this to work with a child theme?
Akash KB
What should be the size of the image file to be uploaded to the theme folder?
Thanks
Brody
Any way to make this use a SSL connection using the same code? Always loads “insecure content”. What changes to make it a secure image during loading?
WPBeginner Support
If you are loading gravatar on a secure page then it should automatically load securely. Also check Settings » General change your site and WordPress address to use https. Let us know if this solved the issue.
Admin
Pavan Deshpande
Thank you for sharing this , i was not able to change the default image but after reading this i changed
Keely
What if you’re using a child theme …
I changed the line
$myavatar = get_bloginfo(‘template_directory’) . ‘/images/gravataricon.gif’;
to
$myavatar = get_bloginfo(‘stylesheet_directory’) . ‘/images/gravataricon.gif’;
but still not working
Editorial Staff
Is the image not showing or the code altogether is not working (i.e it’s not even adding an option for custom gravatar)?
Admin
Kristen
I am having issues with the code also. I used it on another site and it worked perfectly, however on the site I’m currently working on… it shows as an option in the admin panel under settings-discussion, however it is showing as a broken image and does not display on the blog pages either. Any help is greatly appreciated.
Editorial Staff
Right click on the broken image to get the image URL. Open that URL in another tab to verify that the URL is correct.
Dizz Markie
I am having the same issues on localhost
Rachel
I just used your advice here; more explanation that the image needed to be saved in the themes folder too would have been helpful. But your tips here helped me figure some of it out. Thanks.
mrahmadawais
@wpbeginner Secondly , do you know an good pre image loading plugin for wordpress
mrahmadawais
@wpbeginner disquess is having some problems at my blog see there http://freakify.com it is not allowing me to upload any custom image>>>? Why
wpbeginner
@mrahmadawais That is because Disqus is a third party platform….
mrahmadawais
tell me plz
mrahmadawais
any one here now to tell me why disquss is not accpting this
Crysislevel
thanx it worked perfectly!
Shabil Team
This gravatar custom code is very cool and really work on my blog. Thank you very much.
You rock WPbeginner.
Shabil Team
This gravatar custom code is very cool and really work on my blog. Thank you very much.
You rock WPbeginner.
wpbeginner
@Kindar We are glad to have you as a user Let us know if you have any suggestions.
Kindar
When ever I search for something on the internet i usually get to see your website.. Now I started follow your website and the stuff you share.. What ever you share its really useful and thats why i always check it up, and see whats new. Also i wanted to thank you for the last subject.
Kindar
When ever I search for something on the internet i usually get to see your website.. Now I started follow your website and the stuff you share.. What ever you share its really useful and thats why i always check it up, and see whats new. Also i wanted to thank you for the last subject.
iur
where is located the file /images/gravataricon.gif ?
Editorial Staff
Inside your WordPress Theme’s folder.
Admin
Cee
Hi!
Wow..I’ve gone round and round with code. Not adept with this as a newb…but usually can get things to work.
I added the code to get a default avatar for guest . It worked. At least in admin. The image shows up in ADMIN..but not on the website.
I also signed up at gravatar for my own custom gravatar for my ADMIN comments…and it shows up in their “check point”…but cannot get it to show up in my comments.
Neither does the Guest Gravatar.. but the GRAVATAR image shows up instead.
My custom image IS checked as default in Discussions. Both images are uploaded to the theme/images and the path to the guest image is correct in the code. I made the images 128 x 128 as suggested online nowadaZe… Dunno if THAT sizing must be specified somewhere? I looked thru the functions code…as best as my bewildered eyes can comprehend..but didn’t finding anything that looked like it would work. Maybe in style.css?… Dunno if it makes a difference. Don’t want to go thru changing everything..and still not work. Have already spent DAYS trying to figure this out. Should be a simple thing.
Don’t understand why MY admin gravatar isn’t showing. Per what I read…it should be handled via gravatar. The email address used for the gravatar is the same as listed in admin.
WHAT am I doing wrong/missing?.. I have WP 2.8.4.
I tried pasting the above code at the top…AND at the bottom… but neither works. Does it matter WHERE you paste it in the functions.php?
Can you suggest anything?Would DEEPLY appreciate any help you can give. Can give you any code you might need…just specifiy.
Thank you in advance. tearing out hair..
Editorial Staff
It sounds like that this issue is not with the function rather it is the comments.php file error.
Admin
Louis Gubitosi
thanks for this tip. I used this on my site and the default avatar is showing up in the comments section but not in the “Recent Comments” side bar. I’m using the “Get Recent Comments” plugin. Is this treated differently?
http://interactiveblend.com/blog
Editorial Staff
Unless that plugin has specified a default in their code, this should work. It means the plugin is not coded properly. Contact the developer, and ask them to fix it.
Admin
martin
The code works if placed in custom-php.php which has the advantage of sticking through upgrades.
Do you have any ideas on the code for removing the html calls to gravitar.com in buddypress?
JD
Thanks for the tip. Works flawlessly.
Desik
I noticed wordpress is changing the quote into a backquote, you should use
'
instead of’
Editorial Staff
Problem fixed.
Admin
fantasmo
This is the code snippet I was looking for.
But it doesn’t work properly… I put in the code into my functions.php (I’m sure everything is correct, also the path to my picture).
But when I go to discussion, I can’t see my Avatar, and also the WP-backend is a little bit broken… The code i put into the functions.php shows up above the header of the WP-backend.
Can you help me please? Maybe I didn’t only a little thing wrong??
Editorial Staff
The code above is 100% correct because that is what we are using. I don’t know what you can potentially be doing wrong. But without looking at your codes we won’t be able to help you out. You can hire us for a small fee, and our staff can surely fix the problem.
Admin
Tracy
I think I may be having the same trouble as fantasmo. The snippet works and the gravatar shows up within the discussion admin page but when you click on ‘save changes’ to save the options, you get a white screen which displays the footer from the option-discussions.php instead of the full page saying that the options have been saved.
CC Rogers
I saw the same results as Fantasmo. When I copy/pasted the code, the blank line between the add_filter and the function was lost for some reason. Putting the blank line back seemed to fix the problem.