web-dev-qa-db-fra.com

Remplacement du css administrateur dans django

Je veux changer certains css dans admin Django comme base.css. Est-il préférable de changer directement dans la bibliothèque Django? Comment puis-je le remplacer dans le meilleur moyen?

62
rajan sthapit

Cela dépend beaucoup de ce que vous voulez faire. Mais tout d'abord: ne le remplacez pas directement dans l'administration Django. Vous avez deux options, je pense, sont raisonnables:

  1. Si vous souhaitez modifier l'apparence de l'administrateur en général, vous devez remplacer les modèles d'administration. Ceci est couvert en détails ici: remplacement des modèles d'administration . Parfois, vous pouvez simplement étendre le fichier d'administration d'origine, puis écraser un bloc comme {% block extrastyle %}{% endblock %} dans Django/contrib/admin/templates/admin/base.html par exemple.
  2. Si votre style est spécifique au modèle, vous pouvez ajouter des styles supplémentaires via la méta-classe Media dans votre admin.py. Voir un exemple ici:
class MyModelAdmin(admin.ModelAdmin):
    class Media:
        js = ('js/admin/my_own_admin.js',)    
        css = {
             'all': ('css/admin/my_own_admin.css',)
        }
92

J'ai juste étendu admin/base.html pour inclure une référence à mon propre fichier css - à la fin. La beauté de CSS est que vous n'avez pas à toucher aux définitions existantes, il suffit de redéfinir.

25
Danny W. Adair

Cette solution fonctionnera pour le site d'administration, je pense que c'est la façon la plus propre car elle remplace base_site.html qui ne change pas lors de la mise à niveau de Django.

Créez dans votre répertoire de modèles un dossier appelé admin créez un fichier nommé base_site.html.

Créez dans votre répertoire statique sous css un fichier appelé admin-extra.css.

Écrivez-y tous les css personnalisés que vous voulez pour vos formulaires comme: body{background: #000;}.

Collez ceci dans le 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 %}

C'est ça! vous avez terminé

19
elad silver
  • Dans settings.py, assurez-vous que votre application est répertoriée avant l'administrateur dans le INSTALLED_APPS.
  • Créer (your-app)/templates/admin/base_site.html et mettez le <style> bloquer dans le {% block extrahead %}

Exemple:

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

Dans votre répertoire statique, créez un static/admin/css/base.css fichier.

Collez --- CSS Admin par défaut de Django d'abord, puis ajoutez vos personnalisations en bas.

14
Ryan Allen

Si vous voulez une portée globale et que vous ne voulez pas penser à remplacer les modèles, un mixage fonctionne très bien pour cela. Mettez ce code où vous voulez:

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

Ensuite, créez un fichier CSS appelé admin.css avec vos remplacements, par exemple:

select[multiple] {
    resize: vertical;
}

Ensuite, dans tous les modèles que vous souhaitez, faites:

class MyModelAdmin(admin.ModelAdmin, CSSAdminMixin):

Et vous serez prêt.

6
mlissner

Grappelli vous évitera peut-être la peine ...
http://grappelliproject.com/

Vieux et obsolète ...
https://lincolnloop.com/blog/customizing-Django-admin-eurodjangocon-2009/

4
John Mee

Avoir admin/css/changelists.css dans un dossier dans STATICFILES_DIRS, et il utilisera ce fichier changelists.css au lieu de l'administrateur par défaut.

4
timkofu