Django 管理员颜色

Posted 2023-02-24

【中文标题】Django 管理员颜色

【英文标题】：Django admin colours

【发布时间】：2012-03-13 07:37:32

【问题描述】：

默认情况下，Django 管理页面是不同深浅的蓝色。 我在哪里可以访问这些颜色的控制方式？我想把它全部改成绿色而不是蓝色。

想法？

【参考方案1】：

您可以覆盖管理模板。您可能想要admin/base_site.html 模板，并提供一个extrastyle 块，其中包含您要注入模板的任何CSS。您需要知道要覆盖哪些样式（有很多） - 当我这样做时，我只是找到了我想要更改的元素，并添加了样式，直到一切看起来都正确。

因此，假设您在某处有一个模板目录（在 TEMPLATE_DIRS 中设置），请创建一个名为 admin/base_site.html 的文件，它可能是 django/contrib/admin/templates/admin/base_site.html 的副本。

例如，我的base_site.html 模板中有一个部分，如下所示：

% block extrastyle %
<link href=" STATIC_URL css/adminextra.css" rel="stylesheet" type="text/css" media="screen,projection" />
% endblock %

在yourcssfile.css 中，您只需：

a:link, a:visited  color: awesome; text-decoration: underline; 

【讨论】：

您介意举个简单的例子吗？我不确定我是否正在追赶..假设我想覆盖这个位：a：link，a：visited color：#5b80b2;文字装饰：无； 你会怎么做呢？

您创建一个自定义 css 文件，如 Dominic 所述，然后将上述 css 类放入该文件中，您可以根据自己的喜好进行修改。但是您的第二个问题实际上是 CSS，与 Django 无关。

@JohnnyCash - 查看我的编辑 - 如果您有任何问题，请告诉我 :)

【参考方案2】：

也看到这个：Overriding admin css in django

http://lincolnloop.com/static/slides/2010-djangocon/customizing-the-admin.html#slide37

【参考方案3】：

@Dominic Rodger 已被接受。但在此我使用内联 CSS 并覆盖 Django 基础 CSS。

Django 基础 CSS

根据您的需要使用 Django 官方基础 CSS 自定义您的 AdminSite。

您可以覆盖Django Official Base CSS

body 
    margin: 0;
    padding: 0;
    font-size: 14px; # change default color
    font-family: "Roboto","Lucida Grande","DejaVu Sans","Bitstream Vera Sans",Verdana,Arial,sans-serif;
    color: #333;
    background: #fff; # Change color

---

扩展 base_site 模板以向 AdminSite 添加额外的样式。

创建目录和 base_site.html。

your_project_root_directory/templates/admin/base_site.html

base_site.html

将这些复制到您的 base_site.html 中。在样式标签中，您可以为您的 AdminSite 设置样式

% extends "admin/base.html" %

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

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

% block extrastyle % # Here you can add your CSS

<style>

.module h2, .module caption, .inline-group h2,#header
   
    margin: 0;
    padding: 2px 5px 3px 5px;
    font-size: 11px;
    text-align: left;
    font-weight: bold;
    background: #7CA0C7 url(../img/default-bg.gif) top left repeat-x;
    color: #fff;


</style>

% endblock %



% block nav-global %% endblock %

【参考方案4】：

更新：从 Django 3.2 开始，Django Admin 现在支持主题！

您可以找到有关此here 的信息。可以在here 找到所有受支持变量的列表。