【Html】pelican主题的制作之模板

少女dtysky

世界Skill

时刻2014.05.02

路标

Html

pelican

软件

概述

此次论述的是pelican的theme的构成以及如何创建属于自己的theme。
第一部分，模板。

观看此系列文章要求：

掌握基本的Html语法。

了解jinjia2的基本原理。

了解本次创建主题使用的Bootstrap提供的一些样式，可以大大提高效率。

基本原理

首先介绍一下创建pelican主题的基本原理。

1.pelican主题文件的基本结构：
当在本地利用pelican创建完一个Blog后，建议建立一个文件夹来放置自己的theme，比如博主建立的文件夹名为MyTheme，然后，在该文件夹下建立你的主题文件夹，随便起一个自己喜欢的名字即可，博主的专属主题名为Sky。随后便可以在此文件夹下建立自己的主题文件了，其结构如下：

├── static
│　├── css
│　└── images
└── templates
　　├── archives.html / to display archives
　　├── article.html // processed for each article
　　├── author.html // processed for each author
　　├── authors.html // must list all the authors
　　├── categories.html // must list all the categories
　　├── category.html // processed for each category
　　├── index.html // the index. List all the articles
　　├── page.html // processed for each page
　　├── tag.html // processed for each tag
　　└── tags.html // must list all the tags. Can be a tag cloud.

也就是说，在主题目录下会有两个子目录static和templates，其中static存放的是样式、图像等基本静态文件，templates存放的是基于jinjia2的模板文件。
本次教程针对模板部分。

2.基本模板文件的功能：
下面是每一个pelican要求的基本模板文件列表与其功能。

archives.html：所有文章的集合，在这一页上，你可以按照你喜欢的方式列出所有你已有的文章。
article.html：文章显示页面，每一篇博文就是用这个模板生成的。
author.html：用于显示某个作者所有文章的集合。
authors.html：用于列举所有作者的集合。
vcategories.html：用于列举所有分类的集合。
vcategory.html：用于显示某个分类下所有文章的集合。
index.html：这是博客的主页。
page.html：尚未清楚作用。
tag.html：用于显示所有具有某个标签的文章的集合。
tags.html：用于列举所有标签的集合。

3.jinjia2的使用：
jinjia2的使用非常简单，其本质是利用一些Python或自身的语句来做一些重复性的工作，借此达到提高开发效率的目的。
基本上我们需要的逻辑操作都是以这样的形式出现的：

{% yourcode %}

其中"yourcode"是你想要执行的内容。
比如：

{% for tag in tags %}
　　your code
{% end for %}

这一段代码的意思是：对tags集合中的每一个tag执行一次循环打印，打印的内容就是"your code"这个内容。
将其做一下小小的改变就可以实现文章列表等我们需要的功能，比如下面一段就是用来列举所有tag的：

{% for tag in tag_cloud %}
<li class="tag-{{ tag.1 }}">
　　<a href="{{ SITEURL }}/{{ tag.0.url }}">
　　　　<p>{{ tag.0 }}</p>
　　</a>
　</li>
{% endfor %}

当然，不仅仅是for，jinjia2同样支持if、include等语句，用到再说。

jinjia2有一个非常好的特性，就是支持继承，这一点使用得当可以进一步提高开发效率。其本质上是建立一个公用的父模板，将许多重复性的东西（例如页面信息，样式表的载入，资源路径等）都做好，然后在子模板中替换父模板中的一些内容即可。
如果要使用继承，可以在子模板开发加入以下代码：

{% extends "base.html" %

这句代码表示：此模板继承于base.html。

由于博客的特殊性（虽然有很多页面，但每一个不同的页面往往会包含相同的元素），博主建议建立一个base.html作为共用的父模板来简化整体的搭建，事实上一般也是这么做的。
模板继承的精华实际上只有一句代码：

{% block yourname %}default{% endblock %}

这表示一个可以在继承其的子模板内替换的块，这个块是用"yourname"进行标识的，可以替换为任意你想要的名字，"default"是缺省值。
具体使用时只要在子模板中将同样标识的block下"default"的内容替换即可：

{% block yourname %}aaa{% endblock %}

另外，还有一种语句用于打印在python中定义的变量：

{{ yourvar }}

这表示将python中定义的变量"youvar"打印在当前位置。

4.每一个模板内可用变量列表：
pelican制定了一些在某个模板内可用的变量，具体参考这里。
在使用是，只需要用{{}}语句将其在适当的位置打印出来，或者将其作为{%%}语句中的内容即可，可以参加上面列举tag的那个例子。
注：同样的变量名在不同的模板中可能对应不同的父类，比如在tag中的articles变量指的就是在该tag下的所有articles。

5.一些小问题：
在写完模板后编译时出现了一个奇怪的问题：

ascii codec can't decode byte 0xe8 in position 0:ordinal not in range(128)

最终确定此问题是由于编码导致的，但在检查之后确定所有模板文件的编码格式都是UTF-8，而且pelican的源文件又暂时不想动也找不到，所以最终采用了以下方法：
在你的Python安装路径下的"\Lib\site-packages"中建立一个名为sitecustomize.py的文件，用于加载自定义启动内容，在里面输入：

# encoding=utf8
import sys
reload(sys)
sys.setdefaultencoding('utf8')

这样就可以解决前面的问题了。

点击查看评论