Ghi đè quản trị viên css trong django

Tôi muốn thay đổi một số css nhất định trong django quản trị như base.css. Thay đổi trực tiếp trong thư viện django có tốt hơn không? Làm cách nào để ghi đè nó theo cách tốt nhất?

Nó phụ thuộc rất nhiều vào những gì bạn muốn làm. Mặc dù trước hết: không ghi đè trực tiếp nó trong quản trị viên Django. Bạn có hai lựa chọn mà tôi nghĩ là hợp lý:

1. Nếu bạn muốn thay đổi giao diện của quản trị viên nói chung, bạn nên ghi đè các mẫu quản trị viên. Điều này được đề cập chi tiết tại đây: Ghi đè các mẫu quản trị . Đôi khi bạn có thể chỉ cần mở rộng tệp quản trị ban đầu và sau đó ghi đè lên một khối như {% block extrastyle %}{% endblock %}trong django/contrib/admin/templates/admin/base.htmlví dụ.
2. Nếu kiểu của bạn là kiểu cụ thể, bạn có thể thêm kiểu bổ sung thông qua Medialớp meta trong của bạn admin.py. Xem ví dụ ở đây:

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

• Trong settings.py, hãy đảm bảo rằng ứng dụng của bạn được liệt kê trước quản trị viên trong INSTALLED_APPS.
• Tạo (your-app)/templates/admin/base_site.htmlvà đặt <style>khối vào{% block extrahead %}

Thí dụ:

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

Tôi vừa mở rộng admin / base.html để bao gồm một tham chiếu đến tệp css của riêng tôi - ở cuối. Cái hay của css là bạn không phải chạm vào các định nghĩa hiện có, chỉ cần xác định lại.

Giải pháp này sẽ hoạt động cho trang web quản trị, tôi nghĩ đó là cách sạch nhất vì nó ghi đè base_site.htmlđiều này không thay đổi khi nâng cấp django.

Tạo trong thư mục mẫu của bạn một thư mục có tên admintrong đó tạo một tệp có tên base_site.html.

Tạo trong thư mục tĩnh của bạn dưới cssmột tệp có tên admin-extra.css.

Viết trong đó tất cả các tùy chỉnh css bạn muốn cho các hình thức của bạn như: body{background: #000;}.

Dán cái này vào 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 %}

Như đã đề cập trong phần nhận xét: hãy đảm bảo rằng ứng dụng của bạn có trước ứng dụng quản trị trong INSTALLED_APPS, nếu không, mẫu của bạn không ghi đè lên django's

Đó là nó! bạn đã hoàn tất

Trong thư mục tĩnh của bạn, hãy tạo một static/admin/css/base.csstệp.

Trước tiên, hãy dán CSS quản trị mặc định của Django , sau đó thêm các tùy chỉnh của bạn ở dưới cùng.

Nếu bạn muốn có phạm vi toàn cầu và bạn không muốn nghĩ đến việc ghi đè các mẫu, thì mixin hoạt động thực sự tốt cho việc này. Đặt mã này bất cứ nơi nào bạn muốn:

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

Sau đó, tạo một tệp CSS được gọi admin.cssbằng ghi đè của bạn, ví dụ:

select[multiple] {
    resize: vertical;
}

Sau đó, trong bất kỳ mô hình nào bạn muốn, hãy làm:

class MyModelAdmin(admin.ModelAdmin, CSSAdminMixin):

Và bạn sẽ sẵn sàng.

Có admin/css/changelists.cssbên trong một thư mục STATICFILES_DIRSvà nó sẽ sử dụng changelists.css thay vì quản trị viên mặc định.