资讯专栏INFORMATION COLUMN

OctoberCMS-3-主题

Rocko / 3148人阅读

摘要:主题介绍主题定义了构建的网站或应用程序的外观。主题完全基于文件定义,可以使用任何版本控制软件管理。主题存储在项目的目录的对应子目录中。各个部分之间通过进行分割开来。启用主题日志记录,可以进入设置日志日志设置启用主题更改。

主题

介绍

主题定义了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"] = ...;
}
==

Blog archive

{% for post in posts %}

{{ post.title }}

{{ post.content }} {% endfor %}

COnfiguration Section 【配置部分】

配置部分用于设置模板参数,具体参数与不同的模板相关,因类型而不同。配置部分使用简化的" ini "格式,字符串参数值必须包含在双引号中。

url = "/blog"
layout = "default"

[component]
parameter = "value"

PHP Code (PHP代码部分)

在模板每次渲染之前,PHP代码部分都是先执行。PHP代码是可选的部分,可以省略。PHP代码可以使用代码开始和结束标记"",这个标记仅仅是用于语法高亮。而且标记和==不在同一行。

url = "/blog"
layout = "default"
==

==

Blog archive

{% for post in posts %}

{{ post.title }}

{{ post.content }} {% endfor %}

在PHP部分,只能定义函数,允许使用use引入名称空间。但是除了这些不允许其他PHP代码。

url = "/blog"
layout = "default"
==

==

访问变量可以使用$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)。

主题日志记录

主题日志记录是一个非常有用的功能,默认情况下是禁用的。由于布局和页面的内容存储在文件中,可能会发生丢失内容的情况,主题日志记录可以将这些修改产生的变化都记录下来。

启用主题日志记录,可以进入设置——日志——日志设置——启用主题更改。设置完成后,保存设置,刷新页面则可以看见在日志——主题日志,点击可以查看。

文章版权归作者所有,未经允许请勿转载,若此文章存在违规行为,您可以联系管理员删除。

转载请注明本文地址:https://www.ucloud.cn/yun/28831.html

相关文章

  • 收集整理适用博客建站免费开源Wordpress主题-简约好看的WP主题

    摘要:最重要的就是找一个适合自己的主题了。事实上,免费主题也非常多,而且很多的免费主题在功能上和界面美观上已经大大超过了付费的主题。加上这些主题都是开源的,基本上可以在上找得到源码,安全性是没有问题,主题的作者也在不断更新当中。WordPress最重要的就是找一个适合自己的主题了。好一点的WordPress主题基本上都是要收费的,而且价格还不便宜,这导致了不少的新手朋友们很为难。而有时我们仅仅根据...

    番茄西红柿 评论0 收藏2637
  • wordpress主题 酱茄Free v1.0.0开源版自媒体资讯博客主题模板

    摘要:主题主题酱茄开源版自媒体资讯博客主题模板酱茄主题由酱茄开发的一款免费开源的主题,主题专为博客资讯自媒体网站而设计,遵循开源协议发布。wordpress主题 酱茄Free v1.0.0开源版自媒体资讯博客主题模板酱茄free主题由酱茄开发的一款免费开源的WordPress主题,主题专为WordPress博客、资讯、自媒体网站而设计,遵循GPL V2.0开源协议发布。运行环境酱茄Free主题当前...

    番茄西红柿 评论0 收藏2637
  • WordPress 主题开发:从入门到精通(必读)

    摘要:本专栏介绍如何开发设计你自己的主题。你也许想为自己开发主题,或者制作公开发行的的主题。主题的剖析主题目录位于。请避免使用数字名字,这会导致无法在主题列表中正常显示出来。快速简单的入门到了解这一方便简洁的开源系统中。 本专栏介绍如何开发设计你自己的 WordPress 主题。如果你希望了解更多如何安装和应用主题的内容,请参阅应用主题文档。本文的内容不同于应用主题,因为所讨论的是编写代码去...

    luzhuqun 评论0 收藏0
  • WordPress 主题开发:从入门到精通(必读)

    摘要:本专栏介绍如何开发设计你自己的主题。你也许想为自己开发主题,或者制作公开发行的的主题。主题的剖析主题目录位于。请避免使用数字名字,这会导致无法在主题列表中正常显示出来。快速简单的入门到了解这一方便简洁的开源系统中。 本专栏介绍如何开发设计你自己的 WordPress 主题。如果你希望了解更多如何安装和应用主题的内容,请参阅应用主题文档。本文的内容不同于应用主题,因为所讨论的是编写代码去...

    zhaot 评论0 收藏0
  • WordPress 主题开发:从入门到精通(必读)

    摘要:本专栏介绍如何开发设计你自己的主题。你也许想为自己开发主题,或者制作公开发行的的主题。主题的剖析主题目录位于。请避免使用数字名字,这会导致无法在主题列表中正常显示出来。快速简单的入门到了解这一方便简洁的开源系统中。 本专栏介绍如何开发设计你自己的 WordPress 主题。如果你希望了解更多如何安装和应用主题的内容,请参阅应用主题文档。本文的内容不同于应用主题,因为所讨论的是编写代码去...

    TwIStOy 评论0 收藏0

发表评论

0条评论

Rocko

|高级讲师

TA的文章

阅读更多
最新活动
阅读需要支付1元查看
<