Add image/avatar field to users

Question

I want that each user on my website will have an image in his profile. I don't need any thumbnails or something like that, just a picture for each user. The simpler the better. The problem is I don't know how to insert this type of field into my user profile. Any suggestions?

Answer 1

You need to make a form that has a clean method that validates the properties you're looking for:

#models.py
from django.contrib.auth.models import User

class UserProfile(models.Model):
    user   = models.OneToOneField(User)
    avatar = models.ImageField()


#forms.py
from django import forms
from django.core.files.images import get_image_dimensions

from my_app.models import UserProfile


class UserProfileForm(forms.ModelForm):
    class Meta:
        model = UserProfile

    def clean_avatar(self):
        avatar = self.cleaned_data['avatar']

        try:
            w, h = get_image_dimensions(avatar)

            #validate dimensions
            max_width = max_height = 100
            if w > max_width or h > max_height:
                raise forms.ValidationError(
                    u'Please use an image that is '
                     '%s x %s pixels or smaller.' % (max_width, max_height))

            #validate content type
            main, sub = avatar.content_type.split('/')
            if not (main == 'image' and sub in ['jpeg', 'pjpeg', 'gif', 'png']):
                raise forms.ValidationError(u'Please use a JPEG, '
                    'GIF or PNG image.')

            #validate file size
            if len(avatar) > (20 * 1024):
                raise forms.ValidationError(
                    u'Avatar file size may not exceed 20k.')

        except AttributeError:
            """
            Handles case when we are updating the user profile
            and do not supply a new avatar
            """
            pass

        return avatar

Answer 2

To connect the UserProfile model to your User model make sure you are extending your User model as fully explained in this tutorial: http://www.b-list.org/weblog/2006/jun/06/django-tips-extending-user-model/

This will allow you to access UserProfile attributes for your User, including the avatar, using user.get_profile().avatar. (Note the syntax in different in your template, see below for how to display the avatar in your template.)

You can use an image field in your UserProfile model for the avatar:

#upload at specific location
avatar = models.ImageField(upload_to='images')

This works exactly like a FileField but is specific for images and validates that the uploaded object is a valid image. To limit the file size you can use the answer given here by @pastylegs: Max image size on file upload

Then, assuming your userprofile model is called UserProfile, you access the avatar in your template as follows:

<img src=path/to/images/{{ user.get_profile.avatar }}">

More about the image field here: https://docs.djangoproject.com/en/dev/ref/models/fields/#imagefield

Answer 3

Assuming you're using standard contrib.auth, you can designate a model as an 'user profile' model, via AUTH_PROFILE_MODULE setting. You can then use it to attach any additional information you want to the User objects, e.g.

from django.contrib.auth.models import User

class UserProfile(models.Model):
    user   = models.OneToOneField(User)
    avatar = models.ImageField() # or whatever