Skip to main content

Simple Image Uploader Widget for Django-Admin

Project description

django-image-uploader-widget

Supported Python Versions Supported Django Versions PyPI - Version GitHub License PyPI - Downloads GitHub Actions Workflow Status

Introduction

django-image-uploader-widget provides a beautiful image uploader widget for django and a multiple image inline editor for django-admin.

Requirements

  • Python 3.8+
  • Django 3.2+

Features

  • Support required and optional ImageField;
  • Support for ImageField inside inlines django-admin;
  • Support preview modal;
  • Support custom inline for django-admin usage.
  • Support reordering inside django-admin inline.
  • Support ArrayField for PostgreSQL databases.

Installation

Install from PyPI:

pip install django-image-uploader-widget

Add image_uploader_widget to INSTALLED_APPS:

INSTALLED_APPS = [
    # ...
    'image_uploader_widget',
    # ...
]

Basic Usage

With Admin

The ImageUploaderWidget is a class that implements a custom widget for single image uploader and can be used inside the formfield_overrides attribute inside the ModelAdmin class.

# admin.py
from django.contrib import admin
from django.db import models
from image_uploader_widget.widgets import ImageUploaderWidget
from .models import YourModel


@admin.register(YourModel)
class YourModelAdmin(admin.ModelAdmin):
    formfield_overrides = {
        models.ImageField: {'widget': ImageUploaderWidget},
    }

See the documentation for more complex usage's.

With ModelForm

The ImageUploaderWidget can be used inside the widgets Meta attribute of a Form/ModelForm:

# forms.py
from django import forms
from image_uploader_widget.widgets import ImageUploaderWidget

class ExampleForm(forms.ModelForm):
    class Meta:
        widgets = {
            'image': ImageUploaderWidget(),
        }
        fields = '__all__'

See the documentation for more complex usage's.

Custom Inline Admin

The ImageUploaderInline is implemented with the base of the admin.StackedInline to create an custom django-admin to work with multiple images upload using a model only to store the images:

# models.py

class Product(models.Model):
    # ...

class ProductImage(models.Model):
    product = models.ForeignKey(
        Product,
        related_name="images",
        on_delete=models.CASCADE
    )
    image = models.ImageField("image")
    # ...
# admin.py
from django.contrib import admin
from image_uploader_widget.admin import ImageUploaderInline
from .models import Product, ProductImage

class ProductImageAdmin(ImageUploaderInline):
    model = ProductImage

@admin.register(Product)
class ProductAdmin(admin.ModelAdmin):
    inlines = [ProductImageAdmin]

See the documentation for more complex usage's.

Array Field

The ArrayField support is made by a custom field, called ImageListField. Then, to use it, we need to change the field from default ArrayField to ImageListField. The reason for it is: the default ArrayField with ImageField not works and some part of the behaviour of the ImageField is implemented inside the ImageListField.

# models.py
from django.db import models
from image_uploader_widget.postgres import ImageListField

class TestWithArrayField(models.Model):
    images = ImageListField(blank=True, null=True, upload_to="admin_test")

    class Meta:
        verbose_name = "Test With Array Field"

See the documentation for more complex usage's.

Documentation

All the documentation of basic and advanced usage of this package is disponible at documentation.

Preview

Widget with Image in Dark ThemeWidget with Image in Light Theme

Widget in Dark ThemeWidget in Light Theme

Behaviour

Widget Behaviour

Custom Admin Inline Behaviour

Project details


Download files

Download the file for your platform. If you're not sure which to choose, learn more about installing packages.

Source Distribution

django-image-uploader-widget-0.5.0.tar.gz (21.0 kB view hashes)

Uploaded Source

Built Distribution

Supported by

AWS AWS Cloud computing and Security Sponsor Datadog Datadog Monitoring Fastly Fastly CDN Google Google Download Analytics Microsoft Microsoft PSF Sponsor Pingdom Pingdom Monitoring Sentry Sentry Error logging StatusPage StatusPage Status page