web-dev-qa-db-ja.com

djangoでadmin cssをオーバーライドする

Adminの特定のCSSを変更したいDjango base.cssのように。Djangoライブラリで直接変更した方がよいですか？最良の方法？

djangodjango-admin
62
rajan sthapit

やりたいことがたくさんあります。まず第一に：Django adminで直接上書きしないでください。合理的だと思う2つのオプションがあります。

  1. 一般に管理者の外観を変更する場合は、管理者テンプレートをオーバーライドする必要があります。詳細については、ここで説明します： 管理テンプレートのオーバーライド 。例として、元の管理ファイルを拡張し、{% block extrastyle %}{% endblock %}のDjango/contrib/admin/templates/admin/base.htmlのようなブロックを上書きすることができます。
  2. スタイルがモデル固有の場合、admin.pyのMediaメタクラスを介して追加のスタイルを追加できます。こちらの例をご覧ください。
class MyModelAdmin(admin.ModelAdmin):
    class Media:
        js = ('js/admin/my_own_admin.js',)    
        css = {
             'all': ('css/admin/my_own_admin.css',)
        }
92
Torsten Engelbrecht

最後にadmin/base.htmlを拡張して、自分のcssファイルへの参照を追加しました。 cssの素晴らしい点は、既存の定義に触れる必要がなく、再定義するだけです。

25
Danny W. Adair

このソリューションは管理サイトで機能します。Djangoをアップグレードしても変更されないbase_site.htmlを上書きするため、最もクリーンな方法だと思います。

テンプレートディレクトリにadminというフォルダーを作成し、その中にbase_site.htmlという名前のファイルを作成します。

cssの下の静的ディレクトリにadmin-extra.cssというファイルを作成します。

body{background: #000;}のように、フォームに必要なすべてのカスタムcssを記述します。

これを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 %}

それでおしまい！終わった

19
elad silver
  • 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 %}
17
tivnet

静的ディレクトリで、static/admin/css/base.cssファイル。

Djangoのデフォルトの管理CSS を最初に貼り付けてから、下部にカスタマイズを追加します。

14
Ryan Allen

グローバルスコープが必要で、テンプレートのオーバーライドを考えたくない場合は、このためにmixinが非常にうまく機能します。このコードを好きな場所に置いてください：

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

次に、オーバーライドを使用してadmin.cssというCSSファイルを作成します。次に例を示します。

select[multiple] {
    resize: vertical;
}

次に、必要なモデルで次の操作を行います。

class MyModelAdmin(admin.ModelAdmin, CSSAdminMixin):

そして、あなたはすべて設定されます。

6
mlissner

おそらくグラペッリはあなたを悩ますことを救うでしょう...
http://grappelliproject.com/

古くて古い...
https://lincolnloop.com/blog/customizing-Django-admin-eurodjangocon-2009/

4
John Mee

持ってる admin/css/changelists.cssフォルダー内のSTATICFILES_DIRS、およびデフォルトの管理者の代わりにchangelists.cssを使用します。

4
timkofu