為 Django 專案串接 Django CMS

部落格

為 Django 專案串接 Django CMS

何謂 CMS

在為客戶架設網站上線後，很容易遇到一個情況：客戶可能因為各種理由而需要調整網站的內容，但客戶本身不具備修改 html 的能力，在這個情況下，難道每次都要聯絡工程師，讓工程師來修改網站內容嗎？

答案顯然是否定的，這麼做太麻煩，而且修改完的結果未必完全符合客戶的想法（客戶也許會想要在一些地方插入 icon、可能會看到實際呈現出來的效果之後想要調整排版......）。

解決這個問題的方法，就是我們今天的主角：CMS（Content Management System）。

CMS 的概念可以簡單說明如下：

在網站開發階段，將網站中可能有較高頻率需要修改的區域挖空，並將相對應的資訊存在資料庫中。

當使用者要取得網站資訊時，伺服器在 render 網頁的 html 時，讀到被挖空的區域，會去資料庫找出相對應的資訊，並把它填進去被挖空的區域。

接下來，透過設定管理頁面與管理者帳號，讓使用者可以登入管理者帳號、在管理頁面修改存在資料庫裡面的資訊。

透過這樣的設計，就可以做到將「可能會被修改的資訊」與「html 程式碼」分開，讓使用者可以自行修改網站資訊，而不需要透過工程師，來解決剛剛提到的問題！

如何在 Django 專案套用 CMS

Django 提供了一套方便使用的 CMS，只需要透過簡單幾個步驟，將它安裝在你的 Django 專案當中就可以使用。

首先在你的 Django 專案環境中，安裝 Django CMS：

pip install django-cms
pip install djangocms-text-ckeditor
pip install djangocms-link djangocms-file djangocms-picture djangocms-video djangocms-googlemap djangocms-snippet djangocms-style djangocms-column

接下來，在 settings.py 中的 INSTALLED_APPS 中加上：

INSTALLED_APPS=[
    ……
    'django.contrib.sites',
    'cms',
    'menus',
    'treebeard', 
    'sekizai',
    'sekizai.context_processors.sekizai',
    'filer',
    'easy_thumbnails',
    'mptt',
    'djangocms_text_ckeditor',
    'djangocms_link',
    'djangocms_file',
    'djangocms_picture',
    'djangocms_video',
    'djangocms_googlemap',
    'djangocms_snippet',
    'djangocms_style',
    'djangocms_column',
]

如果想要讓 admin 變好看的話，可以在 'django.contrib.admin' 之前加上 'djangocms_admin_style'：

INSTALLED_APPS=[
    'djangocms_admin_stye',
    'django.contrib.admin', 
    ......
]

在 settings.py 補上：

SITE_ID = 1
LANGUAGES = [
    ('en', 'English'), # 格式為 ('language code', 'language name')
    ('zh-hant', u'中文'),
    ...... # 專案支援的其他語言
]

在 settings.py 找到 TEMPLATES，修改以下設定：

TEMPLATES = [
    {
        ...
        'OPTIONS': {
            'context_processors':[
                ...
                'sekizai.context_processors.sekizai',
                'cms.context_processors.cms_settings'
            ],
        },
    },
]

在 settings.py 的 MIDDLEWARE，新增：

MIDDLEWARE = [
    ......
    'django.middleware.locale.LocaleMiddleware', 
    'cms.middleware.utils.ApphookReloadMiddleware'
    'cms.middleware.user.CurrentUserMiddleware',
    'cms.middleware.page.CurrentPageMiddleware',
    'cms.middleware.toolbar.ToolbarMiddleware',
    'cms.middleware.language.LanguageCookieMiddleware',
]

在 Django 專案環境中執行：

python manage.py makemigrations
python manage.py migrate

最後，在 urls.py 中新增 Django CMS 的網址：

urlpatterns = [
    ......
    path('cms/', include('cms.urls')), 
]

到此就完成 Django CMS 設置了。

接下來要設置給 CMS 使用的 templates，在 settings.py 中新增：

CMS_TEMPLATES = [
    ('home.html', 'Home page template'),
    # 格式為：(’template file name', 'template name')
    # 可以依照需求設定多個 templates
]

還要指定使用者上傳的圖片要放在哪裡，一樣在 settings.py 中新增：

MEDIA_URL = '/media/'
MEDIA_ROOT = os.path.join(BASE_DIR, 'media')

並在 urls.py 中設置：

from django.conf import settings
from django.conf.urls.static import static

urlpatterns = [
        ...
] + static(settings.MEDIA_URL,  document_root=settings.MEDIA_ROOT)

在 CMS 的 templates 中，需要載入 CMS 需要用到的標籤，所以每個用到 CMS 的頁面，都要在檔案一開頭就加上：

{% load cms_tags sekizai_tags %}
{% load static from staticfiles %}

這樣就完成 CMS 的所有設置了。

參考資料：How to install django CMS by hand

部落格