#前言
1. Django容易架網站，mezzanine是基於Django內容管理，能很方便的架起美觀的網站，但是mezzanine免費的主題能找到的就只有4種。
2. mobirise，一個能搭建多變化主題網頁的應用軟體，但它產出的是靜態的網站。
(影片)
3. 結合 1 和 2 ，做一些調整，就可以在mezzanine上搭建多變化的主題了。而且享有Django的資料庫和動態功能。
(就是這裡的目標)
#準備mezzanine
- 借助mezzanine免費的主題已經建好的網頁架構，四選一，都可以，因為我們要顯示的是mobirise網頁，這裡使用solid。
參考 這裡 中間第1.項，在本機安裝好mezzanine solid主題(p.s.範例是flat主題，自行修改)。完成如下。
有一個步驟要填帳號密碼，請記下來。
p.s一般都使用127.0.0.1:8000，但是我的系統衝突，所以改8080，請照你自己的。
也就是從此不使用solid主題了。
啟動127.0.0.1:8080/admin進入管理頁面，要帳號密碼喔！
- 新增頁面home，123那邊隨便填幾個字，否則就會出現上方紅色的錯誤，
meta data有2處要填。
(Title填上home，這裡才是真正使用上的名稱。上一步驟的Title只是顯示用。)
- 再建立page1和page2
這個時候進入127.0.0.1:8080，畫面多了3個標籤。
- 在url.py中，
最上面加入這一行
但是如果有from __future__ import unicode_literals，則必須在它的下面。
from mezzanine.pages import views
把下面這一行註解掉，這是solid主題使用的首頁路徑。
###url("^$", direct_to_template, {"template": "index.html"}, name="home"),
把下面這一行取消註解，這是使用者自訂的首頁路徑。 就是meta data中的/。
(要用views.page轉向我們的首頁-->flat\templates\pages\index.html，slug是views.page的參數，告訴它要處理的路徑)
url("^$", views.page, {"slug": "/"}, name="home"),
再加這2行，這是使用者自訂的其他頁面。
url("^page1$", views.page, {"slug": "/page1"}, name="page1"),
url("^page2$", views.page, {"slug": "/page2"}, name="page2"),
url("^page2$", views.page, {"slug": "/page2"}, name="page2"),
註：mezznine會優先使用外部的同名html檔，如果沒有，才使用自己的。
這個時候，再進入127.0.0.1:8080，不一樣了，
因為它已經轉向，
因為它已經轉向，
本來是使用C:\...\myproject\solid\templates\index.html
現在改用C:\...\myproject\solid\templates\pages\index.html了
現在改用C:\...\myproject\solid\templates\pages\index.html了
也就是solid主題不見了，變成我們自己的網頁。接下來，就是要把mobirise建立的網頁，插進來。
#準備mobirise
- 用mobirise建立自己的網頁
(除非只是練習，否則網頁的完成度應盡可能高，免得日後修改，就要再重覆繁瑣的調整步驟)
請看影片建立頁面index.html，page1.html，page2.html。
完成以後，你的目錄如下，3個html檔，一個資料夾存放靜態檔案。
(這裡的3個檔名，要和mezzanine中的頁面名稱互相配合)
#調整過程
- 將3個html檔案copy到 C:\...\myproject\solid\templates\pages 目錄之下(其中index.html直接覆蓋)
- 將 assets目錄copy到 C:\...\myproject\solid\static 目錄之下
啟動127.0.0.1:8080看到結果了，只是不美觀。甚至page1，page2還不能連結。
- 因為mezzanine和mobirise網址處理方式不同，所以修改html內的超連結。
連結到index.html要改成/，
連結到page1.html要改成page1
連結到page2.html要改成page2，
以符合mezzanine url pattern的方式。
再整理一下127.0.0.1:8080的網頁，檢查一下，連結就有作用了。
- 靜態(static)檔案路徑修改
- 3個html檔案的開頭，都要加上
{% load static %}
- 只要用到assets路徑，都要改。如下例
原來是 assets/web/assets/mobirise-icons/mobirise-icons.css
改成 {% static "assets/web/assets/mobirise-icons/mobirise-icons.css" %}
利用notepad++全部取代的功能和搜尋的功能做檢查
--用 {% static "assets 取代 assets，事後要檢查，如上例，第二個assets不該取代的
--用 .jpg" ％} 取代 .jpg ，這個不必檢查，因為.jpg不可能在路徑的中間。
--同樣的方法 取代 .png .js .css，大概就差不多涵蓋所有的靜態檔案了，
再整理一下127.0.0.1:8080的網頁，就看到結果了。這是影片中建立的內容。
#結果
這是先前做的成果，放在網路上，
(有加入後台的控制，請參考 這裡 ，主要是多了一個page_processors.py，來處理view的程式。)
https://web20toheroku.herokuapp.com/ 連線要30秒，請等待。
沒有留言:
張貼留言