如何将用户个人资料头像图像渲染到 wagtail 模板中？

Question

我正在使用 Wagtail CMS 创建一个博客站点。每当发布新帖子时，我想显示作者头像图像。我正在尝试从这个/admin/account/change_avatar/ 位置渲染图像。我可以看到这里上传的图像在wagtailusers_userprofile -> col name: avatar 表下，但不知道如何在模板中呈现。

Answer 1

这张图片不是典型的 Wagtail 图片（来自wagtailimages.Image），它看起来像普通的models.ImageField。

这是头像的 UserProfile 模型中的内容：

class UserProfile(models.Model):

    user = models.OneToOneField(
        settings.AUTH_USER_MODEL, on_delete=models.CASCADE, related_name='wagtail_userprofile'
    )

    avatar = models.ImageField(
        verbose_name=_('profile picture'),
        upload_to=upload_avatar_to,
        blank=True,
    )

因为这是一个常规图像字段，您可以通过在模板中附加.url 来获取网址。

这是一些示例模板代码：

{% if request.user.is_authenticated %}
  {% if request.user.wagtail_userprofile.avatar %}
    <img src="{{ request.user.wagtail_userprofile.avatar.url }}" alt="{{ request.user.get_full_name }}">
  {% else %}
    {# No image #}
  {% endif %}
{% endif %}

上面的代码将检查用户是否在模板中通过了身份验证。如果你不需要它，放弃它。

然后有 if 语句来检查 request.user.wagtail_userprofile.avatar 是否存在。 wagtail_userprofile 来自UserProfile 模型上的user 字段。它使用related_name，所以我们在模板中使用它。

我还为 alt 标签添加了{{ request.user.get_full_name }}，因为在这种情况下，图像 alt 可能应该是用户名，而不是文件名。

如果您需要高度或宽度，可以通过{{ request.user.wagtail_userprofile.avatar.height }} 和{{ request.user.wagtail_userprofile.avatar.width }} 获得。