October|October CMS - 快速入门 2 基本概念 OctoberCMS-快速入门2基本概念

项目源码地址：https://gitee.com/494901823/O...
文章视频：http://www.365yg.com/i6567357...
基本界面
文章图片

October CMS 的后台管理很简单，没有多余的功能。
首页部分是【仪表盘】显示了系统的基本信息。

文章图片

内容管理系统：这里可以设置页面、部件、布局、内容块、资源和组件。

文章图片

媒体：是用于管理系统中的各种媒体资源，包括图片、音频、视频、文档等。默认是存储在服务器本地的。我们可以上传这些内容到服务器，也可以建立更多的目录对这些资源进行分别存储。

文章图片

设置：默认情况下设置里面没有太多的设置，默认包含邮件、日志以及系统和内容功能。我们可以在系统中进行管理员的管理，用于控制用户具有的权限。后面，我们将学习插件是如何工作的。

文章图片

点击右上角的用户图标，我们可以查看用户的配置文件。并且，我们可以从这里退出当前用户。
基本概念
文章图片

这个网站的首页是如何生成的呢，如何进行管理这些页面呢？

文章图片

这部分就是October的核心，页面里面包含了404页面、ajax页面、500错误页面，首页和演示插件。从其显示的URL可以知道，我们的首页内容是Demonstration这个页面。
我们点击这个条目，就可以看到如下的界面：

文章图片

我们也可以看到【标题】和【URL】分别就是设置页面名称和访问URL的。我们可以非常方便的进行修改。在【设置】选项卡，我们可以看见，URL为 / 的对应的文件名为home.htm，使用的布局是 default 。再下面黑色部分就是代码编辑器。
home.htm是一个真实存在的页面。它就存在于文件系统中。如下图所示。

文章图片

通过查看这里的home.htm文件，我们就可以很简单的知道，我们的主页其实就是一个静态页面。如果我们自定义这些页面、部件、布局、内容等，就可以自己定义自己的前端页面了。

title = "Demonstration" url = "/" layout = "default" ==

home.htm中的顶部这些代码就是定义页面的一些属性。我们通过修改这些属性，他们会同时体现在后台系统中。

title = "Homepage" url = "/" layout = "default"

修改完成后，在编辑器里面保存此文件。然后在后台刷新页面，然后再次打开【页面】菜单，我们将看到我们的修改生效了。

文章图片

可以很简单的体会到，我们通过后台管理系统可以很方便的设置这个Home.htm文件的内容了。另外，我们通过下面的【元素】选项卡，可以设置有关SEO的内容，如meta标题和描述信息。

文章图片

下面我们将建立一个about页面对象。看看操作具体怎么做。

文章图片

在上图中，点击增加，则会出现在右侧一个新的选项卡【新页面】
填写标题为About,则

文章图片

选择布局为default，并在代码编辑部分写上些什么，然后保存并刷新页面。

文章图片

然后我们打开编辑器，可以看见，系统新建了一个文件

文章图片

如何访问这个页面呢？
http://octobermovie.dev.raise...

文章图片

通过上面的页面信息，我们可以看到这个页面包含了头部信息和尾部信息。那么这个about信息就是对应的layout中的{% page %}

文章图片

我们进一步研究home.html,可以看见

文章图片

{% content "welcome.htm" %}
对应的就是

文章图片

其代码则是：

文章图片

因此，我们可以知道，调用/content/welcome.html的方法就是：{% content "welcome.htm" %}
同样道理，我们调用header和footer则是调用部件site/header site/footer
{% partial 'site/header' %}
{% partial 'site/footer' %}

文章图片

文章图片

通过上面的介绍，我们知道了如何使用页面、部件、布局和内容块。下面是组件
我们演示一个关于组件的管理和使用：
组件的使用

文章图片

打开设置——更新——可以看到检查更新、安装插件、管理插件；点击安装插件，并在搜索框中输入“Blog”，并安装插件。

文章图片

安装完成后，系统将出现一个新的菜单“博客”。点击菜单：

文章图片

在这个界面中，可以创建帖子、查看已有的帖子，管理分类等。
创建新的分类：

文章图片

创建新的帖子：

文章图片

为这个帖子设置分类：

文章图片

设置这个帖子的其他信息：诸如发布时间、摘要或者图片。

文章图片

如何显示这些博客信息：
进入内容管理系统，为博客建立一个页面：这里显示博客的列表，并使用默认布局。
点击左侧的组件，

文章图片

可以看见“帖子列表”，鼠标点住帖子列表，拖动到编辑器内，释放鼠标，你可以看见如下图所示的界面。在代码中出现了：{% component 'blogPosts' %} 。在上部出现了一个悬浮框，名称为帖子列表。

文章图片

点击“保存”。
然后在浏览器中输入 http://octobermovie.dev.raise...

文章图片

然后你就可以看见刚才后台中的两个帖子的列表。
如果我们想自定义这个帖子显示的内容和格式怎么办？
回到内容管理系统选择Blog页面，然后把鼠标点击编辑器中的 component 这个单词。其编辑器右边会出现一个叉号图标：

文章图片

点击这个叉号图标，通过下面显示的代码，我们可以很容易的找到显示帖子的标题、发布时间、分类及正文的相关内容：

文章图片

比如，我们在标题上面显示发布时间，则将下面的代调换一个位置就可以了

Posted {% if post.categories.count %} in {% endif %} {% for category in post.categories %} {{ category.name }}{% if not loop.last %}, {% endif %} {% endfor %} on {{ post.published_at|date('M d, Y') }}

保存并刷新页面：

文章图片

当我们点击帖子的标题链接时，你会发现，它始终是显示当前的界面。并没有引导我们展示帖子的内容。因此，我们需要创建一个显示帖子内容的页面：
进入“内容管理系统”——“页面”——“新建页面”
根据上面的学习内容，分别设置页面标题为“Blog post”；URL：“/blog/:slug”；添加插件“帖子”。