• 欢迎访问金笔头博客,这是一个菜鸟(伪)程序员的自留地,欢迎访问我的github:点击进入

Django2.0笔记(5)-开发个人博客系统(三)

python eason 2351次浏览 5个评论 扫描二维码

开发环境

  • PyCharm 2017.3.2 (Professional Edition)
  • Python 3.6.3
  • windows 10
  • Sqlite3

本文目标

接上文Django2.0笔记(4)-开发个人博客系统(二),本文继续对博客系统进行优化,主要包括:

  1. 后台admin页面美化
  2. 富文本输入框配置优化

无图无真相,先上效果图: Django2.0笔记(5)-开发个人博客系统(三)

Django2.0笔记(5)-开发个人博客系统(三)

Django2.0笔记(5)-开发个人博客系统(三)

Django2.0笔记(5)-开发个人博客系统(三)

开发过程

后台美化

1.后台美化我们使用django-jet这个库来实现,首先安装django-jet

pip install django-jet

2.修改settings.py,注册应用'jet.dashboardjet,注意加在django.contrib.admin前面,为实现后台主题切换,还得添加JET_THEMES参数

INSTALLED_APPS = [
    'jet.dashboard',
    'jet',
    'django.contrib.admin',
    'django.contrib.auth',
    'django.contrib.contenttypes',
    'django.contrib.sessions',
    'django.contrib.messages',
    'django.contrib.staticfiles',
    'apps.blog',
    'django_summernote',
]

# 主题
JET_THEMES = [
    {
        'theme': 'default', # theme folder name
        'color': '#47bac1', # color of the theme's button in user menu
        'title': 'Default' # theme title
    },
    {
        'theme': 'green',
        'color': '#44b78b',
        'title': 'Green'
    },
    {
        'theme': 'light-green',
        'color': '#2faa60',
        'title': 'Light Green'
    },
    {
        'theme': 'light-violet',
        'color': '#a464c4',
        'title': 'Light Violet'
    },
    {
        'theme': 'light-blue',
        'color': '#5EADDE',
        'title': 'Light Blue'
    },
    {
        'theme': 'light-gray',
        'color': '#222',
        'title': 'Light Gray'
    }
]

3.修改urls.py添加路由

from django.contrib import admin
from django.urls import path
from apps.blog import views
from django.conf.urls import include
from django.conf import settings
from django.conf.urls.static import static

urlpatterns = [
    path('admin/', admin.site.urls),
    path('', views.home, name='home'),
    path('home/', views.home, name='home'),
    path('articles/<int:id>/', views.detail, name='detail'),
    path('summernote/', include('django_summernote.urls')),
    path('jet/', include('jet.urls', 'jet')),  # Django JET URLS
    path('jet/dashboard/', include('jet.dashboard.urls', 'jet-dashboard')),  # Django JET dashboard URLS
]

if settings.DEBUG:
    urlpatterns += static(settings.MEDIA_URL, document_root=settings.MEDIA_ROOT)

4.创建django-jet所需数据库表

python manage.py migrate jet
python manage.py migrate dashboard

富文本输入框配置优化

1.修改settings.py添加如下代码:

# 富文本编辑器设置
SUMMERNOTE_CONFIG = {
    # Using SummernoteWidget - iframe mode
    'iframe': True,  # or set False to use SummernoteInplaceWidget - no iframe mode

    # Using Summernote Air-mode
    'airMode': False,

    # Use native HTML tags (`<b>`, `<i>`, ...) instead of style attributes
    'styleWithSpan': False,

    # Change editor size
    'width': '80%',
    'height': '480',

    # Use proper language setting automatically (default)
    'lang': 'zh-CN',


}

测试

以上步骤完成以后重启开发服务器,登录后台查看即可。

全部代码已分享至Github:https://github.com/leeyis/jbt_blog 有账户的不妨star一下啦~


金笔头博客, 版权所有丨如未注明 , 均为原创, 转载请注明Django2.0笔记(5)-开发个人博客系统(三)
喜欢 (3)
发表我的评论
取消评论

表情 贴图 加粗 删除线 居中 斜体 签到

Hi,您需要填写昵称和邮箱!

  • 昵称 (必填)
  • 邮箱 (必填)
  • 网址
(5)个小伙伴在吐槽
  1. TypeError at /admin/blog/article/5/change/__init__() missing 1 required positional argument: 'sortable_by' 是什么原因
    wang2018-09-28 22:25 Reply Windows 10 | Chrome 69.0.3497.92
  2. TypeError at /admin/blog/category/1/change/__init__() missing 1 required positional argument: 'sortable_by'请问这个是什么原因呢
    djhhhhh2018-09-09 11:26 Reply Windows 7 | Chrome 68.0.3440.106
    • jet的bug 去它的github找issue 这里发不了链接
      xzp21st2018-10-17 19:50 Reply Windows 7 | Chrome 63.0.3239.26
  3. 为什么我使用了jet后CSS样式丢失?困扰啊
    奔跑的蜗牛2018-08-10 12:09 Reply Windows 7 | Chrome 55.0.2883.87
  4. 在创建django-jet所需数据库表的时候,控制台报一下错误,"must be of the form 'app_label.ModelName'." % modelValueError: Invalid model reference 'apps.blog.Category'. String model references must be of the form 'app_label.ModelName'.
    agui2018-07-07 16:40 Reply Windows 8.1 | Firefox 61.0