Themes 介绍
主题定义了October构建的网站或Web应用程序的外观。主题完全基于文件定义,可以使用任何版本控制软件管理。
主题存储在项目的themes目录的对应子目录中。主要包含以下部分:
名称 Description
Pages 网站的页面
Partials 可以重用的HTML标记块
Layouts 定义页面的结构
Content files 可以是文本,HTML代码和Markdown 代码块,主要用于与Page和Layout进行分开编辑维护。
Asset files 资源文件包含图片、样式表和JS脚本文件。
主题的目录结构
每个主题都有一个独立的目录,只有激活的主题才会显示在网站上。基本结构的例子:
themes/ website/ <=== 主题的目录 pages/ <=== Pages(页面目录) home.htm layouts/ <=== Layouts(布局目录) default.htm partials/ <=== Partials(部件目录) sidebar.htm content/ <=== Content(内容目录) intro.htm assets/ <=== Assets (资源目录) css/ my-styles.css js/ images/
激活主题的方式有后台操作和修改配置文件两种方式,修改config/cms.php文件中的activeTheme的设置值。或者,采取后台设置,操作步骤为:设置——内容管理——前端主题——选择一个主题激活即可。
子目录
October支持单层子目录,有Pages、Partials、Layouts、Content和Assets目录。这样简化了大型网站的目录结构。
themes/ website/ pages/ home.htm blog/ <=== Subdirectory archive.htm category.htm partials/ sidebar.htm blog/ <=== Subdirectory category-list.htm content/ footer-contacts.txt home/ <=== Subdirectory intro.htm ...
要从子目录引用Partial文件或者Content文件,格式为:{% 名称 + 路径 %},比如:
{% partial "blog/category-list" %}
上述表示,引入一个Partial部件,部件的位置及文件为:Partials/blog/category-list.htm。注意,模板路径总是绝对的,在同一个Partial目录中,引用同目录中的另外一个Partial,也必须写完整的子目录名称。
模板结构
对于Page、Partial和Layout他们所对应的模板结构,都是包含了三个部分:Configuration,PHP Code,Twig markup。各个部分之间通过 " == " 进行分割开来。
url = "/blog" layout = "default" == function onStart() { $this['posts'] = ...; } == <h3>Blog archive</h3> {% for post in posts %} <h4>{{ post.title }}</h4> {{ post.content }} {% endfor %}
COnfiguration Section 【配置部分】
配置部分用于设置模板参数,具体参数与不同的模板相关,因类型而不同。配置部分使用简化的" ini "格式,字符串参数值必须包含在双引号中。
url = "/blog" layout = "default" [component] parameter = "value"
PHP Code (PHP代码部分)
在模板每次渲染之前,PHP代码部分都是先执行。PHP代码是可选的部分,可以省略。PHP代码可以使用代码开始和结束标记"<? ?>",这个标记仅仅是用于语法高亮。而且标记和==不在同一行。
url = "/blog" layout = "default" == <? function onStart() { $this['posts'] = ...; } ?> == <h3>Blog archive</h3> {% for post in posts %} <h4>{{ post.title }}</h4> {{ post.content }} {% endfor %}
在PHP部分,只能定义函数,允许使用use引入名称空间。但是除了这些不允许其他PHP代码。
url = "/blog" layout = "default" == <? use Acme\Blog\Classes\Post; function onStart() { $this['posts'] = Post::get(); } ?> ==
访问变量可以使用$this,通过数据方式可以设置或者读取变量,使用对象方式则只能读取变量的值。
// Write via array $this['foo'] = 'bar'; // Read via array echo $this['foo']; // Read-only via object echo $this->foo;
Twig Markup Section(Twig标记部分)
Twig是一个灵活,快速,安全的PHP模板语言。 Twig标记部分定义要由模板呈现的内容。在这个部分可以使用October提供的函数、标记或者过滤器。其内容取决于模板类型(page、layout、partial)。
主题日志记录
主题日志记录是一个非常有用的功能,默认情况下是禁用的。由于布局和页面的内容存储在文件中,可能会发生丢失内容的情况,主题日志记录可以将这些修改产生的变化都记录下来。
启用主题日志记录,可以进入设置——日志——日志设置——启用主题更改。设置完成后,保存设置,刷新页面则可以看见在日志——主题日志,点击可以查看。