《Django By Example》Java-Python-Django社区Django实战

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

2018-03-13  本文已影响248人  leeyis

开发环境

本文目标

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

1. 后台admin页面美化

2. 富文本输入框配置优化

无图无真相,先上效果图:

1 2 3 4

开发过程

后台美化

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一下啦~

上一篇下一篇

猜你喜欢

热点阅读