默认情况下，WordPress 使用自己的第三方网站 “Gravatar“来制作用户照片（头像）。不过，使用第三方服务制作用户头像有很多缺点(特别是在国内)。在本文中，我将向你展示如何在 WordPress 中将媒体库中的图片设置为用户头像。

在本教程中，我将主要关注用户头像（而不是评论者），并解释为什么 Gravatar 的种种缺点，以及如何在本地托管自己的用户头像。

用户头像在哪里显示？

在WordPress中，用户头像主要在以下几个地方显示，有些主题和插件还会调用用户头像显示一些特定信息。

• WordPress 管理工具栏（核心）
• 用户仪表板（核心）
• 头像古腾堡区块（核心）
• 文章作者简介（取决于主题）
• 文章元标题（取决于主题）
• 会员插件
• 账户页面（如 WooCommerce 账户页面）
• 显示网站作者的网格（如Total 主题中的用户网格元素）

为什么不使用 Gravatar 制作用户头像？

不使用 Gravatar 的主要是因为它会增加从第三方网站获取和显示头像的额外工作量。这会减慢页面加载速度，降低谷歌页面速度得分。在实时网站上显示用户头像时，这主要是前端的问题。当然，加快后台速度总是有好处的！

但是，还有其他一些原因，你可能想从 WordPress 媒体库中使用本地托管的头像，而不是 Gravatar：

• 网站加载时间较慢。
• 页面速度分数较低。
• 如果 Gravatar 服务出现故障，用户头像就无法显示了。
• 对头像格式和分辨率的控制比较少。
• 更难设置和/或更新头像。

如何使用媒体库图片作为用户头像

在 WordPress 中使用自己的图片作为用户头像非常简单，我们可以通过几种方法来修改头像输出，但我个人推荐使用pre_get_avatar_data钩子，这样你就可以在 WordPress 向Gravatar.com 提出任何请求之前返回你的自定义 URL。

下面是一个示例代码段，展示了如何使用媒体库中的头像来修改用户的头像：

/**
 * Return a media library image for a user's avatar.
 *
 * @see https://www.wpexplorer.com/how-to-set-media-image-for-user-avatar-wordpress/
 */
add_filter( 'pre_get_avatar_data', static function( $data, $id_or_email ) {
	// Process the user identifier.
	$user = false;
	if ( is_numeric( $id_or_email ) ) {
		$user = get_user_by( 'id', absint( $id_or_email ) );
	} elseif ( $id_or_email instanceof WP_User ) {
		$user = $id_or_email;
	} elseif ( $id_or_email instanceof WP_Post ) {
		$user = get_user_by( 'id', (int) $id_or_email->post_author );
	} elseif ( $id_or_email instanceof WP_Comment && is_avatar_comment_type( get_comment_type( $id_or_email ) ) ) {
		if ( is_numeric( $id_or_email->user_id ) ) {
			$user = get_user_by( 'id', (int) $id_or_email->user_id );
		} elseif( is_email( $id_or_email->user_id ) ) {
			$user = get_user_by( 'email', $id_or_email->user_id );
		}
	}

	// Change the avatar for the user with an ID of 1 (generally the main site admin).
	if ( $user && 1 === (int) $user->ID ) {
		// IMPORTANT - Make sure to change 'YOUR_ATTACHMENT_ID' with the image ID
		// You want to use for this user's avatar.
		$data['url'] = wp_get_attachment_url( 'YOUR_ATTACHMENT_ID' );
	}

	// Return avatar data.
	return $data;
}, 10, 2 );

这段代码唯一有点冗长的地方是我们需要解析$id_or_email变量的值来获取用户。这是因为 WordPress 允许通过 ID 或电子邮件获取头像数据，而没有任何全局函数可以用来解析这些数据。

在这个特定的代码段中，我们只修改了 ID 为 1 的用户的头像 URL。 另外，请注意我是如何使用 “YOUR_ATTACHMENT_ID “作为我们要从媒体库中抓取的图片的值的。请确保将此值修改为实际的图片 ID。

如何查找用户 ID？

要找到要在代码段中使用的用户 ID，只需登录 WordPress 网站，进入 “用户 “仪表板。点击你要更改头像的用户，进入用户编辑界面。现在你可以在 URL 中找到 ID，格式如下：your-site.com/wp-admin/user-edit.php?user_id={ID}。

如何查找图片 ID？

要查找存储在 WordPress 网站上的任何图片的 ID，请进入媒体库编辑您要使用的图片。您将在 URL 中找到 ID，因为 URL 的格式如下：your-site.com/wp-admin/post.php?post={ID}。

如何在 “用户编辑 “屏幕中添加设置，以设置自定义头像图片

我上面分享的代码段非常适合对特定用户进行单项编辑。这对于你只修改一个或几个用户头像的小型网站来说是没有问题的。在用户较多的网站上，你可能想在 WP 管理中添加一个字段，这样你就可以定义用户的头像，而不必再弄乱代码。

下面的代码段在 WordPress 的用户编辑界面中添加了一个名为 “自定义头像 “的新字段，并会在设置该字段时修改头像。该字段将允许你输入媒体库中图片的 ID 或你希望用作用户头像的任何图片的完整 URL。

/**
 * Custom User Avatars.
 *
 * @see https://www.wpexplorer.com/how-to-set-media-image-for-user-avatar-wordpress/
 */
class Wenprise_Custom_User_Avatars {

	/**
	 * Constructor.
	 */
	public function __construct() {
		add_filter( 'user_contactmethods', [ $this, 'filter_user_contactmethods' ] );
		add_filter( 'pre_get_avatar_data', [ $this, 'filter_pre_get_avatar_data' ], 10, 2 );
	}

	/**
	 * Hooks into the "user_contactmethods" filter.
	 */
	public function filter_user_contactmethods( $methods ) {
		$methods['custom_avatar'] = esc_html__( 'Custom Avatar', 'text_domain' );
		return $methods;
	}

	/**
	 * Hooks into the "pre_get_avatar_data" filter.
	 */
	public function filter_pre_get_avatar_data( $data, $id_or_email ) {
		// Process the user identifier.
		$user = false;
		if ( is_numeric( $id_or_email ) ) {
			$user = get_user_by( 'id', absint( $id_or_email ) );
		} elseif ( $id_or_email instanceof WP_User ) {
			$user = $id_or_email;
		} elseif ( $id_or_email instanceof WP_Post ) {
			$user = get_user_by( 'id', (int) $id_or_email->post_author );
		} elseif ( $id_or_email instanceof WP_Comment && is_avatar_comment_type( get_comment_type( $id_or_email ) ) ) {
			if ( is_numeric( $id_or_email->user_id ) ) {
				$user = get_user_by( 'id', (int) $id_or_email->user_id );
			} elseif( is_email( $id_or_email->user_id ) ) {
				$user = get_user_by( 'email', $id_or_email->user_id );
			}
		}

		// Check for and assign custom user avatars.
		if ( $user && $custom_avatar = get_user_meta($user->ID, 'custom_avatar', true ) ) {
			if ( is_numeric( $custom_avatar ) ) {
				$data['url'] = esc_url( wp_get_attachment_url( $custom_avatar ) );
			} else {
				$data['url'] = esc_url( $custom_avatar );
			}
		}

		// Return avatar data.
		return $data;
	}

}

new Wenprise_Custom_User_Avatars;

修改后的结果如下：

在本教程中，自定义头像字段是一个简单的文本字段，因为 WordPress 没有本地媒体库图片选择字段。如果你愿意，可以在网站上加载一个额外的 javascript 文件，在字段旁边添加一个选择按钮。这会让事情变得更加复杂，在我看来，没有这个必要，这样会使代码变得臃肿。

总结

在 WordPress 中使用自己的媒体库图片作为用户头像是个好主意，值得强烈推荐。可惜的是，WordPress 本身并不具备这种功能。我相信这是为了鼓励更多的人使用他们的 Gravatar 服务。

幸运的是，使用一点代码就可以非常容易地设置自己的用户资料照片（头像），就像我在上面向你展示的那样。如果您对本文中的观点和代码有任何问题，欢迎在评论中提出，我们一起讨论！