Question

我想更改admin django中的某些css，如base.css。在django库中直接更改会更好吗？如何以最佳方式覆盖它？

Answer 1

这很大程度上取决于你想做什么。虽然首先：不要直接在Django管理员中覆盖它。你认为两种选择是合理的：

如果您想要更改管理员的外观，则应覆盖管理员模板。这里详细介绍了这一点：Overriding admin templates。有时您可以扩展原始管理文件，然后覆盖{% block extrastyle %}{% endblock %}中django/contrib/admin/templates/admin/base.html之类的块作为示例。
如果您的样式是特定于模型的，则可以通过Media中的admin.py元类添加其他样式。请参阅此处的示例：

class MyModelAdmin(admin.ModelAdmin):
    class Media:
        js = ('js/admin/my_own_admin.js',)    
        css = {
             'all': ('css/admin/my_own_admin.css',)
        }

Answer 2

我只是扩展了admin / base.html以包含对我自己的css文件的引用 - 最后。 css的美妙之处在于您无需触及现有定义，只需重新定义即可。

Answer 3

此解决方案适用于管理网站，我认为这是最干净的方式，因为它会覆盖base_site.html，在升级django时不会发生变化。

在模板目录中创建一个名为admin的文件夹，创建一个名为base_site.html的文件。

在css下的静态目录中创建一个名为admin-extra.css的文件。

为您的表单填写所需的所有自定义CSS，例如：body{background: #000;}。

将其粘贴到base_site.html：

中

{% extends "admin/base.html" %}
{% load static from staticfiles %} # This might be just {% load static %} in your ENV

{% block title %}{{ title }} | {{ site_title|default:_('Django site admin') }}{% endblock %}

{% block extrastyle %}{{ block.super }}<link rel="stylesheet" type="text/css" href="{% static "css/admin-extra.css" %}" />{% endblock %}

{% block branding %}
<h1 id="site-name"><a href="{% url 'admin:index' %}">{{ site_header|default:_('Django administration') }}</a></h1>
{% endblock %}

{% block nav-global %}{% endblock %}

那就是它！你已经完成了

Answer 4

在settings.py中，确保您的应用在INSTALLED_APPS之前列在管理员之前。
创建(your-app)/templates/admin/base_site.html并将<style>块放入{% block extrahead %}

示例：

{% extends "admin/base_site.html" %}
{% block extrahead %}
    <style>
        .field-__str__ {
            font-family: Consolas, monospace;
        }
    </style>
{% endblock %}

Answer 5

在静态目录中，创建一个static/admin/css/base.css文件。

先粘贴Django's default Admin CSS，然后根据需要进行调整。

Answer 6

如果你想要一个全局范围并且你不想考虑重写模板，那么mixin对此非常有用。将此代码放在任何您想要的位置：

class CSSAdminMixin(object):
    class Media:
        css = {
            'all': ('css/admin.css',),
        }

然后，使用覆盖创建一个名为admin.css的CSS文件，例如：

select[multiple] {
    resize: vertical;
}

然后，无论你想要什么型号，都可以：

class MyModelAdmin(admin.ModelAdmin, CSSAdminMixin):

你会全力以赴。

Answer 7

将admin/css/changelists.css放在STATICFILES_DIRS中的文件夹中，它将使用changelists.css而不是默认的管理员。

Answer 8

如果给定的字符串是模型的方法、ModelAdmin 或可调用的，Django 将默认对输出进行 HTML 转义。要转义用户输入并允许您自己的未转义标签，请使用 format_html()。

这是一个完整的示例模型：

from django.contrib import admin
from django.db import models
from django.utils.html import format_html

class Person(models.Model):
    first_name = models.CharField(max_length=50)
    last_name = models.CharField(max_length=50)
    color_code = models.CharField(max_length=6)

    @admin.display
    def colored_name(self):
        return format_html(
            '<span style="color: #{};">{} {}</span>',
            self.color_code,
            self.first_name,
            self.last_name,
        )

class PersonAdmin(admin.ModelAdmin):
    list_display = ('first_name', 'last_name', 'colored_name')

know more

Answer 9

更好的选择是覆盖 HTML

在您的模板中创建一个文件夹 admin，然后您可以在那里创建 base.html

{% extends 'admin/base.html' %}

{% block extrahead %}{{ block.super }}
<style>
:root {
  --primary: #9774d5;
  --secondary: #785cab;
  --link-fg: #7c449b;
  --link-selected-fg: #8f5bb2;
}
</style>
{% endblock %}

know more

覆盖django中的admin css

9 个答案: