Django+boostrap 美化admin后台的操作
作者:Mr_blueD 发布时间:2022-02-26 16:16:21
工具:Pycharm,Django1.11.9.
1.下载django_admin_bootstrapped
pip install django-admin-bootstrapped
2.打开django项目目录下的settings.py文件,如图添加内容,必须放在django本身的django.contrib.admin前面。
3.运行项目,通过浏览器打开页面,即可看到美化后的admin后台了。
将后台中的英文修改为中文,可以看到只有右上角的英文 "Recent actions",和中间有一个'Applications'。
现在我们来修改它们。
在django_admin_bootstrapped/templates/admin/base.html 中找到"Recent actions",修改为"最近的动作"。
在同一目录下的index.html中找到"Applications",换成"应用程序"。
重新运行项目,进浏览器就OK了。
补充知识:几步带你实现django中引入bootstrap,后端程序员有福了
bootstrap在flask框架中引入很简单,但是由于django是一个封闭式的框架,所以在运用的时候,
有点小麻烦,不过也就几步的事情,多点耐心
下载bootstrap
下载地址:https://v3.bootcss.com/getting-started/#download,选择第二个,下载带有源码的bootstrap,只能通过这种方式(django是封闭的)
下载的目录结构:
dist文件是bootstrap的核心文件
创建一个简单Demo项目,这是我的项目
注意:在根项目下创建一个static目录,再在static下创建一个bootstrap文件夹,找到并打开setting.py输入如下;(输入到该文件的末尾即可,注意符号)
STATIC_URL = '/static/'
STATICFILES_DIRS = (os.path.join(BASE_DIR, 'static'),)
找到并打开view.py补充输入如下
#视图函数,返回index.html页面
from django.http import HttpResponse
from django.shortcuts import render
def index(request):
return render(request, 'index.html')
找到并打开urls.py补充输入如下
from app import view
from django.conf.urls import url
urlpatterns = [
url(r'^$', view.index),
]
上面我们已经做到把视图函数写好并且加到路由里面,接下来开始放置bootstrap了
打开一开始下载解压后的文件,找到dist文件夹,将里面的的3个文件夹css,fonts,js进行复制
在untitled/static/下新建文件夹bootstrap,将刚才复制的3个文件夹复制到里面,
从一开始下载的bootstrap的解压文件找到docs/examples里面选择一个本次测试的模板,本次我们选择docs/examples/blog/下的index.html,复制粘贴到mydjango/testdj/templates/下,然后改名为base.html,然后用编辑器打开
找到
<link href="../../dist/css/bootstrap.min.css" rel="external nofollow" rel="stylesheet">
改为
<link href="/static/bootstap/css/bootstrap.css" rel="external nofollow" rel="stylesheet">
找到
<link href="blog.css" rel="external nofollow" rel="stylesheet">
改为
<link href="/static/bootstrap/css/blog.css" rel="external nofollow" rel="stylesheet">
找到
<script src="../../dist/js/bootstrap.min.js"></script>
改为
<script src="/static/bootstrap/js/bootstrap.js"></script>
我们更改成了自己的路径,可以更好的适应我们的项目结构
找到我们那会下载的/docs/examples/blog/下的blog.css复制粘贴一份到mydjango/testdj/testdj/static/bootstrap/css/里面
然后我们写一个自己的index.html(注意别搞混了)
里面只需要写
{% extends ‘base.html'%}(这是对页面的继承)
ok,运行django, 在django中输入url就可以看到一个博客模板了
下面是我的目录结构
总结: 下载下来的bootstrap包含了很多网页模板,比如导航条, 博客模板等等 以后想使用其他的模板只需要下面几步:
粘贴模板到自己项目的templates下, 到D:\bootstrap\bootstrap-3.3.7\docs\examples\ 下面的模板粘贴到 项目的templates下建立一个base模板
创建static,到setttings中设置检索路径,在这之前还需要把 D:\bootstrap\bootstrap-3.3.7\dist下的的三个文件夹(css, js, fonts)粘贴到static下的bootstrap()自己新建的)下面,
把bootstrap模板中的css文件复制到 static\bootstrap\css 文件中
在templates\base.html中 对css和js 外联路径进行更改,其实就是把原先从网上连接改为本地文件的连接
ok
来源:https://blog.csdn.net/Mr_blueD/article/details/79826970


猜你喜欢
- 初学Python,这个问题搞了我好久,现在来分享下我的解决思路,希望可以帮到大家。先说下python引入模块的顺序:首先现在当前文件夹下查找
- asp获取application对象代码如下: <%application("new&qu
- 本文实例讲述了PHP实现上传文件并存进数据库的方法。分享给大家供大家参考。具体如下:show_add.php文件如下:<?php &n
- 效果基于Python3。在自己写小工具的时候因为这个功能纠结了一会儿,这里写个小例子,供有需要的参考。小例子,就是点击按钮打开路径选择窗口,
- flask之模板继承为什么要用模板继承?原因很简单,因为模板继承能让我们在实现效果的前提下少些很多代码!咱废话不多说,先来看个小例子,看完我
- 需求描述:在公司老旧系统里,数据库表很多,但是在设计之初并没有建立好关系图,导致新人刚入职,面对N个库,每个库几百张表,很不方便。例如:公司
- 一、效果快放10倍总共分为三部分,左上角的正文,下方的心形和右下角的署名特别需要注意的一点是这种东西不但要装Python,还与分辨率有关(换
- 实现代码一、#!/usr/bin/pythonx,y=9,9 &nbs
- 浏览器经常Cache你的页面,这是一个很麻烦的问题,下面先提出几种方案来解决一般的问题:(把下面的代码加入到asp程序的最开始位置)<
- 在做web端自动化测试用例编写过程中,大家有没有遇到窗口切换的情况,比如如下截图所示的商品列表页,点击任何一款产品后切换到这块产品详情页的情
- SQL Server 2019 Enterprise (x64) - DVD (Chinese-Simplified)企业版ed2k://|
- 是扫盲文章, 其实我自己就是个被扫对象, 为了学习W3C标准地设计网页, 想到写这个系列的文章当作自己的学习笔记, 不求每篇都写很好, 只求
- Python画图主要用到matplotlib这个库。Matplotlib 是一个 Python 的 2D绘图库,它以各种硬拷贝格式和跨平台的
- 本文实例讲述了PHP实现的获取文件mimes类型工具类。分享给大家供大家参考,具体如下:<?php/* * Copyright 201
- 目的我们的目标是安装一个允许我们托管多个网站的web服务器,其中一些是针对电子商务的安全解决方案,而大部分网站是通过连接一个数据库服务器并且
- 但是我们可以换一种方法解决这个问题。下面就来分析下解决办法。对text或ntext类型的数据在查询中不能进行字符串操作。这时用得最多的是把t
- 最近一直在用python写点监控oracle的程序,一直没有用到异常处理这一块,然后日常监控中一些错误笼统的抛出数据库连接异常,导致后续处理
- 网上关于这方面的文章有很多,重复的东西本文不再赘述,仅提供思路,并解释一些其他文章讲述模糊的地方。 1、使用meta标签,这也是普
- 偶第一次发主题, 这个是在一个项目中的做...写的一般般, 有什么bug之类的是在所难免, 望见谅功能说明:1. 即时控制用户输入2. 将输
- 1.使用explain语句去查看分析结果 如explain select * from test1 where id=1;会出现:id se