CODEWITHSUNDEEP
wagtail
Kiwiheretic
Kiwiheretic

Reputation: 388

Is there a way to show images in a Wagtail Model Admin Record Listing page?

I have reviewed the question on Is there any way to show a field on a listing page in Wagtail admin? but my situation seems to similar but also different enough that that particular solution won't work for me. Instead of on the Page listing I wish to achieve a similar thing on the Model Admin listing and I would think this should be such a common requirement that I am picking that someone must have done this before I have attempted it.

I haven't really figured out how to even try anything to get started but what I have looked at is the modeladmin template tags under wagtail.contrib.modeladmin on GitHub but I am completely guessing.

Can anyone point me to which templates I need to modify and whether I need to modify any of the template tags and how to override anything I need to override?

Upvotes: 1

Views: 645

Answers (2)

tombreit
tombreit

Reputation: 1379

The modeladmin feature is no longer available in version wagtail>=6 (but the previous contrib module is still available as https://github.com/wagtail-nest/wagtail-modeladmin).

You can use the new PageListingViewSet class to achieve similar results.

This is a Wagtail admin page listing with a thumbnail, assuming the model is ProfilePage and the image field is avatar_image:

# file: wagtail_hooks.py

from wagtail import hooks
from wagtail.admin.viewsets.pages import PageListingViewSet
from wagtail.admin.ui.tables import Column, BooleanColumn, BaseColumn

from .models import ProfilePage

class ImageColumn(BaseColumn):
    cell_template_name = "wagtailadmin/tables/cell_image.html"

    def get_cell_context_data(self, instance, parent_context):
        context = super().get_cell_context_data(instance, parent_context)

        image_field = getattr(instance, self.name, None)
        if image_field:
            context["image_url"] = image_field.get_rendition(
                "fill-50x70|jpegquality-92"
            ).url
            context["image_alt"] = instance.title
        return context

class ProfilePageListingViewSet(PageListingViewSet):
    icon = "group"
    menu_label = "Profiles"
    add_to_admin_menu = True
    model = ProfilePage

    columns = PageListingViewSet.columns + [
        ImageColumn("avatar_image", label="Image"),
        Column("last_published_at"),
    ]

profile_page_listing_viewset = ProfilePageListingViewSet("profile_pages")

@hooks.register("register_admin_viewset")
def register_profile_page_listing_viewset():
    return profile_page_listing_viewset

<!-- templates/wagtailadmin/tables/cell_image.html -->
<td>
    <img src="{{ image_url }}" alt="{{ image_alt }}">
</td>

Upvotes: 1

gasman
gasman

Reputation: 25272

There's no need to override templates for this - this is standard functionality in ModelAdmin. Adding extra fields to the listing is done by setting list_display on the ModelAdmin class:

class BookAdmin(ModelAdmin):
    model = Book
    list_display = ('title', 'author')

For displaying images, ModelAdmin provides ThumbnailMixin:

from wagtail.contrib.modeladmin.mixins import ThumbnailMixin
from wagtail.contrib.modeladmin.options import ModelAdmin

class BookAdmin(ThumbnailMixin, ModelAdmin):
    model = Book
    thumb_image_field_name = 'cover_image'
    list_display = ('title', 'author', 'admin_thumb')

('admin_thumb' is a special-purpose field name provided by ThumbnailMixin, and should be used rather than the actual image field on your model - cover_image in this example.)

Upvotes: 2

Related Questions