Django SimpleUI打造美丽后台

Django SimpleUI打造美丽后台

Django后台美化插件中，SimpleUI处于第一阵营，非常符合国人的审美观。本文将手把手教你如何配置使用Simple UI, 包括自定义菜单和控制面板等高级使用技巧.

 

安装

 

第一步 pip安装并加入INSTALLED_APPS

pip install django-simpleui

 

  修改settings.py, 将simpleui加入到INSTALLED_APPS里去，放在第一行，也就是django自带admin的前面。

 

INSTALLED_APPS = [
       'simpleui', # 注意这里
       'django.contrib.admin',
       'django.contrib.auth',
       'django.contrib.contenttypes',
       'django.contrib.sessions',
       'django.contrib.messages',
       'django.contrib.staticfiles',
       ...     
 ]

第二步 测试是否安装成功

使用python manage.py runserver命令启动本地测试服务器, 访问/admin/, 如果你能看到如下页面说明安装成功。

 

 

注意：如果你在生成环境中使用SimpleUI，还需要使用python manage.py collectstatic命令收集静态文件，否则样式无法正常显示。

常用配置

 

当你看到以上界面时，首先你想改动的一定是语言，去掉SimpleUI的默认logo，并把Django administration改成比如某某管理后台的名字。

修改settings.py， 添加如下代码：

 

# 更改默认语言为中文
 LANGUAGE_CODE = 'zh-hans'
 
 # 去掉默认Logo换成自定义Logo链接
 SIMPLEUI_LOGO = 'https://th.bing.com/th/id/R2411a2b340731d67dfa0d84503e915e3?rik=zmYce%2fLys72JVQ&pid=ImgRaw'

修改管理后台的名称和标题要稍微复杂些，因为你不能直接在settings.py里进行配置。在任何一个app的目录下新建一个admin.py, 添加如下代码即可修改(本例app名为tasks)。这个设置属于Django的设置，不属于SimpleUI的设置。

修改管理后台的名称和标题

# tasks/admin.py
 from django.contrib import admin
 
 admin.site.site_header = '大江狗管理后台'  # 设置header
 admin.site.site_title = '大江狗管理后台'   # 设置title
 admin.site.index_title = '大江狗管理后台'
 
 from .models import Task
 admin.site.register(Task)

 

语言、logo和管理后台名字都已经改过来了。但是你会发现两个问题，左侧菜单的tasks显示的依然是英文，我们需要将其设置成中文。另外，右侧有simpleui的广告链接，页面背后有js文件跟踪simpleui的使用，这些都需要关闭。

自定义或第三方APP名和模型名修改成中文

修改tasks/app.py, 通过verbose_name可以将app名改为中文，这里将tasks 改成了任务管理。

from django.apps import AppConfig
 
 class TasksConfig(AppConfig):
     name = 'tasks'
 
     verbose_name = '任务管理'

接着修改tasks/models.py, 以中文设置模型的verbose_name, 如下所示：

from django.db import models
 
 class Status(models.TextChoices):
     UNSTARTED = 'u', "Not started yet"
     ONGOING = 'o', "Ongoing"
     FINISHED = 'f', "Finished"
 
 
 class Task(models.Model):
     name = models.CharField(verbose_name="Task name", max_length=65, unique=True)
     status = models.CharField(verbose_name="Task status", max_length=1, choices=Status.choices)
     
     class Meta:
         verbose_name = "任务"
         verbose_name_plural = "任务"
 
     def __str__(self):
         return self.name

现在刷新页面，你将看到tasks英文都变成中文了

 

实际Django开发中，还会用到第三方应用app和第三方app提供的模型，我们也可以通过打补丁的方式更改第三方app或模型以及模型字段的verbose_name或者label，将其修改成中文，如下所示：

from third_package.models import ModelA
 
 MyAppModel._meta.verbose_name = ''
 MyAppModel._meta.verbose_name_plural = ''
 MyAppModel._meta.get_field('first_name').verbose_name = '名字'

关闭右侧广告链接和使用分析

修改settings.py, 添加如下两行代码：

# 隐藏右侧SimpleUI广告链接和使用分析
SIMPLEUI_HOME_INFO = False
SIMPLEUI_ANALYSIS = False

 github仓库 项目Demo

https://github.com/aris879559/chat.git
git@github.com:aris879559/chat.git

 

参考链接

参考大佬地址： https://pythondjango.cn/django/applications/4-django-simple-ui-configuration/