如何使用Mezzanine

Mezzanine是著名的开源、基于Django的CMS系统 (content management system)。其实任何一个网站都可以看作是一个特定的内容管理系统，只不过每个网站发布和管理的具体内容不一样。携程发布的是航班、酒店和用户的订单信息，淘宝发布的商品和用户的订单信息。所以大量的网站都说基于Mezzanine来构造的。

Mezzanine能做什么？简单一点的，像这样建立一个自己的Blog：http://aigarius.com/。复杂一点的例子很多。

参考：

https://rodmtech.net/docs/mezzanine/a-mezzanine-tutorial-take-2/
http://bitofpixels.com/blog/mezzatheming-creating-mezzanine-themes-part-1-basehtml/

1 安装Mezzanine

a 安装虚拟环境virtual Env

推荐使用虚拟环境，原因之一是：构造一个站点需要大量的Python包，虽然Python的各种包管理还不错，但是量太多以后还是容易有冲突。原因之二是：分析数据的环境和开发网站的环境可能就有很多不太一样的设置。所以最好把不同的开发环境分开。Mezzanine是基于Django的Python开发的，最好把这个Web开发环境独立出来。

sudo apt-get install python-virtualenv   # 安装虚拟环境。以便和Theano等Python数据分析环境分开
virtualenv webenv      # 在当前目录下创建webenv目录，该目录中就是一个新的虚拟环境
source webenv/bin/activate    # 启用这个虚拟环境。（你会发现command prompt也变了）

如果需要退出虚拟环境，执行deactivate就可以。
有人建议用pip install来安装python-virtualenv虚拟环境，据说pip对包的维护比apt-get要好一点。

b 安装Mezzanine

在虚拟环境下：

pip install mezzanine
pip install south   # 用于数据库升级
cd webenv  # 进入刚才建立的虚拟环境目录中.
mezzanine-project mezzsite # 建立一个新项目
cd mezzsite
pwd > ../.project  # 为了以后站点发布时,fabric需要用这个文件

站点的目录mezzsite在虚拟环境目录webenv下面。有人推荐这样做，据说是因为站点发布的时候，fabric默认是这样的目录结构。

mezzsite中的文件目录：

c 初始化站点

在虚拟环境下：

python manage.py createdb
python manage.py runserver  # 监听端口127.0.0.1:8000
or
python manage.py runserver  0.0.0.0:5800 # 监听端口5800端口，可以外网访问

默认是用sqllite数据库，会创建dev.db。如果想删除数据库，就直接删除dev.db文件即可。
如果使用mysql数据库，请修改./mezzsite/local_setting.py。

2 自定义页面

1 默认的站点

登录到Admin的界面，管理的内容主要有如下3个部分。

- Pages：页面。各个页面之间可以有隶属关系。这个隶属关系可以通过站点左边的菜单树结构和站点顶上的菜单树结构来体现。页面可以是静态的内容，也可以是Form。
随便添加几个页面后的结果：

- Blog Posts: 类似写Blog。
- Comments: 类似Blog的Comments。
- Media Library：里面可以包含目录，图片。这些图片可以用于Pages。
- Site：管理站点的一些设置。
- Users: 管理站点的User。

你一定对界面有自己的想法，想要自己定义页面。

2 加入Markdown的支持

Markdown是非常简洁高效的文本编辑格式。写Blog时支持Markdown会有事半功倍的效果。pagedown网站有详细的说明。

a. install

pip install mezzanine-pagedown Pygments

b. edit `settings.py`

在INSTALLED_APPS list中加入mezzanine-pagedown.

INSTALLED_APPS = ("mezzanine_pagedown",  # 这里"django.contrib.admin","django.contrib.auth",

并且在setting.py中加入mezzanine-pagedown的配置信息：

#####################
# PAGEDOWN SETTINGS #
#####################
RICHTEXT_WIDGET_CLASS = 'mezzanine_pagedown.widgets.PageDownWidget'
RICHTEXT_FILTERS = ['mezzanine_pagedown.filters.codehilite',]
PAGEDOWN_MARKDOWN_EXTENSIONS = ('extra','codehilite','toc')
RICHTEXT_FILTER_LEVEL = 3  # 防止站点把>当作错误。
PAGEDOWN_SERVER_SIDE_PREVIEW = False # markdown应该是Client来Render的。

c. edit `urls.py`

编辑urls.py文件，加入mezzanine_pagedown的url。

import mezzanine_pagedown.urls

在mezzanine “catch all” ，即默认url规则("^", include("mezzanine.urls")),之前加入：

    ("^pagedown/", include(mezzanine_pagedown.urls)),

d. Test

重启服务器，然后在Blog编辑，输入一些markdown的文本，就可以看到Markdown的支持了。

（问题：为什么没有Preview？rich text page 没有Preview，而且metadata也加载不了。但是Gallery和Form都有Preview，metadata也正常。）

3 加入语法高亮和背景定制

自定义网站界面风格的标准做法是创建一个新的application。因为application的template是先加载的，所以自定义的界面风格可以体现到网站。

a. 建立一个新的application

python manage.py startapp theme

application的名字就叫theme，因为就是定义风格所用的。但是会按照django的风格产生一个文件夹，并包括application的各种文件。

(webenv)$ tree theme
theme
├── admin.py
├── __init__.py
├── migrations
│ └── __init__.py
├── models.py
├── tests.py
└── views.py

都是标准Django application的文件模板，都基本是空的。

b. 产生新的css

安装了pygments之后，manage.py中多了一个命令：

python manage.py pygments_styles    # 在命令行输出一个css文件内容。

意外得到一个：warn(“You haven’t defined the ALLOWED_HOSTS settings… )。修改setting.py，ALLOWED_HOSTS = ('localhost', '.local')就可以。

mkdir -p theme/static/css
touch theme/__init__.py
python manage.py pygments_styles colorful >theme/static/css/codehilite.css

c. 继续修改setting.py

将新建的theme应用添加进去：

INSTALLED_APPS = ("theme","mezzanine_pagedown","django.contrib.admin",

d. 修改模板文件

Django is finding those templates via settings.TEMPLATE_DIRS. 一般我们很难搞清楚到底是如何收集template文件的。Mezzanine提供了一个命令来收集所有的template文件，非常有帮助：

python manage.py collecttemplates  # 将所有template文件收集到templates目录下 (不用执行这个)
python manage.py collecttemplates -t base.html #其实我们并不需要所有的文件，其实只需一个base.html就可以了。
mv templates/  theme/  #移动到新建项目的目录中去。

e. 修改模板文件，加入自定义的css

In templates/base.html, find the stylesheet link tags, which should be just under a {% compress css %} line. Add the custom.css file below the bootstrap and mezzanine entries. The font callout must be above/outside the compress tag; what’s inside the “compress css” will get concatanted into a single download file for production, i.e., with DEBUG turned off. A link with an href will not work inside that compress block. “compress css”会将所有的css压缩传输，比较省带宽。

{% compress css %}
<link rel="stylesheet" href="{% static "css/bootstrap.css" %}">
<link rel="stylesheet" href="{% static "css/mezzanine.css" %}">
<link rel="stylesheet" href="{% static "css/bootstrap-responsive.css" %}">
<link rel="stylesheet" href="{% static "css/codehilite.css" %}">
<link rel="stylesheet" href="{% static "css/custom.css" %}">

在theme/static/css目录中增加一个custom.css文件：

body {background-color: #f3f3f3;font-family : 'Ubuntu', sans-serif;
}

f. restart the server

对于markdown的代码可以语法高亮了。
另外整个site的背景变成#f3f3f3色，这是safe silver色。

4 继续修改一下界面风格

a. 去掉Search的选项

修改setting.py，加入如下的配置:

SEARCH_MODEL_CHOICES = []

b. 去掉左边和下面的菜单

修改setting.py，找到如下的配置，注释一下:

PAGE_MENU_TEMPLATES = ((1, _("Top navigation bar"), "pages/menus/dropdown.html"),
)

还需修改base.html文件，把相应的菜单的语句去掉。删除如下：

{% page_menu "pages/menus/tree.html" %}
and
{% page_menu "pages/menus/footer.html" %}

what is this? 这个不明白，好像是左边菜单上面的内容。

{% block breadcrumb_menu %}{% page_menu "pages/menus/breadcrumb.html" %}

c. 左边变窄一点和中间正文部分变宽一点。

<div class="col-md-1 left">{% block left_panel %}<div class="panel panel-default tree"></div>{% endblock %}
</div><div class="col-md-8 middle">{% block main %}{% endblock %}
</div>

注意这里将class=”col-md-2 left”改成了class=”col-md-1 left”，即可把左边的分区变窄一点。

5 修改Homepage

Mezzanine认为Homepage是需要精心加工的，所有Mezzanine系统不想管这个事情。你们自己设计吧。“In our experience, the homepage of a beautiful, content driven website, is quite different from other pages of the
site, that all fall under sets of repeatable page types. The homepage also differs greatly from site to site. Given this,
Mezzanine doesn’t presume how your homepage will be structured and managed. It’s up to you to implement how it
works per site.”

Mezzanine提供了默认的Homepage，如果你不喜欢，在url.py中comment这一行代码：

#url("^$", direct_to_template, {"template": "index.html"}, name="home"),

如果站点主要是Blog，那么把Blog的列表主页作为Homepage是常见的做法。只需在url.py中un-comment这一行就可以：

url("^$", "mezzanine.blog.views.blog_post_list", name="home"),

这一行代码前面有一些说明，需要干点其他事情，不做好像也没有关系。

如果想把站点中的一个page来作为主页，只需在url.py中un-comment这一行就可以：

url("^$", "mezzanine.pages.views.page", {"slug": "/"}, name="home"),

This change hands the home page over to the mezzanine.pages package views.py file, to the page function. The key point is the home page will now come from the CMS, i.e., the Pages table in the database, specifically, the record with a / as its slug value. Homepage就是CMS中的一个page而已。

改好urls.py还不行，因为 / 所指向的Page还不存在. Go to admin, add a page and give it a / url (in the Meta section)。

但是由于markdown widget的问题，rich text page中的metadata无法修改。所以只能添加一个Gallery Page，将其url改成 / 。再查看homepage，发现能显示Page的title，内容却无法显示。

这是因为Template的问题。Mezzanine’s CMS template rules will use templates/pages/index.html for the / page from the Pages table. 运行 python manage.py collecttemplates命令得到所有的template文件，找到templates/pages/index.html，该文件有这么一行：

{% extends "pages/richtextpage.html" %}

我们新建的Homepage是Gallery，但是template还是rich text的，所以没有正确加载。把这一行改为：

{% extends "pages/gallery.html" %}

Test, OK

3 扩展Mezzanine