在Django管理inlin中显示缩略图

2024-06-07 13:54:24 发布

您现在位置:Python中文网/ 问答频道 /正文

我是Django新手,正在尝试更改如何在管理面板中显示内联图像。我可以在每个“当前”上添加预览标记并显示缩略图吗?在

enter image description here


Tags: django标记图像面板缩略图新手
3条回答

您需要将一个方法添加到模型.py公司名称:

def thumbnail(self):
  return u'<img src="%s" />' % (self.image.url)

thumbnail.short_description = 'Thumbnail'

然后进来管理员py您需要添加:

^{2}$

这将在那里添加缩略图。在

接下来,对于@shaniqwa答案,django(2.2.7)现在需要render()中的呈现器

class AdminImageWidget(AdminFileWidget):

    def render(self, name, value, attrs=None, renderer=None):
        output = []

        if value and getattr(value, "url", None):
            image_url = value.url
            file_name = str(value)

            output.append(
                f' <a href="{image_url}" target="_blank">'
                f'  <img src="{image_url}" alt="{file_name}" width="150" height="150" '
                f'style="object-fit: cover;"/> </a>')

        output.append(super(AdminFileWidget, self).render(name, value, attrs, renderer))
        return mark_safe(u''.join(output))


class ProductImagesAdmin(admin.TabularInline):
    model = ProductImages
    extra = 1
    formfield_overrides = {
        models.ImageField: {'widget': AdminImageWidget}
    }

经过一番挖掘,我终于做到了。不幸的是,我找不到我使用的源代码(太多的标签页,太多的标签不起作用…)。所以我们的想法是创建一个图像小部件,它附加一些html脚本。在

from django.contrib.admin.widgets import AdminFileWidget

class AdminImageWidget(AdminFileWidget):
         def render(self, name, value, attrs=None):
         output = []
         if value and getattr(value, "url", None):
              image_url = value.url
              file_name=str(value)
              output.append(u' <a href="%s" target="_blank"><img src="%s" alt="%s" width="150" height="150"  style="object-fit: cover;"/></a> %s ' % \
            (image_url, image_url, file_name, _('')))
    output.append(super(AdminFileWidget, self).render(name, value, attrs))
    return mark_safe(u''.join(output))


class CollectionImageInline(admin.TabularInline):
    formfield_overrides = {models.ImageField: {'widget': AdminImageWidget}}

结果:(不管这个问题如何,我都将管理主题改为默认) enter image description here

相关问题 更多 >

    热门问题