Django how to change CSS according the app you are in

Using Django The Admin
1

I am pretty new with Django, I am customizing my admin section and I’d like to change the CSS according to the app I am browsing. Is it possible? I noticed that the uploaded CSS is the one in the first static folder found by the system. Is there some trick to do this?

I tried to make a static folder in every app but the selected CSS is always the first.

Thank you all.

2

Static file directories are searched by the order the apps are listed in the INSTALLED_APPS settings. You would need to define separate files and apply them using the admin media facility. See Form Assets (the Media class) | Django documentation | Django

1 Like
3

I am trying in this way… but the app_name is always empty even if I am in the admin site… Always the default CSS is loaded (the blue one).

portale_ict/templates/admin/base_site.html

{% extends "admin/base.html" %}
     {% block title %}{% if subtitle %}
          {{ subtitle }} | {% endif %}{{ title }} | {{ site_title|default:_('Django site admin') }}
     {% endblock %}

     {% block branding %}
          <h1 id="site-name"><a href="{% url 'admin:index' %}">Portale ICT Administration</a></h1>
     {% endblock %}

     {% load i18n static %}

     {% block extrastyle %}
          <h1>{{ app_name }}</h1>
          {% if app_name == 'ict' %}
               <link rel="stylesheet" type="text/css" href="{% static 'admin_color_green.css' %}"/>
          {% elif app_name == 'ins' %}
               <link rel="stylesheet" type="text/css" href="{% static 'admin_color_purple.css' %}"/>
          {% endif %}
     {% endblock %}

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

This is working and it’is loading the green CSS (always) but this is not what I want:

{% extends "admin/base.html" %}
     {% block title %}{% if subtitle %}
          {{ subtitle }} | {% endif %}{{ title }} | {{ site_title|default:_('Django site admin') }}
     {% endblock %}

     {% block branding %}
          <h1 id="site-name"><a href="{% url 'admin:index' %}">Portale ICT Administration</a></h1>
     {% endblock %}

     {% load i18n static %}

     {% block extrastyle %}
          <link rel="stylesheet" type="text/css" href="{% static 'admin_color_green.css' %}"/>
     {% endblock %}

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

I don’t see where anything named app_name is part of the context for that template (or any Django-supplied template for that matter).

I’m not sure I understand exactly what you’re trying to achieve here.

You might want to install Django Debut Toolbar to see what context is available to you for which templates to determine what you want to override.