当サイト、Codex 日本語版は今後積極的な更新は行わない予定です。後継となる新ユーザーマニュアルは、https://ja.wordpress.org/support/ にあります。
万が一、当サイトで重大な問題を発見した際などは、フォーラムWordSlack #docs チャンネルでお知らせください。</p>

「Gravatar の使い方」の版間の差分

提供: WordPress Codex 日本語版
移動先: 案内検索
(書式・リンク調整、未翻訳/日本語情報追加)
(最新版の WordPress.org の日本語ドキュメントが公開された、もしくは公開が予定されたため、お知らせを追加)
 
(4人の利用者による、間の36版が非表示)
1行目: 1行目:
{{NeedTrans}}
+
{{Message|
 +
| background = #d7f1fa
 +
| border = #a8a8a8
 +
| color = #000000
 +
| text = '''注意: ''' 最新版が WordPress.org の日本語ドキュメントに追加されています。詳しくは、https://ja.wordpress.org/support/article/how-to-use-gravatars/ をご覧ください。
 +
}}
  
<div id="What_is_a_Gravatar.3F">
+
==Gravatar とは?==
==What is a Gravatar?==
+
</div>
+
  
Gravatars are '''Globally Recognized Avatars'''. An avatar or gravatar is an icon, or representation, of a user in a shared virtual reality, such as a forum, chat, website, or any other form of online community in which the user(s) wish to have something to distinguish themselves from other users. Created by Tom Werner, gravatars make it possible for a person to have one avatar across the entire web. Avatars are usually an 80px by 80px image that the user will create themselves. 
+
[http://ja.gravatar.com/ Gravatar] (Globally Recognized Avatar) とは、広い範囲で利用できるアバターです。Gravatar はアイコンであり、フォーラム、チャット、ウェブサイトのような仮想現実上のオンライン・コミュニティの中で、そのユーザーの身代わりとなって、他のユーザーと自分自身を区別できるようにします。
  
[[Image:gravatars-in-comments.png|frame|right|Gravatars in blog post comments]]
+
トム・ワーナー(Tom Werner)によって開発された Gravatar を使えば、複数のウェブサービス上で共通するアバターを持つことができます。アバターは、通常、80×80ピクセルのユーザーが作成した画像です。
A Gravatar is essentially the same thing, but they are all hosted on a single server and are called up by encrypting the users' email address via the MD5 algorithm.  So instead of having one avatar on one forum you visit, and another at a blog you visit, you could have the same avatar at both.
+
  
Gravatars can easily be used within WordPress with the Gravatar WordPress Plugin or added manually in the <code>index.php</code>, <code>comments.php</code> and <code>comments-popup.php</code> [[テンプレート|template files]].
+
[[Image:gravatars-in-comments.png|frame|right|コメント欄に表示される Gravatar]]
 +
Gravatar は基本的にアバターと同じものですが、1つのサーバーで管理され、MD5 アルゴリズムによって暗号化されたユーザーのメールアドレスによって呼び出されます。そのため、利用者は訪れたフォーラムやブログごとにアバターを設定する代わりに、どこでも同じアバターを利用できるようになります。
 +
 
 +
Gravatarは、Gravatar WordPress Plugin を利用するか、<code>index.php</code><code>comments.php</code><code>comments-popup.php</code> といった[[用語集#テンプレート|テンプレートファイル]]に記述することで、簡単に WordPress の中で使うことができます。
  
 
<div id="How_a_Gravatar_is_Constructed">
 
<div id="How_a_Gravatar_is_Constructed">
==How a Gravatar is Constructed==
+
 
 +
==Gravatar を作成する==
 
</div>
 
</div>
A Gravatar is a dynamic image resource that is requested from a server. The request URL is presented here, broken into its segments. The URL always begins with:
+
Gravatar は、サーバーに動的にリクエストされる画像リソースです。リクエスト URL をセグメント別に、以下に示します。まず、URL は常に次のように始まります:
  
 
  <nowiki>http://www.gravatar.com/avatar.php?</nowiki>
 
  <nowiki>http://www.gravatar.com/avatar.php?</nowiki>
  
A mandatory parameter named <code>gravatar_id</code> follows this. Its value is the hexadecimal MD5 hash of the requested users' email address with all whitespace trimmed. The value is case insensitive.
+
さらに、gravatar_id というパラメータが必ず続きます。その値は、リクエストされたユーザーのメールアドレスを16進の MD5 ハッシュで暗号化したもので、すべての空白文字は省かれ、大文字と小文字は区別されません。
  
 
  gravatar_id=279aa12c3326f87c460aa4f31d18a065
 
  gravatar_id=279aa12c3326f87c460aa4f31d18a065
  
An optional <code>rating</code> parameter may follow with a value of <code>[ G | PG | R | X ]</code> which determines the highest rating (inclusive) that will be returned.
+
さらに、<code>[G | PG | R | X]</code>というレーティング最高値を示す、オプションの <code>rating</code> パラメータが付け加えられることもあります。
  
 
  &rating=R
 
  &rating=R
  
Gravatar offers a [http://gravatar.com/rating.php rate checking service] so you can determine your rate.
+
Gravatar は、利用者がレーティングを決めることができるように、[http://gravatar.com/rating.php レーティングチェックサービス]も提供しています。
  
An optional <code>size</code> parameter may follow that specifies the desired width and height of the Gravatar. Valid values are from 1 to 80 inclusive. Any size other than 80 will cause the original Gravatar image to be downsampled using bicubic resampling before output.
+
オプションの <code>size</code> パラメータには、Gravatar の幅と高さを指定します。有効な値の範囲は1から80です。オリジナルの Gravatar の画像が80を超えている場合は、表示される画像がバイキュービック(bicubic)方式で、再サンプリングされて解像度が下げられます。
  
 
  &size=40
 
  &size=40
  
An optional <code>default</code> parameter may follow that specifies the full [[用語集#URL|URL]], encoded URL, protocol included, of a GIF, JPEG, or PNG image that should be returned if either the requested email address has no associated gravatar, or that Gravatar has a rating higher than is allowed by the <code>rating</code> parameter.
+
オプションの<code>default</code>パラメータには、リクエストされたメールアドレスがgravatarと連携していない場合や Gravatar が<code>rating</code> パラメータよりも高いレーティングの場合に返される特定のフル [[用語集#URL|URL]]、コード化された URL、または GIF、JPEG や PNG 画像などが含まれるプロトコルを指定します。
  
 
  &default=http%3A%2F%2Fwww.somesite.com%2Fsomeimage.jpg
 
  &default=http%3A%2F%2Fwww.somesite.com%2Fsomeimage.jpg
  
An optional <code>border</code> parameter may follow that specifies the hexadecimal value of a 1px border to be overlaid on the Gravatar. The supplied value may be either the full six character hex string (e.g. <code>FF0000</code> for red) or the abbreviated three character hex string (e.g. <code>F00</code> for red).
+
オプションの <code>border</code> パラメータには、Gravatar に描かれる1ピクセルの境界線を16進数の値で指定します。指定される値は、6文字の16進文字列(例:赤の場合は <code>FF0000</code>)か、省略形の3文字の16進文字(例えば赤のための <code>F00</code>)のどちらかになります。
  
 
  &border=FF0000
 
  &border=FF0000
  
 
<div id="Using_Gravatars_in_WordPress">
 
<div id="Using_Gravatars_in_WordPress">
== Using Gravatars in WordPress ==
+
 
 +
== WordPressでGravatarsを使う ==
 
</div>
 
</div>
[[Image:gravatarCWE.gif|frame|right|An example of a Gravatar]]For most people, encrypting an email address with MD5 is no easy task, most of the time requiring [http://www.php.net/ PHP] or other form of scripting.  Several [[プラグイン|WordPress Plugins]] have been created to help with this task, such as the [http://www.gravatar.com/implement.php#section_2_2 Gravatar.com Plugin] and [http://zenpax.com/gravatars2/ Gravatars2 Enhanced Caching Plugin].For information on using and installing those WordPress Plugins, see the Plugin's documentation.
+
[[Image:gravatarCWE.gif|frame|right|Gravatarの例]]一般の人にとって、メールアドレスをMD5で暗号化することは容易ではありません。また、作業のほとんどは[http://www.php.net/ PHP]や他のスクリプトで書かれたフォームで行われます。[http://www.gravatar.com/implement.php#section_2_2 Gravatar.com Plugin][http://zenpax.com/gravatars2/ Gravatars2 Enhanced Caching Plugin]など、いくつかの [[プラグイン|WordPress Plugins]]は、この作業のために作成されました。詳細情報は、これらのプラグインをインストールして、各プラグインのドキュメントテーションを参照してください。
  
As of [[Version 2.5|WordPress 2.5]], Gravatars are built-in and require no additional Plugins for basic usage and management.
+
なお、[[Version 2.5|WordPress 2.5]]には、Gravatar 機能が内蔵されているので、使用したり管理するためにプラグインは必要ありません。
  
WordPress 2.5 marries theme authors and casual WordPress users together with support for Gravatars in the WordPress Administration Panels. Theme authors have an option to include Gravatars in their designs, and are recommended to do so. WordPress users can easily control their Gravatar usage in the '''[[管理パネル#Settings - Configuration Settings|Settings]] > [[Settings Discussion SubPanel|Discussion]]''' [[管理パネル|Administration Panel]].
+
WordPress 2.5では、管理画面で Gravatar の設定ができるようになり、テーマ作者と一般のWordPressユーザーのどちらもGravatarが利用しやすくなりました。テーマ作者は Gravatar をテーマのデザインに組み込むことができるようになったので、今後はより多くのテーマで組み込まれるべきです。WordPress ユーザーは、'''[[管理パネル#Settings - Configuration Settings|Settings]] > [[Settings Discussion SubPanel|Discussion]]''' [[管理パネル|Administration Panel]]でGravatarをより簡単に設定できるようになります。
 +
 
 +
 
 +
WordPressユーザーは、以下の設定ができます:
 +
* アバター(Gravatar)を表示したり表示しないようにしたりできる。
 +
* アバターの閲覧制限のレーティングを設定できる。
  
WordPress users can change:
 
* Whether Avatars (aka, Gravatars) are displayed or not.
 
* Which rating of Avatars are shown.
 
  
 
<div id="Theme_Support_for_WordPress_2.5">
 
<div id="Theme_Support_for_WordPress_2.5">
=== Theme Support for WordPress 2.5 ===
+
=== WordPress 2.5に対応したテーマ ===
 
</div>
 
</div>
The function to add Gravatars to your theme is called: <code>get_avatar</code>. The function returns a complete image HTML tag of the Avatar.
+
<u>WordPress 2.7 以降対応のテーマでは <code>get_avatar()</code> の追加は不要です([[#変更履歴|参照]])。</u>
 +
 
 +
Gravatar をテーマに加えるには、<code>get_avatar</code> と呼ばれる関数を利用します。この関数は、アバターの完全な画像 HTML タグを返します。
  
The function is called as follows:
+
この関数は、以下のように呼び出されます:
 
   <nowiki><?php  
 
   <nowiki><?php  
 
   echo get_avatar( $id_or_email, $size = '96', $default = '<path_to_url>' );  
 
   echo get_avatar( $id_or_email, $size = '96', $default = '<path_to_url>' );  
 
   ?></nowiki>
 
   ?></nowiki>
  
The parameters are:
+
パラメータは以下の通りです:
* id_or_email '''(required)''': Author’s User ID (an integer or string), an E-mail Address (a string) or the comment object from the comment loop. ''Note: with most comment templates you can use <code>$comment</code> here, in order to display the gravatar of the commenter''.
+
* size '''(optional)''': Avatar display size (max is 512).
+
* default '''(optional)''': Absolute location of the default avatar to use (used when the person has no email address associated with them). If this is left blank then the gravatar you see [http://www.gravatar.com/avatar/ad516503a11cd5ca435acc9bb6523536 here] will be used as the default avatar.
+
  
Some things to note here:
+
* id_or_email(必須):作成者のUser ID(整数または文字列)、メールアドレス(文字列)またはコメント・ループのコメント・オブジェクト。注:ほとんどのコメントテンプレートでは、コメントを付けた人の Gravatar を示すために、$commentを使うことができます。他のテンプレートでは<code>get_the_author_meta('user_email')</code> を使います (ただし、バージョン 2.8 以前では <code>get_the_author_id()</code>)。
* The default Avatar size is 96x96 if you do not set the size using the size paramater.
+
* size(オプション):アバターの表示サイズ(最大512)。
* The default Avatar is Gravatar
+
* default(オプション):アバターの標準として利用されるロケーション(アバターと関連する電子メールアドレスがない利用者に適用される)。空白のままの場合は、次のような Gravatar が標準として適用されます。
* The Avatars will show only if the user allows them in the WP Admin Panel (enabled by default).
+
* The Avatars will only show based on the rating the user has selected in the WordPress Administration Panels.
+
  
Code output:
 
  
The default output is when using the above function is listed below. Various classes are applied to img element to help you with element styling.
+
若干の注意事項:
 +
* size パラメータでアバターのサイズが指定されない場合は、アバターの標準サイズは96x96になります。
 +
* デフォルトのアバターは、Gravatar です。
 +
* アバターは、ユーザーが管理画面で[アバターを表示する]と設定されている時だけ表示されます(デフォルトの設定では表示)。
 +
* アバターは、ユーザーが管理画面で設定したレーティングだけに基づいて表示されます。
 +
 
 +
 
 +
コード出力:
 +
 
 +
デフォルトの設定では、上記の関数を使用した出力は以下のようなリストになります。さまざまなクラスが、要素のスタイル付けをするために、img 要素に適用されます。
  
 
<pre>
 
<pre>
84行目: 98行目:
 
</pre>
 
</pre>
  
If the gravatar reverts to the default image, whether you have specified a default or not, the <code>img</code> element will also be given a class of <code>avatar-default</code>
+
メールアドレスがないため、Gravatar がデフォルトの画像に戻ると(例:ピンバックまたはトラックバックの場合)、デフォルトの設定が指定されたかどうかに関わらず、<code>img</code> 要素には <code>avatar-default</code> の CSS クラスが適用されます。
  
 
<div id="Backwards_Compatibility">
 
<div id="Backwards_Compatibility">
=== Backwards Compatibility ===
+
 
 +
=== Gravatarを使ったテーマ ===
 
</div>
 
</div>
  
If you wish to develop a WordPress Theme with Avatars for 2.5 and below, add a check for the Gravatar function to the code:
+
WordPress2.5のアバター機能を使ったWordPress Themeを開発したい場合は、以下のGravatar関数をチェックするコードを加えてください:
  
 
     <nowiki>if (function_exists('get_avatar')) {
 
     <nowiki>if (function_exists('get_avatar')) {
96行目: 111行目:
 
   } else {
 
   } else {
 
       //alternate gravatar code for < 2.5
 
       //alternate gravatar code for < 2.5
       $grav_url = "http://www.gravatar.com/avatar.php?gravatar_id=
+
       $grav_url = "http://www.gravatar.com/avatar.php?gravatar_id=" .  
        " . md5($email) . "&default=" . urlencode($default) . "&size=" . $size;
+
        md5($email) . "&default=" . urlencode($default) . "&size=" . $size;;
 
       echo "<img src='$grav_url'/>";
 
       echo "<img src='$grav_url'/>";
 
   }</nowiki>
 
   }</nowiki>
  
<div id="Gravatar.com_Plugin">
+
<div id="Checking_for_the_Existence_of_a_Gravatar">
=== Gravatar.com Plugin ===
+
 
 +
=== Gravatar が存在するかのチェック===
 
</div>
 
</div>
The [http://www.gravatar.com/implement.php#section_2_2 Gravatar.com Plugin] from Gravatar is the official Plugin for handling Gravatars.
+
メールアドレスをもとに Gravatar 画像をリクエストしても画像がない場合、デフォルト画像が返されます。
  
To use it:
+
これを望まない場合、実際の Gravatar 画像が返ってくるか、デフォルト画像が返ってくるかをチェックするとよいでしょう。
# Install and activate the Plugins.
+
# Place the <code><nowiki><?php gravatar(); ?></nowiki></code> function tag into the WordPress template file within the [[The Loop|WordPress Loop]] within an HTML image tag:
+
  
  <img src="<?php gravatar(); ?>" alt="Gravatar" />
+
例となる状況:
 +
* Gravatar を持たないユーザーにはローカルでデフォルトに設定したアバターを表示
 +
* Gravatar がない場合のみ、登録するようにアラートを表示
  
For more information on using and installing the Gravatars.com WordPress Plugin, visit the [http://www.gravatar.com/ Gravatars site].
+
注: 以下の情報を活用するには、PHP の理解が必要です。
 +
 
 +
このコツは、「404」をデフォルトに指定することです。以下の例では、Gravatar 画像がないとサービスはデフォルト画像の代わりに404エラーを返し、実際の画像があれば200コードを返します。他のエラーコードが帰ってくる場合もあるかもしれないので、200コードをチェックするのがよいでしょう。
 +
 
 +
以下は HTTP ヘッダーを利用したチェック関数の例です。必要に応じて変更してください。
 +
 
 +
function validate_gravatar($email) {
 +
// 使われる URL を作成しヘッダーをテスト
 +
$hash = md5($email);
 +
$uri = 'http://www.gravatar.com/avatar/' . $hash . '?d=404';
 +
$headers = @get_headers($uri);
 +
if (!preg_match("|200|", $headers[0])) {
 +
$has_valid_avatar = FALSE;
 +
} else {
 +
$has_valid_avatar = TRUE;
 +
}
 +
return $has_valid_avatar;
 +
}
  
 
<div id="Customizing_Your_Gravatars">
 
<div id="Customizing_Your_Gravatars">
=== Customizing Your Gravatars ===
+
 
 +
=== Gravatarをカスタマイズする ===
 
</div>
 
</div>
  
There are several settings to customize the Gravatars. The setting parameters are:
+
Gravatarをカスタマイズするためのいくつかの設定があります。設定するパラメータは以下の通りです:
  
 
  <?php gravatar(''"rating", size, "default", "border"''); ?>
 
  <?php gravatar(''"rating", size, "default", "border"''); ?>
  
;rating :The highest rating of Gravatar to be shown. The values are <code>G, PG, R,</code> and <code>X</code>. Showing only Gravatar's with a rating higher than <code>PG</code> can be accomplished with the following code:
+
;rating :Gravatarが表示される最も高いレーティングを指定します。レーティングには、<code>G、PG、R、X</code>があります。PG よりも高いレーティングだけが表示するには、以下のようなコードになります:
  
 
  <?php gravatar("PG"); ?>
 
  <?php gravatar("PG"); ?>
  
;size :Gravatar size is 80px by 80px by default. To change the sie, change the size value, keeping the size square, such as 80px by 80px:
+
;size :Gravatarのサイズは、デフォルトの設定では80×80ピクセルです。サイズを変更するには、sizeの値を変更します。80×80プクセルで四角形に設定するには、次のような値に設定します:
  
 
  <?php gravatar("PG", 80); ?>
 
  <?php gravatar("PG", 80); ?>
  
;default :If a user is not registered with Gravatars or another compatible Avatar service, a default image will be shown. You can override this with a custom image as a PNG, JPG, or GIF.
+
;default :ユーザーが Gravatar や互換性のある他のアバターサービスに未登録の場合は、デフォルト設定の画像が表示されます。利用者は、標準の設定の画像を PNG、JPG または GIF 形式の画像に変更できます。
  
 
  <?php gravatar("PG",40,"/images/no_gravatar.gif"); ?>
 
  <?php gravatar("PG",40,"/images/no_gravatar.gif"); ?>
  
;border :To add a border, use the <code>border</code> function.  It will add a 1px wide border around the Gravatar of the color that you choose.  By default there is no border. The following is an example of a Gravatar that will be no higher than a <code>PG</code> rating, be 40px by 40px, have a default image if no Gravatar is present, and have a 1px red border:
+
;border :境界線を引くには、<code>border</code> 関数を使用します。境界線は選択した色でGravatarの周囲に、幅1ピクセルで描かれます。標準の設定では境界線はなしです。以下の例は、レーティングが <code>PG</code> 以下で、サイズが40×40ピクセル、Gravatar がない場合にはデフォルト設定の画像を表示し、1ピクセルの赤い境界線を引くという場合の設定です:
  
 
  <?php gravatar("PG",40,"/images/no_gravatar.gif","FF0000"); ?>
 
  <?php gravatar("PG",40,"/images/no_gravatar.gif","FF0000"); ?>
  
 
<div id="Resources">
 
<div id="Resources">
==Resources==
+
== 資料 ==
 
</div>
 
</div>
  
 
* [http://www.gravatar.com/ Gravatar]
 
* [http://www.gravatar.com/ Gravatar]
* [[プラグイン|WordPress Plugins]]
+
* [[How to Use Gravatars in WordPress]] /[[:en:How to Use Gravatars in WordPress|en]]
* [http://www.obeattie.com/2006/05/20/meet-the-gravatars/ oBeattie : Meet the Gravatars]
+
 
* [http://www.gravatar.com/implement.php Gravatars Implement Page]
 
* [http://www.gravatar.com/implement.php Gravatars Implement Page]
 
* [http://txfx.net/code/wordpress/gravatar-signup/ Gravatar Signup Plugin]
 
* [http://txfx.net/code/wordpress/gravatar-signup/ Gravatar Signup Plugin]
* [http://fecklessmind.com/main/7/live-comment-preview-now-with-live-gravatars Live Gravatar Preview Hack]
 
 
* [http://weblogtoolscollection.com/archives/2008/03/03/gravatars-and-wordpress-25/ Gravatars & WordPress 2.5]
 
* [http://weblogtoolscollection.com/archives/2008/03/03/gravatars-and-wordpress-25/ Gravatars & WordPress 2.5]
 +
* [http://www.themelab.com/2008/05/09/add-gravatar-support-to-your-wordpress-comments/ Add Gravatar Support to Your WordPress Comments]
 +
* [http://wordpress.org/support/topic/190660?replies=13 WP Forum post about checking for existence of Gravatars]
 
* [http://wp.tekapo.com/2008/03/07/gravatars-and-wordpress-25/ わーどぷれすっ! » Gravatars と WordPress 2.5] -- 管理画面の設定~テーマへの追加方法、テーマを WordPress 下位バージョン互換にする方法
 
* [http://wp.tekapo.com/2008/03/07/gravatars-and-wordpress-25/ わーどぷれすっ! » Gravatars と WordPress 2.5] -- 管理画面の設定~テーマへの追加方法、テーマを WordPress 下位バージョン互換にする方法
 
* [http://everydays.hassii.com/archives/972 e.b.i.f » テーマにアバターを導入する方法 (WP 2.5+)] -- コメント欄への表示方法
 
* [http://everydays.hassii.com/archives/972 e.b.i.f » テーマにアバターを導入する方法 (WP 2.5+)] -- コメント欄への表示方法
  
 
== 変更履歴 ==
 
== 変更履歴 ==
 +
* [[Version 2.7|2.7]] : コメントループとして新規テンプレートタグ [[テンプレートタグ/wp_list_comments|wp_list_comments()]] を用いると、<code>get_avatar()</code> を使わずに Gravatar を表示できます。
 
* [[Version 2.5|2.5]] : WordPress 標準機能として組み込まれました。
 
* [[Version 2.5|2.5]] : WordPress 標準機能として組み込まれました。
  
{{原文|Using Gravatars|56753}}
+
== 関連ページ ==
 +
* [[管理画面]] > [[管理パネル#Settings|設定]] > [[Settings Discussion SubPanel|ディスカッション設定]]
 +
 
 +
==あわせて読む==
 +
 
 +
[[関数リファレンス/get_avatar|get_avatar]]
 +
 
 +
 
 +
{{原文|Using Gravatars|79876}}<!-- 2009-11-04T16:56:17 Lexhair 版 -->
  
 
{{DEFAULTSORT:Gravatarのつかいかた}}
 
{{DEFAULTSORT:Gravatarのつかいかた}}
 
[[Category:デザインとレイアウト]]
 
[[Category:デザインとレイアウト]]
 
[[Category:wp2.5]]
 
[[Category:wp2.5]]
 +
[[Category:wp2.7]]
  
 
[[en:Using Gravatars]]
 
[[en:Using Gravatars]]

2021年8月28日 (土) 23:04時点における最新版

注意: 最新版が WordPress.org の日本語ドキュメントに追加されています。詳しくは、https://ja.wordpress.org/support/article/how-to-use-gravatars/ をご覧ください。

Gravatar とは?

Gravatar (Globally Recognized Avatar) とは、広い範囲で利用できるアバターです。Gravatar はアイコンであり、フォーラム、チャット、ウェブサイトのような仮想現実上のオンライン・コミュニティの中で、そのユーザーの身代わりとなって、他のユーザーと自分自身を区別できるようにします。

トム・ワーナー(Tom Werner)によって開発された Gravatar を使えば、複数のウェブサービス上で共通するアバターを持つことができます。アバターは、通常、80×80ピクセルのユーザーが作成した画像です。

ファイル:gravatars-in-comments.png
コメント欄に表示される Gravatar

Gravatar は基本的にアバターと同じものですが、1つのサーバーで管理され、MD5 アルゴリズムによって暗号化されたユーザーのメールアドレスによって呼び出されます。そのため、利用者は訪れたフォーラムやブログごとにアバターを設定する代わりに、どこでも同じアバターを利用できるようになります。

Gravatarは、Gravatar WordPress Plugin を利用するか、index.phpcomments.phpcomments-popup.php といったテンプレートファイルに記述することで、簡単に WordPress の中で使うことができます。

Gravatar を作成する

Gravatar は、サーバーに動的にリクエストされる画像リソースです。リクエスト URL をセグメント別に、以下に示します。まず、URL は常に次のように始まります:

http://www.gravatar.com/avatar.php?

さらに、gravatar_id というパラメータが必ず続きます。その値は、リクエストされたユーザーのメールアドレスを16進の MD5 ハッシュで暗号化したもので、すべての空白文字は省かれ、大文字と小文字は区別されません。

gravatar_id=279aa12c3326f87c460aa4f31d18a065

さらに、[G | PG | R | X]というレーティング最高値を示す、オプションの rating パラメータが付け加えられることもあります。

&rating=R

Gravatar は、利用者がレーティングを決めることができるように、レーティングチェックサービスも提供しています。

オプションの size パラメータには、Gravatar の幅と高さを指定します。有効な値の範囲は1から80です。オリジナルの Gravatar の画像が80を超えている場合は、表示される画像がバイキュービック(bicubic)方式で、再サンプリングされて解像度が下げられます。

&size=40

オプションのdefaultパラメータには、リクエストされたメールアドレスがgravatarと連携していない場合や Gravatar がrating パラメータよりも高いレーティングの場合に返される特定のフル URL、コード化された URL、または GIF、JPEG や PNG 画像などが含まれるプロトコルを指定します。

&default=http%3A%2F%2Fwww.somesite.com%2Fsomeimage.jpg

オプションの border パラメータには、Gravatar に描かれる1ピクセルの境界線を16進数の値で指定します。指定される値は、6文字の16進文字列(例:赤の場合は FF0000)か、省略形の3文字の16進文字(例えば赤のための F00)のどちらかになります。

&border=FF0000

WordPressでGravatarsを使う

一般の人にとって、メールアドレスをMD5で暗号化することは容易ではありません。また、作業のほとんどはPHPや他のスクリプトで書かれたフォームで行われます。Gravatar.com PluginGravatars2 Enhanced Caching Pluginなど、いくつかの WordPress Pluginsは、この作業のために作成されました。詳細情報は、これらのプラグインをインストールして、各プラグインのドキュメントテーションを参照してください。

なお、WordPress 2.5には、Gravatar 機能が内蔵されているので、使用したり管理するためにプラグインは必要ありません。

WordPress 2.5では、管理画面で Gravatar の設定ができるようになり、テーマ作者と一般のWordPressユーザーのどちらもGravatarが利用しやすくなりました。テーマ作者は Gravatar をテーマのデザインに組み込むことができるようになったので、今後はより多くのテーマで組み込まれるべきです。WordPress ユーザーは、Settings > Discussion Administration PanelでGravatarをより簡単に設定できるようになります。


WordPressユーザーは、以下の設定ができます:

  • アバター(Gravatar)を表示したり表示しないようにしたりできる。
  • アバターの閲覧制限のレーティングを設定できる。


WordPress 2.5に対応したテーマ

WordPress 2.7 以降対応のテーマでは get_avatar() の追加は不要です(参照)。

Gravatar をテーマに加えるには、get_avatar と呼ばれる関数を利用します。この関数は、アバターの完全な画像 HTML タグを返します。

この関数は、以下のように呼び出されます:

  <?php 
   echo get_avatar( $id_or_email, $size = '96', $default = '<path_to_url>' ); 
   ?>

パラメータは以下の通りです:

  • id_or_email(必須):作成者のUser ID(整数または文字列)、メールアドレス(文字列)またはコメント・ループのコメント・オブジェクト。注:ほとんどのコメントテンプレートでは、コメントを付けた人の Gravatar を示すために、$commentを使うことができます。他のテンプレートではget_the_author_meta('user_email') を使います (ただし、バージョン 2.8 以前では get_the_author_id())。
  • size(オプション):アバターの表示サイズ(最大512)。
  • default(オプション):アバターの標準として利用されるロケーション(アバターと関連する電子メールアドレスがない利用者に適用される)。空白のままの場合は、次のような Gravatar が標準として適用されます。


若干の注意事項:

  • size パラメータでアバターのサイズが指定されない場合は、アバターの標準サイズは96x96になります。
  • デフォルトのアバターは、Gravatar です。
  • アバターは、ユーザーが管理画面で[アバターを表示する]と設定されている時だけ表示されます(デフォルトの設定では表示)。
  • アバターは、ユーザーが管理画面で設定したレーティングだけに基づいて表示されます。


コード出力:

デフォルトの設定では、上記の関数を使用した出力は以下のようなリストになります。さまざまなクラスが、要素のスタイル付けをするために、img 要素に適用されます。

<img alt='' src='http://gravatarurl_or_default'
class='avatar avatar-$size' height='$size' width='$size' />

メールアドレスがないため、Gravatar がデフォルトの画像に戻ると(例:ピンバックまたはトラックバックの場合)、デフォルトの設定が指定されたかどうかに関わらず、img 要素には avatar-default の CSS クラスが適用されます。

Gravatarを使ったテーマ

WordPress2.5のアバター機能を使ったWordPress Themeを開発したい場合は、以下のGravatar関数をチェックするコードを加えてください:

   if (function_exists('get_avatar')) {
      echo get_avatar($email);
   } else {
      //alternate gravatar code for < 2.5
      $grav_url = "http://www.gravatar.com/avatar.php?gravatar_id=" . 
        md5($email) . "&default=" . urlencode($default) . "&size=" . $size;;
      echo "<img src='$grav_url'/>";
   }

Gravatar が存在するかのチェック

メールアドレスをもとに Gravatar 画像をリクエストしても画像がない場合、デフォルト画像が返されます。

これを望まない場合、実際の Gravatar 画像が返ってくるか、デフォルト画像が返ってくるかをチェックするとよいでしょう。

例となる状況:

  • Gravatar を持たないユーザーにはローカルでデフォルトに設定したアバターを表示
  • Gravatar がない場合のみ、登録するようにアラートを表示

注: 以下の情報を活用するには、PHP の理解が必要です。

このコツは、「404」をデフォルトに指定することです。以下の例では、Gravatar 画像がないとサービスはデフォルト画像の代わりに404エラーを返し、実際の画像があれば200コードを返します。他のエラーコードが帰ってくる場合もあるかもしれないので、200コードをチェックするのがよいでしょう。

以下は HTTP ヘッダーを利用したチェック関数の例です。必要に応じて変更してください。

function validate_gravatar($email) {
	// 使われる URL を作成しヘッダーをテスト
	$hash = md5($email);
	$uri = 'http://www.gravatar.com/avatar/' . $hash . '?d=404';
	$headers = @get_headers($uri);
	if (!preg_match("|200|", $headers[0])) {
		$has_valid_avatar = FALSE;
	} else {
		$has_valid_avatar = TRUE;
	}
	return $has_valid_avatar;
}

Gravatarをカスタマイズする

Gravatarをカスタマイズするためのいくつかの設定があります。設定するパラメータは以下の通りです:

<?php gravatar("rating", size, "default", "border"); ?>
rating 
Gravatarが表示される最も高いレーティングを指定します。レーティングには、G、PG、R、Xがあります。PG よりも高いレーティングだけが表示するには、以下のようなコードになります:
<?php gravatar("PG"); ?>
size 
Gravatarのサイズは、デフォルトの設定では80×80ピクセルです。サイズを変更するには、sizeの値を変更します。80×80プクセルで四角形に設定するには、次のような値に設定します:
<?php gravatar("PG", 80); ?>
default 
ユーザーが Gravatar や互換性のある他のアバターサービスに未登録の場合は、デフォルト設定の画像が表示されます。利用者は、標準の設定の画像を PNG、JPG または GIF 形式の画像に変更できます。
<?php gravatar("PG",40,"/images/no_gravatar.gif"); ?>
border 
境界線を引くには、border 関数を使用します。境界線は選択した色でGravatarの周囲に、幅1ピクセルで描かれます。標準の設定では境界線はなしです。以下の例は、レーティングが PG 以下で、サイズが40×40ピクセル、Gravatar がない場合にはデフォルト設定の画像を表示し、1ピクセルの赤い境界線を引くという場合の設定です:
<?php gravatar("PG",40,"/images/no_gravatar.gif","FF0000"); ?>

資料

変更履歴

  • 2.7 : コメントループとして新規テンプレートタグ wp_list_comments() を用いると、get_avatar() を使わずに Gravatar を表示できます。
  • 2.5 : WordPress 標準機能として組み込まれました。

関連ページ

あわせて読む

get_avatar


最新英語版: WordPress Codex » Using Gravatars最新版との差分